本章包括

• 了解Electron是什么
• 学习Electron是建立在什么技术基础上的
• 了解使用Electron与传统Web应用程序的不同之处
• 构建Electron应用
• 在产品中使用Electron来构建真实的应用程序

网络的最大优势就是无处不在。它天生是一个创建协作应用程序的出色平台，并且可以从运行不同操作系统的各种设备上访问这些应用程序。换句话说，整个应用程序也离不开浏览器环境，Web应用程序无法访问文件系统，不能执行非JavaScript编写的代码，它们不能像桌面应用程序那样调用众多的操作系统API。而且，当没有可靠的网络连接时，大多数web应用程序都不无法使用。

长久一来，构建桌面应用程序都要采用另外一种完全不同的技术栈，而我们许多人没有那么多时间来学习新语言和架构。有了Electron，你可以使用Web开发人员已有的技能，来构建具有许多本地桌面应用程序功能的应用程序。

1.1. 什么是Electron？

Electron是一个运行时，它允许你使用HTML5、CSS和JavaScript创建桌面应用程序,这是由GitHub的工程师Cheng Zhao（又名zcbenz）发起的开源项目。先前Electron被称为Atom Shell，是Atom的基础，Atom是GitHub使用web技术构建的跨平台文本编辑器。

你可能听说过或使用过Apache Cordova或Adobe PhoneGap来构建web应用程序，这些应用程序是用原生shell打包的，用于iOS、Android和Windows Phone等移动操作系统。这样的话，将Electron看作是类似构建桌面应用程序的工具可能更有助于理解。

Electron允许你使用已经掌握的web技术来构建应用程序，这正是我们使用它的原因。在本书中，你将了解如何构建在Windows、macOS和Linux上，可以调用本地操作系统API的应用程序。

Electron集成了Chromium Content Module和Node.js运行时，可以让开发人员使用web页面来构建GUI，并通过与操作系统无关的API来访问Windows、macOS和Linux操作系统的能力。

Chromium和Node本身都是广受欢迎的应用程序平台，它们都可单独用于创建大型应用程序。Electron将这两个平台结合在一起，允许你使用JavaScript构建一个全新的应用程序类别。浏览器中能做的任何事，都可以使用Electron实现。Node能做的任何事，也都可以使用Electron实现。

令人兴奋的是，这两种技术结合起来能做什么。你可以构建利用这两个平台的应用程序，也可以构建仅在一个平台上不可能实现的应用程序。这正是本书所关注的全部内容。Electron不仅是构建类似于本地桌面程序的web应用的最佳选择；它也是围绕Node应用程序构建GUI的不错选择，否则这些应用程序将受限于命令行界面。参见图1.1。

图1.1 LevelUI

图1.1 LevelUI是一个使用Electron构建，用于Node的LevelUp数据库的GUI。你无法在传统浏览器中构建此应用程序，因为它无法访问用户计算机上的本地数据库。它也不能使用LevelUI库，因为它是一个编译好的C++模块，只有Node（而不是浏览器）可以使用。

假设你希望构建一个应用程序，该应用程序可以查看和编辑计算机上的图像文件夹。传统基于浏览器的应用程序无法访问文件系统，它们无法访问照片目录，无法加载目录中的任何照片，也无法保存你在应用程序中所做的任何更改。使用Node，你可以实现所有这些特性，但不能提供GUI，这使应用程序难以让普通用户使用。通过将浏览器环境与Node结合起来，你可以使用Electron创建一个应用程序，该应用程序中可以打开和编辑照片，并为这些操作提供交互界面，如图1.2。

图1.2 Electron结合了Chromium的核心web浏览器组件和Node的底层系统访问。

Electron不是一个复杂的框架——它是一个简单的运行时。与在命令行中使用node的方式类似，可以使用electron命令行工具运行Electron应用程序。你不需要学习很多条条框框就可以开始，你可以自由地按照自己的意愿来构造应用程序——尽管我在本书中提供了一些技巧和最佳实践。

1.1.1. 什么是Chromium Content Module？

Chromium是Google Chrome web浏览器的开源版本，之间共享了大量相同的代码和特性，但有一些细微的差别，以及采用了不同的授权。Content Module是允许Chromium在独立进程中渲染web页面，并使用GPU加速的核心代码，它包括Blink渲染引擎和V8 JavaScript引擎，是web浏览器的核心。它从web服务器获取并呈现HTML，加载所有引用的CSS和JavaScript，对页面进行相应地渲染，并执行JavaScript脚本。

研究Content Module最简单的方法是找它没做什么。Content Module不包含对Chrome扩展的支持；不与Google云服务同步书签和历史记录；在你访问页面时，它不能安全地存储密码，也不能自动填充密码；不会检测页面内容是否是使用其他语言文字编写的，而请求Google翻译服务提供帮助。Content Module只包含渲染HTML、CSS和JavaScript所需的核心技术。

1.1.2. 什么是Node.js？

JavaScript存在的前15年，通常是与web浏览器隔离的。支持在服务器上运行JavaScript的方式并不多，这样的项目是的，但它们从未引起任何注意。Node.js项目最初发布于2009年，是一个开放源码、跨平台的运行时，用于使用JavaScript开发服务器端应用程序。它使用Google的开源V8引擎来解释JavaScript，并添加了用于访问文件系统、创建服务器和导入外部模块的API。

在过去的几年中，Node受到了广泛的关注和欢迎，并被广泛用于各种用途，从编写web服务器到控制机器人，再到（你可能猜到了）构建桌面应用程序。Node附带了一个名为npm的包管理器，凭借其25万多的注册库，可轻松实现包的管理。

《Electron实战》中文版！