原创 赵伟敏 Garfield的世界 2020-03-30 22:45
这是之前我参加总公司技术会议时的手稿，做了一些修改。
今天我给大家分享一下客户端开发的流行技术—Electron。说到客户端技术，我过去接触过很多，诸如windows服务，console app，windows form，WPF等等。windows service，console app这种的没什么界面，都是偏向功能方面，windows from(简称winform)倒是可以做出窗体程序，但大多不好看，或者说默认情况下它的呈现是依赖操作系统对控件的渲染，并且也存在较严重的不同分辨率下的适配问题，这些都是技术本身的定位决定的。那么你想做的好看也不是不可能，就是要跨越这个障碍，在一番周折后倒是勉强好看了些，但性能也将出现问题。
(一个不同的窗体)
WPF技术在UI方面做的不错，并且在性能上也有了质的提升，毕竟是基于硬件加速技术。但是开发成本也不低，你要学习它的xaml语法，来构建UI布局，动画和3D处理等等，需要学习成本，而且微软的技术，开源方案较少，很多都要自己造轮子，令人身心俱疲。
(知名WPF开源项目FamilyShow)
另外，如果你想开发一个插件程序，希望核心程序能动态加载各个子模块系统，甚至做热拔插，这里就会遇到一个问题：资源的占用。我们知道，一个单进程程序在x86系统上占用的内存是2GB，x64会高一些达到4GB，但无论如何，如果你的程序+插件过于庞大，超过了这些限制，就将面临崩溃。更何况哪怕你只是接近这个内存限制的时候，程序本身就会有一些性能方面的影响了。另外，这种基于单进程的插件系统，一旦某个插件崩溃将可能导致整个进程挂掉，这将是一个灾难。
(我希望是这个样子的)
这个原型，看起来很像时下流行的浏览器比如Chrome是吗？那么你是否有发现，Chrome其实是一个多进程的浏览器？在Chrome中一个tab就是一个进程，这样带来的好处，除了增加系统利用率能提高单个应用性能外，因为进程之间是隔离的，所以单个应用的崩溃也不会影响到整个宿主程序。那么如果Chrome可以实现这些，是否也有类似的技术手段可以让我们也能实现呢？
有的！那就是Electron。
Electron
Electron是github设计并开源的一套客户端开发框架，有一些几个特性：
● 基于web技术
● 化繁为简
常见的客户端程序的一些需求在elecron都有实现方案，比如支持自动更新，过去我们都要找第三方的技术支持，现在electron官方就支持自动更新了。再比如应用程序打包，过去我们也是依赖第三方的，因为微软官方的打包--那就是个笑话是吧？那么现在这个electron也支持了。其他方面比如调试，日志跟踪等等也都是支持的。
开发环境
开发环境要求windows7以上版本，同时这也是生产环境的最低系统版本要求。相信现在已经没人用xp了吧？哦，当然mac和linux系统下也是可以进行electron项目开发的，这里就不详细说了。
electron的项目说到底还是一个nodejs项目，因为electron本身也是通过npm来管理安装，npm install一下即可。所以首先你要有nodejs环境，如果你会搭建nodejs项目那么electron也是比较容易的。
IDE。可以用时下流行的visual studio code，顺便说一句，visual studio code也是electron技术开发的。
进程管理
electron在进程管理方面是分为两种进程--主进程和渲染进程。
当一个electron程序启动后会首先进入主进程流程（并且只有一个主进程），主进程主要负责整个程序的生命周期管理，如启动，停止，还有就是程序窗口的渲染和处理，右下角托盘等等GUI相关。当程序启动后需要加载html web页面了，这个页面将是一个渲染进程，并且多个渲染进程是独立的。electron的api对于主进程和渲染进程也是有访问限制的，操作主进程GUI的api是无法在渲染进程直接使用的，因为这看起来比较危险，而且这是跨进程的，当然如果你想在渲染进程中调用主进程GUI的话，比如你在网页里希望点击按钮关闭程序窗口，electron也是提供了进程通讯机制来实现，这是可以做到的。这毕竟是C端程序的一个很常见的需求。
那么说到这里，大家应当可以想到，一个electron程序运行后，在系统资源管理器中将会是多个进程，这取决于你同时加载几个web页面，就像Chrome那样。
生态
案例
如图，两个tab是两个应用，它们通过插件形式加载到宿主程序中，并且在系统进程中它们也是独立进程形式存在。
联系客服
