意外惊喜——Electron

5,258 阅读3分钟

Electron is what?

由Github开发,Electron是一个使用JavaScript,HTML和CSS等web技术创建原生程序的框架。他在应用中运行Chromium浏览器,并负责处理应用与操作系统之间的复杂部分,而你只需要在这个舞台上登台演出。

Electron怎么样提供一个舞台?

Electron通过将Chromium和Node.js合并到同一个运行时环境中,并将其打包为Mac,Windows和Linux系统下的应用。

简而言之,Electron就像提供了一个沙箱。该沙箱内拥有浏览器运行环境,使得开发者能够运用web技术进行应用内部编写。但沙箱是在操作系统上直接运行的,所以同时应用也拥有了与操作系统直接打交道的能力。能够拥有桌面应用的全部能力。

跨平台的能力

Electron由Chromium和Node.js,加上各操作系统的Native API组成。

除了不同平台Native API不同以外,Node.js和Chromium都拥有跨平台的能力,这也为Electron生来就能做跨平台的应用开发。

一个Electron应用主要由两大部分组成,Main(主)进程和Renderer(渲染)进程。

简单介绍两个进程的概念:

Main进程主要通过Node.js、Chromium和Native API来实现一些系统以及底层的操作,比如操控文件系统,读取硬件输入输出,创建应用窗体等。

Renderer进程主要通过Chromium来实现APP的图形界面——就是平时我们熟悉的前端开发的部分,不过得到了electron给予的加强,一些Node的模块(比如fs)和一些在Main进程里能用的东西(比如Clipboard)也能在Render进程里使用。

Main进程和Renderer进程通过Electron提供的API ipcMainipcRenderer来进行通信。通过事件监听和事件派发来实现两个进程通信,从而实现Main或者Renderer进程相互配合完成某些复杂的功能。

图片引用自PicGo教程文章

Electron的优缺点

缺点:

  1. 打包体积较大

    作为非传统编写桌面应用的语言,Electron在支持跨平台上做了不少处理。

  2. 为了跨平台,可能需要额外再处理一下

    不同操作系统的Native APIs在功能,数量上。都是不一样的。在某些操作系统上支持的API,但在另外的系统中缺不拥有此能力。

  3. 性能问题

    作为非传统编写桌面应用的语言,Electron的运行速度比不上更为底层的编程语言。做轻量级应用没问题,重量级应用尤其是CPU密集型应用的话问题较大。

优点:

  1. 跨平台的能力

  2. 开发图形化界面非常的简单

    比起C#\QT\MFC等传统图形界面开发技术,通过前端的图形化界面开发明显更加容易和方便。而且web的渲染效果非常出色。只需掌握web开发知识就能开发桌面应用。

  3. 详细方便的文档

    虽然文档内容密集如海,但重点内容均人工翻译过来并且非常的详细。在开发上提供了极大的便利。 虽然还是有些机翻的页面

使用Electron,web技术开发人员也能够轻松进入桌面应用这一领域。我司也借助了electron开发了一套内部使用的即时通讯软件,项目完成后开始总结出一路以来的经验和坑。

Have a nice day.

参考学习文章

Electron图床应用

Electron官方模板

Electron-vue开发实战

Electron常见知识点

Electron打包