【我为什么要撰写本书】
我在2015年上半年的时候开始关注NW.js和Electron,下半年开始在实际项目中应用NW.js,那个时候两个项目的发展势头同样迅猛,分不出孰优孰劣。后来Electron领域出了几个杀手级应用(Visual Studio Code、Slack等),开发团队和社区维护者越来越积极地维护此项目,很多开发者在做技术选型的时候就更倾向于使用Electron了。
我也不例外,在公司内部做的项目和我业余时间做的项目,只要涉及桌面GUI,我基本都会选择Electron。用Electron开发的应用非常稳定,运行效率可媲美原生C/C++应用,且社区资源丰富,即使是一些冷门的需求也能找到解决方案;Electron维护者非常专业、友善,开发者的Issue和Pull Request回复得也非常及时。
但开发者想进入这个领域并开发出一个成熟、稳定的商业应用并没有那么简单,这主要是以下几方面原因导致的。
●官方文档片面:Electron使用JavaScript、HTML和CSS构建跨平台的桌面应用,但官方文档涉及的JavaScript、HTML和CSS相关的知识并不多,以介绍Electron自身的API为主,另一个重要成员—Node.js几乎未涉及。如何把这些知识与Electron的知识结合起来构建应用,成为开发者入门面临的第一个困难。
●学习资料匮乏:目前国内图书市场中只有两本由国外引入的与Electron相关的书,其中一本花了一半的篇幅讲解NW.js。书中存在无关内容多、关键知识点及周边知识少、与国内开发者实际需求不符、存在过时内容等问题,不利于读者自学。另外,虽然Electron社区中有相关内容,但内容良莠不齐,不具备系统性学习的条件。这是新手面临的第二个困难。
●Electron本身自由度太高,导致“坑多、坑深”:为了保证开发者的自由度和使用的便捷度,Electron提供了丰富的API,使开发者通过Electron可以轻松开发各领域五花八门的应用,但这也给开发者带来了诸多隐患,比如,API使用不当可能导致应用程序存在严重的安全问题(用户计算机控制权被窃取)和性能问题(百倍千倍的性能差异)。这是新手面临的第三个困难,而且可能是他们自己也还不知道的问题。
●用对、用好Electron生态内的资源具有相当大的挑战:在Electron本身迅猛发展的同时,其社区生态也呈爆发式增长,兼之Electron可以复用Web和Node.js
生态内的组件,这使得开发者在组件选型时经常会犯错。比如,我就不推荐在Electron应用内使用jQuery、axios和electron-vue等组件。这是新手面临的第四个困难。
以上这些困难也曾使我备受困扰,为让广大开发者不再重走我的痛苦之路,我决定撰写本书。
【本书主要内容及特色】
★1.本书大部分内容是官方文档中没有的
在书中我用大量篇幅介绍了ES6、HTML5和CSS3是如何与Electron结合的,比如动画效果、Web安全、HTML系统通知、WebSocket通信、音视频设备访问、CSS扩展语言等。
本书还用很大篇幅介绍了Node.js是如何与Electron结合的,比如:Node.js为何擅长处理IO密集型业务;Node.js是如何使用命名管道进行通信的;Node.js是如何完成加密、解密的(其中包括我为什么不推荐使用网上大量传播的加密、解密方法)。
本书用了一整章的篇幅介绍现代前端框架如何与Electron整合,其中包括Vue、React、Angular、webpack。
本书介绍了众多在Electron项目中常用的优秀第三方库,比如electron-builder(打包发布工具)、Debugtron(生产环境调试工具)、Dexie(IndexedDB封装库)、Jimp(图像处理库)等。
★2.本书以更合理的方式组织内容
我在撰写本书时始终秉持以渐进的方式传递知识的理念。因此,我并没单独拿出几章内容枯燥地介绍ES6、HTML5和CSS3等相关知识,而是把这些知识分散到书中各个章节中,以Electron为主线,由浅入深地传递给读者。
我把分散在各个角落的知识点按应用场景组织在一起,比如kiosk本是Electron窗口类的一个API(用于自助服务机),print是webContents类的API(用于控制打印机),我把它们与HTML5访问媒体设备的知识、Electron电源控制的知识整合在一起放在“硬件”章节。类似的知识组合在本书中随处可见。此外对于其他很多官网没有介绍但对Electron应用很有价值的CSS、JavaScript知识,我都做了较合理的整理和编排。读者阅读本书时即能有所体会。
与实战类的图书不同,本书不会试图组织一些实际案例来从头到尾讲它们是如何实现的,而是把实际案例中涉及的问题、难点、易错点剥离出来,讲精讲透。本书最后一章安排了一个真实案例,但也只讲关键环节的内容,不会大量地粘贴与Electron无关的代码。
那些一看就会、一看就懂的Electron知识我没有过多讲解,但诸如如何在Electron中读取访问受限的Cookie、如何保护客户数据等知识,本书都是用一线案例讲解的。
本书并不试图面面俱到地讲解Electron的所有内容,而是只讲解项目一线实战中会涉及的重要内容,比如脚本注入、无边框窗口等。被官网或社区标记为已过时的接口和插件本书不会讲解。在选择第三方社区插件时,我尽量选择了更新较频繁、使用用户较多的来使用。
★3.本书有足够的知识广度和知识深度
本书并不是一本专门讲解Electron的书,除Electron相关知识外,还介绍了大量的JavaScript、HTML、CSS、Node.js、桌面软件开发、多进程控制、安全、社区资源及背景故事等知识。Electron是本书的主线,每章知识全部是为Electron服务的,所以说本书的知识有广度。
本书的知识也有深度。举个例子,初学者可能苦于渲染进程与主进程通信的难度而大量使用remote技术。但初学者不知道的是,remote技术使用不当可能导致某些关键环节有百倍千倍的性能差异,甚至会导致不易排查的错误和安全问题的出现。这些问题背后的原理是怎样的呢?类似这样有深度的知识,在本书中有很多。
【如何阅读本书】
如果把所有技术书的学习难度系数从低到高设为1~10,那么本书难度系数应该在7左右。书中涉及从桌面软件开发到前端网页开发的知识,知识点非常多,虽然不涉及Electron的源码,但对关键点的运行原理都做了介绍。
本书力图每一章讲一个方面的知识,每一小节讲一个知识点,每一小节尽量不安排太多内容,让读者能更轻松地获取知识,以提升阅读体验。
如果几个小节的知识间有关联,我会尽量把基础的、工具类的知识安排在前面。比如,我会讲完主进程与渲染进程之后,马上讲如何引入现代前端框架,因为后面的知识需要用到现代前端框架。
至于广为人知的HTML5、CSS3和ES6,本书不会展开讲解。而一些JavaScript的知识是在ES6之后才被加入标准的,但由于ES6的巨大变革,业内普遍把ES6及以后加入的知识统称为ES6,本书也遵循这一共识。
书中带边框的区域,放置重点内容或扩展阅读的内容,重点内容前面会标记“重点”二字,扩展阅读内容前面会标记“扩展”二字。
书中无边框且有灰色背景的区域放置与内容相关的源代码、命令行指令或命令行输出内容。
【读者要求】
本书假定读者具备一定的前端知识,读者应该有使用HTML、CSS、JavaScript开发网页的经验,能熟练使用JavaScript操作网页中的Dom元素;
对Node.js有一定的了解,能使用Node.js常用的包管理工具npm或yarn创建项目并给项目添加依赖包;
对浏览器的工作原理有一定的认识,知道怎么用开发者工具调试前端代码;
了解HTTP协议,知道如何使用AJAX发起HTTP请求。