Electron + React 开发一款属于自己的 Markdown 笔记管理应用

Electron + React 开发一款属于自己的 Markdown 笔记管理应用

01、项目简单介绍

本项目根据视频教程的观看,自己动手实现了一遍;并且把学习过程进行的记录,从而有了此篇文章。
希望文章可以帮助其他想要学习的小伙伴!
小伙伴们可能需要有 HTML、CSS 和 JavaScript 基础知识
下面是整个项目的一个技术图谱
项目整体技术栈

02、项目环境搭建

  • 前置环境

    • NodeJS(版本最好在 10 或以上)
    • npm 或者 yarn
  • 创建项目

    # 克隆示例项目的仓库
    git clone https://github.com/electron/electron-quick-start
    
    # 进入这个仓库
    cd electron-quick-start
    
    # 安装依赖并运行
    npm install && npm start
    # 或者使用 yarn
    yarn  && yarn start

    运行项目,如下图所示;则表示基础项目搭建完成
    基层项目效果

03、前置知识点

进程和线程

  • 进程

    进程是一个在内存中运行的应用程序。每个进程都有自己独立的一块内存空间,一个进程可以包含多个线程

    进程有自己的独立地址空间, 每启动一个进程, 系统就会为它分配地址空间, 建立数据表来维护代码段、堆栈段和数据段,这种操作非常昂贵。

  • 线程

    线程是进程的一个执行单元, 是进程内调度的实体、是 CPU 调度和分派的基本单位, 是比进程更小的独立运行的基本单位。线程也被称为轻量级进程, 线程是程序执行的最小单位。

    线程是共享进程中的数据的, 使用相同的地址空间, 因此 CPU 切换一个线程的花费远比进程要小很多, 同时创建一个线程的开销啊也比进程要小很多。

    线程之间的通信更方便, 同一进程下的线程共享全局变量、静态变量等数据, 而进程之间的通信需要以通信的方式进行

  • 进程和线程的区别

    线程具有许多传统进程所具有的特征,故又称为轻型进程(Light—Weight Process)或进程元;而把传统的进程称为重型进程(Heavy—Weight Process),它相当于只有一个线程的任务。在引入了线程的操作系统中,通常一个进程都有若干个线程,至少包含一个线程

    根本区别:进程是操作系统资源分配的基本单位,而线程是处理器任务调度和执行的基本单位

    资源开销:每个进程都有独立的代码和数据空间(程序上下文),程序之间的切换会有较大的开销;线程可以看做轻量级的进程,同一类线程共享代码和数据空间,每个线程都有自己独立的运行栈和程序计数器(PC),线程之间切换的开销小。

    包含关系:如果一个进程内有多个线程,则执行过程不是一条线的,而是多条线(线程)共同完成的;线程是进程的一部分,所以线程也被称为轻权进程或者轻量级进程。

    内存分配:同一进程的线程共享本进程的地址空间和资源,而进程之间的地址空间和资源是相互独立的

    影响关系:一个进程崩溃后,在保护模式下不会对其他进程产生影响,但是一个线程崩溃整个进程都死掉。所以多进程要比多线程健壮。

    执行过程:每个独立的进程有程序运行的入口、顺序执行序列和程序出口。但是线程不能独立执行,必须依存在应用程序中,由应用程序提供多个线程执行控制,两者均可并发执行

Electron 主进程和渲染进程

  • 主进程(Main Process)

    • 可以使用和系统对接的 Electron API;如创建菜单、文件上传等等
    • 创建渲染进程(Renderer Process)
    • 全面支持 NodeJS
    • 只有一个程序入口点作为整个应用的入口
  • 渲染进程(Renderer Process)

    • 可以有多个,每一个对应一个窗口
    • 每一个都是一个单独的进程
    • 全面支持 NodeJS 和 DOM API
    • 可以使用一部分的 Electron API
  • Electron 进程关系图:
    进程关系图


  转载请注明:

文章作者: Diviner
文章链接: http://www.diviner.site/archives/4604c28e.html
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 Divinerの博客 !

评论
 本篇
下一篇 
Hexo和Gitee搭建个人博客网站 Hexo和Gitee搭建个人博客网站
Hexo 和 Gitee 搭建个人博客网站前置环境搭建安装 Node.js 和 git 根据自己的操作系统下载对应的安装包,进行安装 NodeJS 下载地址 Git 下载地址 检查安装是否成功 打开终端,分别输入 node -v 和
  目录