前言

以前从没接触过electron，可以说也没听过（孤陋寡闻~）。目前在做桌面端应用，就来大概说一下electron主要的两个进程。大家可以先大概了解一下，附上地址： Electron 官网

主要讲解内容如下：

什么是electron
electron的主进程、渲染进程
主进程、渲染进程交互

关于electron

1. 什么是electron

Electron是由Github开发，用HTML，CSS和JavaScript来构建跨平台桌面应用程序的一个开源库。Electron通过将Chromium和Node.js合并到同一个运行时环境中，并将其打包为Mac，Windows和Linux系统下的应用来实现这一目的。

2. electron的环境

Electron环境其实包含了浏览器环境、Node环境、系统原生的一些API,包含了浏览器环境、Node环境也就意味着其实也包含了v8语言解释器。因此在Electron里可以运行浏览器的api，node的api，部分系统的api调用。

electron的主进程、渲染进程

1. 主进程

每个 Electron 应用程序都有一个主进程，作为应用程序的入口点。主进程在 Node.js 环境中运行，这意味着它能够require模块化和使用所有 Node.js API。

举例说明：创建一个demo项目，新建main.js，js代码如下：

// main.js
const { app, BrowserWindow } = require('electron')

app.on('ready', () => {
  let win = new BrowserWindow({
    width: 500,
    height: 300
  })
  win.loadFile('index.html')
})

BrowserWindow 类用来创建一个页面，也就是一个渲染进程，但是它只能在主进程中使用。这里不是说 BrowserWindow 创建的窗口是主进程，而是指整个 main.js 这个脚本是主进程，而主进程拥有 new 一个 window 的能力。所有的页面（渲染进程）都应该由主进程来统一管理调度。

2. 渲染进程

每个页面都是一个渲染器进程，所以上面的 BrowserWindow 创建的页面就是跑在渲染器进程上的。可以用最熟悉的浏览器来给大家介绍主进程、渲染进程。其实浏览器这个应用本身，是一个进程，打开它就会运行起一个主进程(当然会有其余辅助子进程，暂不考虑),当我们打开一个标签页的时候，就开启了一个渲染进程。

主进程、渲染进程通信

Electron 模块提供了 ipcMain 和 ipcRenderer 可以很方便的实现 Electron 进程间的通讯。

主进程代码

const { ipcMain } = require('electron')
ipcMain.on("send-message-to-main",(event,args)=>{
  console.log("主进程接受到的数据是:",args);
  event.reply("send-message-to-renderer","这是来自主进程的问候");
})

渲染进程代码

const { ipcRenderer } = require('electron')；
ipcRenderer.on("send-message-to-renderer",(event,args)=>{
  console.log("渲染进程收到的数据:",args);
})
ipcRenderer.send('send-message-to-main', '这是来自渲染进程的问候')

Electron主进程与渲染进程

前言