关于electron:Electron的用武之地

背景

前段时间，我司我有一批产品须要工厂 加工、测试、包装、发货，次要分为以下几个流程

1. 将组装成品，贴标 – 在对应的地位粘贴Logo 和二维码及阐明
2. 激活ICCID
3. 绑定 – 应用 码枪 将二维码、IMEI、批次、RFID 卡 等信息绑定
4. 测试
5. 装盒，发货

技术选型

APP & 小程序

• 绑定环节，须要用到 码枪，应用手机操作不不便
• 必要的时候，还须要连贯 串口线 排查问题

BO

• 我司的 BO 平台须要在 白名单 下操作，工厂应用咱们平台须要新增白名单
• 我司 不心愿对外颁布咱们的治理平台地址
• 该工厂和该行业的 多家公司处于单干关系 ，其中几家公司还是 竞争关系 ，基于此，咱们 不心愿咱们的 API 对外颁布

是时候展现一波 Electron 了

Electron

简介

总结起来，Chromium 负责页面 UI 渲染，Node.js 负责业务逻辑，Native API 则提供跨平台计划。

开发

基于 PanJiaChen/electron-vue-admin 做二次开发

技术选型
Vue + ElementUI + Axios + Vuex + Wepback

还是相熟的配方，相熟的滋味

创立并管制浏览器窗口

const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {preload: path.join(__dirname, 'preload.js'),
    },
})

mainWindow.loadURL("index.html");

过程间通信

在 Electron 中，过程应用 ipcMain 和 ipcRenderer 模块，通过开发人员定义的“通道”传递音讯来进行通信。

您能够应用 ipcRenderer.send API 发送音讯，而后应用 ipcMain.on API 接管。

ipcMain.on('set-title', (event, title) => {
    const webContents = event.sender
    const win = BrowserWindow.fromWebContents(webContents)
    win.setTitle(title)
})

简评

毛病

1. 陈词滥调的：体积大，性能差，冷启动慢

简略的几个单页面，就能打出 几十 M 的包，内存间接飙升到1G

2. 多端的兼容
   这一点是最烦的，你永远保障不了你的新性能都是 OK 的
3. 蹩脚的 API 和版本差别
   本地测试没有问题，打包运行各种问题，长时间的周而复始，间接给我整吐了～～

长处

1. 上手容易，简直 零难度
2. 随用随走，丰盛的Web 生态系统
3. 大厂背书，不必放心

微软最终放弃 Electron？

理论状况只是微软旗下的 Teams 产品打算把 Electron 框架换成 WebView2 而已。

第一：Electron 是 GitHub 的产品，GitHub 是微软的子公司，WebView2 是 Edge 团队的产品（是 Edge 的副产物），Edge 团队是微软直属的团队，所以事件就是：Teams 打算切换一下本人的底层框架，而且这两个框架都是本人公司的产品，并不是放弃本人公司的框架，用了其余公司的框架。

第二：微软外部有很多软件都是基于 Electron 开发的，比方 VSCode 和 GitHubDesktop，不仅仅是只有 Teams 这么一个产品在用它，非但微软外部，包含 Facebook、MongoDB、twitch、Slack、迅雷、字节跳动、阿里、拼多多、京东等大企业都在用这个框架，这么一个好货色，微软怎么会放弃它呢？

第三：Teams 之所以要把 Electron 换成 WebView2，并不是因为 Electron 不好，而是因为 Electron 不称手，就像一个木匠换个锤子敲钉子一样一般，对于那些 Electron 的从业者，或者想进入 Electron 这个畛域的开发者，没什么好放心的。

第四：Electron 更新版本分频繁，大厂保障，不须要放心提桶跑路

参考文献

微软要放弃 Electron 了