Electron新手入门--01.认识Electron

1,009 阅读3分钟

这是我参与8月更文挑战的第7天,活动详情查看:8月更文挑战

认识Electron

1.1 Electron的由来

如果想开发一个桌面GUI应用,并且能兼容Mac, Windows, Linux,可选的技术框架并不多,在早起人们主要用的是wxWidgetsGTKQt这几个框架来完成开发,但他们都是基于C/C++语言来开发的,我们前端同学上手是非常困难的。

Stack Overflow的联合创始人 Jeff Atwood 说过 凡能用 Javascript 实现的, 注定会备用 Javascript实现。于是 NW.jsElectron 就印入眼帘,给前端开发人员提供了极大的便利。

image.png

NW.js 和 Electron 两个框架都是基于 ChromiumNode.js 实现的,这可以使前端很轻松的使用 html, css, js构建跨平台桌面应用。

由于Node.js和前端技术访问系统API方面表现不足,这两个框架内部都对系统API做了封装,例如:系统对话框、系统托盘、系统菜单、剪切板等。

NW.js VS Electron

Electron 区分主进程和渲染进程。主进程负责创建、管理渲染进程以及控制整个应用的生命周期,渲染进程则负责控制显示页面与用户的交互。 NW.js则无需关注这些,他需要关注的是所有窗口共享同一个Node.js环境带来的问题。

能力ElectronNW.js
崩溃报告内置
自动更新内置
社区活跃度良好一般
周边组件较多一般
开发难度一般较低
知名应用较多一般
维护人员较多一般

1.2 Electron的应用

最出名的莫过于Visual Studio Code了, 其次还有 Skype桌面版WhatsApp桌面版Postman等等。

1.3 Electron生态

electron-builder是Electron的构建工具,它提供了自动下载、自动构建、自动打包、自动升级等能力,大多数流行的Electron应用都是用它进行构建和分发的。

在Electron应用内存取本地数据,可以使用Cookie、localStorage这些传统的前端技术。也可以选择Electron生态内的一些方案,例如rxdb是一个可以在Electron应用内使用的实时NoSQL数据库;也可以在Electron内使用SQLite数据库。

1.4 Electron的优势

Electron是基于Web技术开发的桌面应用。Web技术是现如今软件开发领域应用最广泛的技术之一,入门门槛较低,生态繁荣。

由于Electron内置了Chromium浏览器,所以几乎不需要考虑兼容性问题。我们可以在Electron应用中使用HTML5、CSS3、ES6标准中定义的API.

1.5 Electron的不足

  • 打包后应用体积偏大: 一个简单的应用压缩打包后至少也要40MB.
  • 开发复杂度较大: 跨进称通信是必须要了解的知识点。
  • 版本发布过快: 为了跟上Chromium的版本发布节奏, Electron也有非常频繁的发布机制。可能会导致出现许多新问题。
  • 安全性问题: Electron把一些有安全隐患的API都设置为默认不可用的状态,但这些模块和API有时非常有用,开发者有时会打开这些开关,但一旦处理不当,就会有安全隐患。
  • 资源消耗过大:Electron底层基于Chromium浏览器一直以来都因资源占用较多被人诟病。
  • 兼容性:Electron还不支持老版本的Windows操作系统,比如Windows XP