Electron性能优化

正文

谨慎加载模块

在向你的应用程序添加一个 Node.js 模块之前,请检查这个模块。 这个模块包含了多少依赖? 简单的一个 require()声明中包含了什么种类的资源? 你可能发现NPM包注册的最多的或者Github上Star最多的模块实际上并不是最简单或者最小可用的模块。

在项目的根目录中运行

1
node --cpu-prof --heap-prof -e "require('is-online')"

根目录下生成了以下两个文件

  • CPU.20210813.174540.13156.0.001.cpuprofile
  • Heap.20210813.174540.13156.0.002.heapprofile

这两个文件都可以使用 Chrome 开发者工具进行分析,分别使用 PerformanceMemory 标签 进行分析。

浏览器F12打开开发者工具

  • 性能(Performance)标签可以加载.cpuprofile文件
  • 内存(Memory)标签可以加载.heapprofile

CPU情况

image-20210813182959034

内存情况

image-20210813183100816

不要阻塞主进程

Electron的主要进程(有时称为“浏览器进程”) 非常特殊:它是与你应用的所有其他进程的父进程,也是和操作系统交互的关键进程。

在任何情况下你都不应阻塞此进程或者运行时间长的用户界面线程。 阻塞UI线程意味着您的整个应用程序将冻结直到主进程准备好继续处理。

如果您的窗口呈现黄色平滑动画, 它需要和 GPU 进程进行通信——再次穿越主进程。

Electron 和 Chromium 谨慎地将大型的磁盘I/O 和 CPU绑定的操作放入新线程,以避免阻塞UI 线程。

优化方式

  1. 对于需要长期占用CPU繁重任务,使用 worker threads, 考虑将它们移动到 BrowserWindow, 或 (作为最后手段) 生成一个专用进程。

  2. 尽可能避免使用同步IPC 和 remote 模块。 虽然有合法的使用案例,但使用remote模块的时候非常容易不知情地阻塞 UI线程。

  3. Avoid using blocking I/O operations in the main process. 简而言之,每当Node.js的核心模块 (如fschild_process) 提供一个同步版本或 异步版本,你更应该使用异步和非阻塞式的变量。