Electron 应用开发实践指南

weixin_47081981

于 2024-08-19 17:28:03 发布

阅读量163

点赞数 6

文章标签： electron javascript 前端

本文链接：https://blog.csdn.net/weixin_47081981/article/details/141330748

版权

EIectron是一个可以让前端开发者快速构建跨平台桌面端应用的框架。但是对于初学者而言，可能会碰到内存或包体积过大、跨平台兼容性处理、原生API不够用、打包、更新、性能优化等各式各样的问题。而本课程就是从实际应用角度出发，给你提供相关“应对之道”。

作为开发者，我们经常会和各种桌面端软件、开发工具打交道，比如图床、json 格式化、抓包代理&mock、二维码生成等工具。这些工具有的是一个个桌面端 APP，有的是一些 Web 网页，用起来操作链路比较长。也有的工具使用起来非常鸡肋，食之无味、弃之可惜。

基于以上痛点，如果你有“自己造轮子”的念头产生，但是又对桌面端应用开发一点也不了解，那么 Electron 将会是可以快速验证你的想法、快速上线发包的最佳选择。举个知乎上有趣的回答的例子：

Electron 作为一个强大的跨端的桌面端应用框架，受益于其基于 Chromium + Node.js 的实现，可以让前端开发者快速构建跨平台的桌面端应用。

但是如果你立刻被这些优势冲昏了头脑，马上上车体验 Electron 开发，那么你可能会碰到各种各样的问题：

首先，还是因为集成 Chromium + Node.js 运行时的原因，这会导致应用特别吃内存，如果在写代码的时候又不注意内存优化，会导致占用电脑的内存越来越大。
其次，虽然 Electron 号称跨平台，但大多是其基于 Chromium 的部分，其部分 Native APIs，还有一些操作系统层面的交互依然要十分注意跨平台的兼容性。
再者，Electron 虽然提供了大量和操作系统交互的原生 API，但是一旦我们遇到一些需要额外原生能力支持的时候，这些 Electron API 就显得不够用了，所以如何使用 C++、Rust 开发一些扩展 API 就显得特别重要。
最后，桌面端应用和传统 Web 开发还是存在着大量差异性，Web 打个包发到 CDN 上就可以通过 URL 访问、更新。但是桌面端应用有打包、更新、包体积、性能、内存占用等等各种问题需要处理。

所以，本课程内容设置逻辑如下：

首先试着从 Electron 基础篇讲清楚开发一个 Electron 桌面应用你需要具备的基础知识，带你快速建立起 Electron 知识树。
再以开源项目 Rubick 6.2k+ star 为原型、开发一款桌面端工具为实例，讲清楚 Electron 开发中碰到的各种兼容性、原生扩展、操作系统底层调用等各种问题。
最后再教会你打包、更新、自动化测试你的应用并不断分析优化 Electron 内存占用和性能。相对于其他 Electron 教程而言，我们的实战部分绝对不是开发一个玩具的 demo 项目然后草草收场，所有示例代码都在开源项目中应用，因此会有更强的带入感和业务应用性。

课程大纲如下：

本课程主要分成三大模块介绍 Electron 开发中需要学习、处理、解决的问题。

模块一：Electron 基础篇。以最通俗易通的方式介绍 Electron 的一些核心概念和 Electron 的原生能力。希望通过该模块的学习让你对 Electron 的整体骨架有一个清晰的认知，可以开始入坑 Electron。
模块二：Electron 实战篇。通过基础篇的学习后，相信你一定希望动手实操，本模块将会从零开始以 Rubick 为原型来揭秘桌面端工具开发的核心秘密。本模块所有源码都源自 Rubick，你可以边调试边看，进一步加强理解。
模块三：Electron 通用篇。本模块重点介绍开发 Electron 会遇到的一些通用问题，包括：应用的打包、更新、自动化测试、性能优化、内存优化等等，并给出一些常用的解决方案。

希望通过这三个模块的学习，你可以学到：

因为 Electron 是使用 JS、HTML、CSS 构建的跨平台的桌面端应用。所以本课程适合人群为：

关注