Electron-为21世纪打造的文本编辑器的基础

Electron-为21世纪打造的文本编辑器的基础

flyfish 2015-11-21

题目的产生
Github的atom和微软Visual Studio Code这两款开源的编辑器是利用Electron开发的，atom对外宣传有个for the 21st Century
所以文本的题目由此产生。

Note: Electron was previously named Atom Shell.

注意： Electron先前的名字叫Atom Shell
以atom为例
从技术上简单理解就是atom以网页做为GUI，使用JavaScript控制，与迷你Chromium浏览器内核集成，让开发者使用web技术开发各种功能.

atom是基于Electron开发的，在Electron网站上可以看到Visual Studio Code也是基于Electron做的。
Electron是基于Chromium and Node.js技术架构，Google chrome 是基于 chromium 开发的非常优秀的浏览器，国内很多浏览器内核的选择如

是，Electron的选择同样也是。
libchromiumcontent库封装了Chromium的Content API
brightray库又让libchromiumcontent 易于使用

分层的结果是产生了专注，而专注会做的更好

上述的atom，electron ，brightray， libchromiumcontent在github都有源码

它的宣传语：A hackable text editor for the 21st Century
因为atom是插件式开发的，所有它的功能会很强大

Electron 介绍

Built on Electron

With Electron, creating a desktop application for your company or idea
is easy. Initially developed for GitHub’s Atom editor, Electron has
since been used to create applications by companies like Microsoft,
Facebook, Slack, and Docker.

Electron能够让你更容易开发桌面应用程序。它最初由 GitHub 为其代码编辑器 Atom 构建，现在已被许多公司如微软、Facebook、Slack 以及 Docker 采用。

关键词：
Web TechUse
Open Source
Cross Platform

Use HTML, CSS, and JavaScript with Chromium and Node.js to build your
app.

Web 技术：使用 HTML、CSS 和 JavaScript，基于 Chromium 和 Node.js 技术架构。

Electron is open source; maintained by GitHub and an active community.

开源：Electron 为开源编程框架，由 Github 和 开源社区提供支持和维护。

Electron apps build and run on Mac, Windows, and Linux.

跨平台：使用 Electron 构建的桌面应用程序可以同时运行在 Mac, Windows, 和 Linux 操作系统上。

它的宣传语：Developers bring ideas to life

Interesting open source apps are built on Electron.

以下是基于Electron构建的，很有趣的，开源的App

Friends — Peer to peer chat

Hearthdash — Hearthstone tracker

Kart — Frontend for RetroArch

Mancy — REPL app

Monu — Process monitoring app

Mojibar — Emoji searcher

Light Table — Customizable IDE

Playback — Experimental video player

ScreenCat — WebRTC screensharing

Geojsonapp — Preview geojson files

Menubar — Create menubar apps

Yeoman App — Scaffold projects

Electron其实做了这样的一件事就是The hard parts made easy

Quick Start

Electron enables you to create desktop applications with pure
JavaScript by providing a runtime with rich native (operating system)
APIs. You could see it as a variant of the Node.js runtime that is
focused on desktop applications instead of web servers.

Electron为纯JavaScript创建桌面应用程序提供一个运行时丰富的原生API。（就像我们使用C++编写windows程序程序时，直接调用的windowsAPI）你可以把它看做Node.js运行时的变种，专注于桌面应用程序而不是Web服务器。

This doesn’t mean Electron is a JavaScript binding to graphical user
interface (GUI) libraries. Instead, Electron uses web pages as its
GUI, so you could also see it as a minimal Chromium browser,
controlled by JavaScript.

Electron不是一个JavaScript绑定的GUI库，Electron使用网页作为GUI，所以你可以把它看做使用JavaScript迷你型的Chromium浏览器

Main Process

In Electron, the process that runs package.json’s main script is
called the main process. The script that runs in the main process can
display a GUI by creating web pages.

主进程
运行 package.json 里 main script的进程被称为主进程
运行在主进程中这个script创建一个网页作为GUI显示

Renderer Process

Since Electron uses Chromium for displaying web pages, Chromium’s
multi-process architecture is also used. Each web page in Electron
runs in its own process, which is called the renderer process.

渲染进程
因为Electron 使用 Chromium 来显示网页，所以 Chromium 的多进程架构也被使用。每个网页都在运行着自己的进程，这种进程称为渲染进程。

In normal browsers, web pages usually run in a sandboxed environment
and are not allowed access to native resources. Electron users,
however, have the power to use Node.js APIs in web pages allowing
lower level operating system interactions.

在一般浏览器中，网页通常运行在沙盒环境下，并且不允许访问原生资源。然而，Electron让用户拥有在网页中调用Node.js API与底层操作系统直接交互的能力。

Differences Between Main Process and Renderer Process

主进程与渲染进程的区别

The main process creates web pages by creating BrowserWindow
instances. Each BrowserWindow instance runs the web page in its own
renderer process. When a BrowserWindow instance is destroyed, the
corresponding renderer process is also terminated.

主进程通过创建 BrowserWindow 实例而创建网页。每个 BrowserWindow 实例运行的网页都在自己的渲染进程里。当一个 BrowserWindow 实例被销毁后，相应的渲染进程也会被终止。

The main process manages all web pages and their corresponding
renderer processes. Each renderer process is isolated and only cares
about the web page running in it.

主进程管理所有网页和相应的渲染进程。每个渲染进程都是相互独立的，并且只关心他们自己的网页。

In web pages, calling native GUI related APIs is not allowed because
managing native GUI resources in web pages is very dangerous and it is
easy to leak resources. If you want to perform GUI operations in a web
page, the renderer process of the web page must communicate with the
main process to request that the main process perform those
operations.

在网页面调用 GUI 相关的 API 是不被允许的， 因为在网页中管理原生 GUI 资源是非常危险而且容易造成资源泄露。如果你想在网页里执行 GUI 操作，其对应的渲染进程必须请求与主进程进行通讯，主进程再执行那些 GUI 操作。

In Electron, we have provided the ipc module for communication between
the main process and renderer process. There is also a remote module
for RPC style communication.

在Electron中，我们为主进程与渲染进程之间的通讯提供了IPC模块。也有一个RPC风格通讯的remote模块 。