Electron使用指南之初体验

Electron 介绍

1、概览

想必你已经听说了可以应用electron来构建令人惊叹的桌面应用程序！

长期以来，很多开发语言都保留了生成桌面应用程序的功能，比如C和Java，但是用这些语言来构建应用程序是非常困难的。

我们利用JavaScript，HTML和CSS这些Web技术来构建单个应用程序，然后为Mac windows 和 Linux 编译该应用程序。

此外，我们还可以使用我们喜欢的框架和库来实现这个程序，比如 Vue, React 等前端框架。

Electron完全跨平台，她兼容 Mac、Windows 和 Linux，可以构建出三个平台的应用程序。

我们先来搭建一个Electron的运行环境。

2、Electron 原理

在深入学习Eelectron 之前，我们有必要了解一下Electron的应用架构。

Electron 运行在两类进程中，一类是主进程，一类是渲染进程 我们要知道，electron是基于chromium才能工作的，那我们就先简单看下chromium架构：

我们再来看看electron在chromium的基础上做了什么：

• Renderer Process

在electron中，仍然使用Renderer Process渲染页面，也就是说electron app使用Web页面作为UI显示，并且兼容传统的Web页面。不同的是electron app开发者可以可选的配置是否支持Node.js。

• Main Process

electron对Browser Process改动较大，干脆另起一个名字叫Main Process。Main Process 除了原来chromium的runtime，又添加了Node.js的runtime，main.js便运行在此之上。

electron将Node.js的message loop和chromium联系起来，使得js中可以灵活的控制页面显示，以及和Renderer Process的IPC通信。 进程间通信(IPC,Inter-Process Communication)指至少两个进程或线程间传送数据或信号的一些技术或方法。 当然原生的Node API和第三方的node module同样支持，并且有electron API提供给开发者控制原生菜单和通知等。 有一点需要注意，Browser Process本来没有js运行时，所以还需要依赖V8（当然这是chromium中的V8，不是单独的V8库）。

总结一下，一个Main Process(主进程），一个或多个Rederer(渲染进程) 构成了Electron的运行架构。 我们姑且把主进程叫Server-side服务端，将rederen process叫客户端。

• electron 使用 Node.js 原生模块