整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
信不只是我，用過（或看過）macOS 和 Windows 兩個版本 Notion 客戶端的同學(xué)，應(yīng)該都會覺得 Windows 上的 Notion 用戶「處于水深火熱」之中。
Notion 的桌面客戶端是「網(wǎng)頁套殼」的成果，受限于 Windows 上的 Electron API，Notion 官方的 Windows 客戶端擁有 Windows 桌面應(yīng)用的一切特征：
不過 Notion 客戶端是用 Electron 封裝的，其樣式、布局等和網(wǎng)頁的定義方法一致。因此我們可以通過一些手段對 Notion 的 Windows 客戶端進(jìn)行定制，使之更符合我們的審美與使用習(xí)慣。比如下面這樣：
魔改之后的 Notion Windows 客戶端
這里用到的是來自烏克蘭的開發(fā)者 @Uzver 的 Notion Enhancer，借助這款工具，我們可以對 Notion 的 Windows 桌面客戶端進(jìn)行一系列魔改和美化。
在開始美化 Notion 客戶端之前我們需要安裝一些工具，為接下來的魔改進(jìn)行準(zhǔn)備工作。下面的步驟在 Windows 10 Pro 19041.25 版本下進(jìn)行，使用 Windows 上的軟件包管理工具 Scoop 進(jìn)行安裝。
關(guān)聯(lián)閱讀：「一行代碼」搞定軟件安裝卸載，用 Scoop 管理你的 Windows 軟件
首先，Notion Enhancer 本身是一個 Python 腳本，我們需要安裝 Python 環(huán)境。打開 PowerShell，在其中輸入：
scoop install python
等待安裝完成即可。
接下來，由于 Notion 的桌面客戶端是 Electron 套殼應(yīng)用，用 Node.js 作為其運(yùn)行環(huán)境，因此我們需要安裝 Node.js 與 npm 包管理工具。在 PowerShell 中繼續(xù)輸入：
scoop install nodejs
等待安裝完成即可。
最后，我們需要使用 npm 包管理工具安裝 asar 工具，用來解密 Electron 應(yīng)用包，從而改造 Electron 應(yīng)用（也就是 Notion 客戶端）的內(nèi)部代碼。在 PowerShell 中繼續(xù)輸入：
npm install -g asar
在 PowerShell 中輸入 asar，如果出現(xiàn)如下的結(jié)果，那么我們的 asar 工具就安裝成功了。
驗(yàn)證 asar 工具安裝成功
至此，準(zhǔn)備工作就基本完成了。
接下來，我們下載「美化」套裝：Notion Scripts V4。解壓之后我們會得到這樣的幾個文件：
Notion Enhancer 下載得到的文件
我們將 NotionScriptsV4 文件夾放置妥當(dāng)（可以放在云存儲同步文件夾中，方便后續(xù)保管），在 PowerShell 中定位至這一文件夾，進(jìn)行接下來的「安裝」操作。
關(guān)掉所有 Notion 客戶端，在 PowerShell 中輸入下面的命令，執(zhí)行 Python 腳本：
python 'Customization Patcher.py'
執(zhí)行 Customization Patcher 腳本
在這一步驟中，Customization Patcher.py 實(shí)際上為我們做了以下的事情：
隨后重啟 Notion 客戶端就可以看到樣式已經(jīng)生效，客戶端被我們成功魔改。
另外，如果后續(xù)希望將 Notion 客戶端恢復(fù)原樣，我們同樣直接運(yùn)行移除樣式腳本 Customization Remover.py 即可：
python 'Customization Remover.py'將 Notion 客戶端恢復(fù)原樣
事實(shí)上，Notion Enhancer 為我們添加、修改并自定義了很多 Notion 客戶端的功能與樣式。
首先 Notion Enhancer 最大、最值得使用的功能特性就是將 Notion 原有的 Windows 菜單欄、工具欄與滾動條全部去掉，修改成了更符合 Notion 整體風(fēng)格的樣式。下面是一個對比：
Notion Enhancer 修改效果
可以看到，Notion Enhancer 將 Windows 原生的與 Notion 界面風(fēng)格不匹配的控件全部隱藏了起來，并重繪了右上角的「最小化」、「最大化」和「關(guān)閉窗口」的控件，并將「滾動條」也重新繪制，使之與無論在深色主題還是淺色主題下都能完美契合。
另外，Notion Enhancer 還在右上角添加了一個實(shí)用的新控件 ↑，用于置頂 Notion 窗口。
Notion Enhancer 將 Notion 表格、看板視圖左右兩側(cè)的「空白區(qū)域」去掉，從而讓二者能顯示更多的橫向內(nèi)容。
去掉表格視圖兩側(cè)的空白部分
這部分樣式在文件 custom_style.css 的 87 行往下開始定義的，如果不希望開啟這一功能，我們直接刪掉或注釋掉 87 行至 97 行與 103 行至 107 行的代碼內(nèi)容（即下圖中藍(lán)色框中代碼內(nèi)容）即可。另外也可以在 Notion 客戶端里面用快捷鍵 Ctrl + R 重新加載樣式。
表格與看板視圖的 CSS 樣式定義
Notion Enhancer 將帶有頭圖的頁面也進(jìn)行了相應(yīng)的調(diào)整。為了使縱向空間充分利用，Notion Enhancer 將圖標(biāo)向上移動至頭圖中央，并調(diào)整了頭圖的顯示區(qū)域。
調(diào)整圖標(biāo)與頭圖的位置
需要注意這部分樣式定義是作者針對 15.6 寸與 24 寸顯示器進(jìn)行的參數(shù)調(diào)整，如果發(fā)現(xiàn)自己的 Notion 客戶端顯示出現(xiàn)了問題，那么我們需要手動調(diào)整這部分參數(shù)，也就是 custom_style.css 的第 109 行下面的部分。
這里我們需要調(diào)整兩個 height 參數(shù)，其中 12vh、20vh 分別代表 Notion 頁面內(nèi)容距離頂端的高度與頭圖的顯示高度，我們適當(dāng)進(jìn)行調(diào)整，使得圖標(biāo)在頭圖里面垂直居中即可。
修改頭圖與圖標(biāo)垂直高度
在上面的兩個例子中可以看到，無論是桌面客戶端的 Notion 還是網(wǎng)頁版本的 Notion，其樣式實(shí)際上是完全可以很大程度上進(jìn)行自定義的。我們直接在 custom_style.css 里面添加或修改相應(yīng)的 CSS 樣式定義內(nèi)容即可讓 Notion 界面按照我們希望的樣子顯示。
添加自定義 Notion 樣式
Notion Enhancer 還為我們添加了隱藏/顯示 Notion 窗口的快捷鍵定義。
默認(rèn)的隱藏 / 顯示 Notion 快捷鍵是 Ctrl + Shift + A，不過我們也可以自定義這一功能。在 Customization Patcher.py 中，第 34 行定義了快捷鍵 windowToggleHotkey 的變量，這里我們就可以將默認(rèn)定義的：
windowToggleHotkey="'ctrl+shift+a'"
修改為我們自己的快捷鍵，比如 Win + Shift + N：
windowToggleHotkey="'super+shift+n'"
這里的修改需要重新運(yùn)行 Customization Patcher.py，再次給 Notion 客戶端打補(bǔ)丁，才能讓快捷鍵生效。
最后，為了方便設(shè)置 Notion 開機(jī)自啟以及啟動的窗口樣式，Notion Enhancer 還添加了一個任務(wù)欄設(shè)置區(qū)域，方便我們設(shè)置 Notion 開啟啟動、自動隱藏窗口、自動最大化窗口與最小化到托盤等選項(xiàng)。
添加 Notion 任務(wù)欄設(shè)置圖標(biāo)
為了拯救 Notion 的 Windows 用戶于水深火熱之中，Notion Enhancer 的作者也是煞費(fèi)苦心，為我們修改了 Notion 的界面并提供了諸多增強(qiáng)功能，包括能夠任意自定義 Notion 頁面樣式的入口：custom_style.css。
Notion Enhancer 目前已經(jīng)更新至第四個版本，作者將在 Notion Enhancer - Notion 這一頁面持續(xù)更新工具及其相應(yīng)的功能和配置方法，感興趣的同學(xué)可以持續(xù)關(guān)注。本文的介紹就到這里，感謝閱讀。
文由vivo技術(shù)團(tuán)隊(duì)Yang Kun分享，原題“electron 應(yīng)用開發(fā)優(yōu)秀實(shí)踐”，本文有修訂。
在上篇《Electron初體驗(yàn)(快速開始、跨進(jìn)程通信、打包、踩坑等)》的分享中，我們已經(jīng)對Electron跨端框架的開發(fā)有了大概的了解。
本篇將基于vivo技術(shù)團(tuán)隊(duì)的技術(shù)實(shí)踐，詳細(xì)闡述了vivo在使用Electron進(jìn)行跨端桌面開發(fā)時的技術(shù)棧選型考量，同時分享了在打包構(gòu)建、版本更新、性能優(yōu)化、質(zhì)量保障、安全性等方面的實(shí)踐方案和踩坑總結(jié)。
本文是系列文章中的第3篇，本系列總目錄如下：
因業(yè)務(wù)發(fā)展，我們需要用到桌面端技術(shù)，技術(shù)特性涉及離線可用、調(diào)用桌面系統(tǒng)能力等要求。
那么什么是桌面端開發(fā)？一句話概括就是：以 Windows 、MacOS 和 Linux 為操作系統(tǒng)的桌面軟件開發(fā)。
對此我們做了詳細(xì)的技術(shù)調(diào)研：桌面端的開發(fā)方式主要有 Native 、 QT 、 Flutter 、 NW 、 Electron 、 Tarui 。
這些技術(shù)各自優(yōu)劣勢如下表格所示：
我們最終的桌面端技術(shù)選型是 Electron，Electron 是一個可以使用 Web 技術(shù)來開發(fā)跨平臺桌面應(yīng)用的開發(fā)框架。
其技術(shù)組成如下：
Electron=Chromium + Node.js + Native API
各技術(shù)能力如下圖所示：
整體架構(gòu)如下圖所示：
Electron 是多進(jìn)程架構(gòu)，架構(gòu)具有以下特點(diǎn)：
這里回顧一下 Electron 進(jìn)程間通信技術(shù)原理。
electron 使用 IPC （interprocess communication） 在進(jìn)程之間進(jìn)行通信。
如下圖所示：
其提供了 IPC 通信模塊，主進(jìn)程的 ipcMain 和渲染進(jìn)程的 ipcRenderer。
從 electron 源碼中可以看出， ipcMain 和 ipcRenderer 都是 EventEmitter 對象。
源碼如下圖所示：
看到源碼實(shí)現(xiàn)，是不是覺得 IPC 不難理解了。知其本質(zhì)，方可游刃有余。
限于篇幅，這里對Electron的基礎(chǔ)知識就不再展開，有興趣的讀者可回顧一下本系列的前兩篇《快速了解新一代跨平臺桌面技術(shù)——Electron》、《Electron初體驗(yàn)(快速開始、跨進(jìn)程通信、打包、踩坑等)》（這篇中的“5、進(jìn)程詳解”特別介紹了Electron進(jìn)程間的關(guān)系以及通信原理）。
我們最終選擇的是Typescript，理由如下。
針對開發(fā)者：
針對工具：
社區(qū)支持：大量的社區(qū)的類型定義文件 提升開發(fā)效率。
我們選擇的是 Electron-Forge。
理由很充分：Electron-Forge簡單而又強(qiáng)大，目前 electron 應(yīng)用最好的構(gòu)建工具之一。
這里提一下 electron-builder 其和 electron-forge 的介紹和區(qū)別。
看下圖所示：
兩者最大的區(qū)別在于自由度，兩者在能力上基本沒什么差異了，從官方組織中的排序看，有意優(yōu)先推薦 electron-forge 。
我們采用的是 Vue3 ，同時使用 Vite 作為構(gòu)建工具，具體優(yōu)點(diǎn)，大家可以查看官網(wǎng)介紹，這套組合是目前主流的 Web 開發(fā)方案。
目前的 monorepo 生態(tài)百花齊放，正確的實(shí)踐方法應(yīng)該是集大成法，也就是取各家之長，目前的趨勢也是如此，各開源 monorepo 工具達(dá)成默契，專注自己擅長的能力。
如 pnpm 擅長依賴管理， turbo 擅長構(gòu)建任務(wù)編排。遂在 monorepo 技術(shù)選型上，我選擇了 pnpm 和 turbo 。
以下是pnpm的官網(wǎng)：
pnpm 理由如下：
相比于 vue 官網(wǎng)，在使用 pnpm 上，我加了 workspace 。
turbo 理由如下：
Electron 應(yīng)用數(shù)據(jù)庫有非常多的選擇如 lowdb 、 sqlite3 、 electron-store 、 pouchdb 、 dedb 、 rxdb 、 dexie 、 ImmortalDB 等。
這些數(shù)據(jù)庫都有一個特性，那就是無服務(wù)器。
Electron本地數(shù)據(jù)庫技術(shù)選型考慮因素主要有：
我們通過以下渠道進(jìn)行了相關(guān)調(diào)研：
給出四個最優(yōu)選擇，分別是 lowdb 、 sqlite3 、 nedb 、 electron-store 。
我們的理由如下：
我們使用的數(shù)據(jù)庫最終選型是 lowdb 方案。
PS：提一下 pouchdb ，如果需要將本地數(shù)據(jù)同步到遠(yuǎn)端數(shù)據(jù)庫，可以使用 pouchdb ，其和 couchdb 可以輕松完成同步。
軟件開發(fā)過程中，將一些流程和操作通過腳本來完成，可以有效地提高開發(fā)效率和幸福度。
依賴 node runtime 的優(yōu)秀選擇就兩個：shelljs 和 zx 。
選擇 zx 的理由如下：
至此，技術(shù)選型就介紹完了。
不同尺寸圖標(biāo)的生成有以下方法。
Windows：
MacOS：
本章節(jié)內(nèi)容是基于 electron-forge 闡述的，不過原理是一樣的。
在開發(fā)桌面端應(yīng)用時，會有場景要用到第三方的二進(jìn)制程序，比如 ffmpeg 這種。
在構(gòu)建二進(jìn)制程序時，要關(guān)注以下兩個注意項(xiàng)。
1）二進(jìn)制程序不能打包進(jìn) asar 中 可以在構(gòu)建配置文件（forge.config.js）進(jìn)行如下設(shè)置：
const os=require('os')
const platform=os.platform()
const config={
packagerConfig: {
// 可以將 ffmpeg 目錄打包到 asar 目錄外面
extraResource: [`./src/main/ffmpeg/`]
}
}
2）開發(fā)和生產(chǎn)環(huán)境，獲取二進(jìn)制程序路徑方法是不一樣的 可以采用如下代碼進(jìn)行動態(tài)獲取：
import { app } from 'electron'
import os from 'os'
import path from 'path'
const platform=os.platform()
const dir=app.getAppPath()
let basePath=''
if(app.isPackaged) basePath=path.join(process.resourcesPath)
elsebasePath=path.join(dir, 'ffmpeg')
const isWin=platform==='win32'
// ffmpeg 二進(jìn)制程序路徑
const ffmpegPath=path.join(basePath, `${platform}`, `ffmpeg${isWin ? '.exe':
如何對跨平臺二進(jìn)制文件進(jìn)行按需構(gòu)建呢？
比如桌面應(yīng)用中用到了 ffmpeg ， 它需要有 windows 、 mac 和 linux 的下載二進(jìn)制。
在打包的時候，如果不做按需構(gòu)建，則會將 3 個二進(jìn)制文件全部打到構(gòu)建中，這樣會讓應(yīng)用體積增加很多。
可以在 forge.config.js 配置文件中進(jìn)行如下配置，即可完成按需構(gòu)建。
代碼如下：
const platform=os.platform()
const config={
packagerConfig: {
extraResource: [`./src/main/ffmpeg/${platform}`]
},
}
通過 platform 變量來把對應(yīng)系統(tǒng)的二進(jìn)制打到構(gòu)建中，即可完成對二進(jìn)制文件的按需構(gòu)建。
主要是構(gòu)建速度和構(gòu)建體積優(yōu)化，構(gòu)建速度這塊不好優(yōu)化。這里重點(diǎn)說下構(gòu)建體積優(yōu)化，拿 mac 系統(tǒng)舉例說明， 在 electron 應(yīng)用打包后，查看應(yīng)用包內(nèi)容。
如下圖所示：
可以看到有一個 app.asar 文件。
這個文件用 asar 解壓后可以看到有以下內(nèi)容：
可以看出 asar 中的文件，就是我們構(gòu)建后的項(xiàng)目代碼，從圖中可以看到有 node_modules 目錄， 這是因?yàn)樵?electron 構(gòu)建機(jī)制中，會自動把 dependencies 的依賴全部打到 asar 中。
結(jié)合上述分析，我們的優(yōu)化措施有以下4點(diǎn)：
這里提下第 4） 點(diǎn)，如何對 node_modules 進(jìn)行清理精簡呢？
如果是 yarn 安裝的依賴：我們可以在根目錄使用下面命令進(jìn)行精簡：
yarn autoclean -I
yarn autoclean -F
如果是 pnpm 安裝的依賴：第 4）點(diǎn)應(yīng)該不起作用了。我在項(xiàng)目中使用 yarn 安裝依賴，然后執(zhí)行上述命令后，發(fā)現(xiàn)打包體積減少了 6M ， 雖然不多，但也還可以。
全量更新就是通過下載最新的包或者 zip 文件，進(jìn)行軟件更新，需要替換所有的文件。
整體設(shè)計流程圖如下：
按照流程圖去實(shí)現(xiàn)，我們需要做以下事情：
增量更新是通過拉取最新的渲染層打包文件，覆蓋之前的渲染層代碼，完成軟件更新，此方案只需替換渲染層代碼，無需替換所有文件。
按照流程圖去實(shí)現(xiàn)，我們需要做以下事情：
打包構(gòu)建優(yōu)化在上節(jié)內(nèi)容中已經(jīng)詳細(xì)介紹過了，這里不再介紹，下面將介紹我們對“啟動時優(yōu)化”和“運(yùn)行時優(yōu)化”的實(shí)踐。
主要從以下幾個方面著手：
使用 V8 緩存數(shù)據(jù)，為什么要這么做呢？
因?yàn)?electorn 使用 V8 引擎運(yùn)行 js ， V8 運(yùn)行 js 時，需要先進(jìn)行解析和編譯，再執(zhí)行代碼。其中，解析和編譯過程消耗時間多，經(jīng)常導(dǎo)致性能瓶頸。而 V8 緩存功能，可以將編譯后的字節(jié)碼緩存起來，省去下一次解析、編譯的時間。
主要使用 v8-compile-cache 來緩存編譯的代碼，做法很簡單：在需要緩存的地方加一行。
1require('v8-compile-cache')
其他使用方法請查看此鏈接文檔 ：https://www.npmjs.com/package/v8-compile-cache
偽代碼如下：
export functionshare() {
const kun=require('kun')
kun()
}
主要從以下幾個方面著手：
用一個思維導(dǎo)圖來完整闡述如何進(jìn)行 Web 性能優(yōu)化，如下圖所示：
上圖基本包含了性能優(yōu)化的核心關(guān)鍵點(diǎn)和內(nèi)容，大家可以以此作為參考，去做性能優(yōu)化。
核心方案就是將運(yùn)行時耗時、計算量大的功能交給新開的 node 進(jìn)程去執(zhí)行處理。
偽代碼如下：
const { fork }=require('child_process')
let { app }=require('electron')
functioncreateProcess(socketName) {
process=fork(`xxxx/server.js`, [
'--subprocess',
app.getVersion(),
socketName
])
}
const initApp=async ()=> {
// 其他初始化代碼...
let socket=await findSocket()
createProcess(socket)
}
app.on('ready', initApp)
通過以上代碼，將耗時、計算量大的功能，放在 server.js ，然后再 fork 到新開 node 進(jìn)程中進(jìn)行處理。
至此，性能優(yōu)化實(shí)踐就介紹完了。
質(zhì)量保障的全流程措施如下圖所示：
本節(jié)主要從以下3個方面分享：
下面將會依次介紹上述內(nèi)容。
自動化測試是什么？
上圖是做自動化測試一個完整步驟，大家可以看圖領(lǐng)會。
自動化測試主要分為 單元測試、集成測試、端到端測試。
三者關(guān)系如下圖所示：
一般情況下：作為軟件工程師，我們做到一定的單元測試就可以了。而且從我目前經(jīng)驗(yàn)來說，如果是寫業(yè)務(wù)性質(zhì)的項(xiàng)目，基本上不會編寫測試相關(guān)的代碼。
自動化測試主要是用來編寫庫、框架、組件等需要作為單獨(dú)個體提供給他人使用的。
electron 的測試工具推薦 vitest 、 spectron 。具體用法參考官網(wǎng)文檔即可，沒什么特別的技巧。
對于 GUI 軟件，尤其桌面端軟件來說，崩潰率非常重要，因此需要對崩潰進(jìn)行監(jiān)控。
崩潰監(jiān)控原理如下圖所示：
崩潰監(jiān)控技巧：
崩潰監(jiān)控做好后，如果發(fā)生崩潰，該如何治理崩潰呢？
崩潰治理難點(diǎn)：
崩潰治理技巧：
俗話說的好，安全大于天，保證 electron 應(yīng)用的安全也是一項(xiàng)重要的事情。
本章節(jié)將安全分為以下 5 個方面：
下面將會依次介紹上述內(nèi)容。
目前 electron 在源碼安全做的不好，官方只用 asar 做了一下很沒用的源碼保護(hù)，到底有多沒用呢？
你只需要下載 asar 工具，然后對 asar 文件進(jìn)行解壓就可以得到里面的源碼了。
如下圖所示：
通過圖中操作即可看到語雀應(yīng)用的源碼。上面提到的 asar 是什么呢？
asar 是一種將多個文件合并成一個文件的類 tar 風(fēng)格的歸檔格式。Electron 可以無需解壓整個文件，即可從其中讀取任意文件內(nèi)容。
可以直接看 electron 源碼，都是 ts 代碼，容易閱讀，源碼如下圖所示：
避免源碼泄漏，按照從低到高的源碼安全，可以分為幾個程度。
具體如下：
其中：Language bindings 是最高的源碼安全措施，其實(shí)使用 C++ 或 Rust 代碼來編寫 electron 應(yīng)用代碼，通過將 C++ 或 Rust 代碼編譯成二進(jìn)制代碼后，破譯的難度會變高。
這里我說下如何使用 Rust 去編寫 electron 應(yīng)用代碼。
方案是：使用 napi-rs 作為工具去編寫，如下圖所示：
我們采用 pnpm-workspace 去管理 Rust 代碼，使用 napi-rs 。
比如我們寫一個 sum 函數(shù)，rs代碼如下：
fn sum(a: f64, b: f64) -> f64 {
a + b
}
此時我們加上 napi 裝飾代碼，如下所示：
use napi_derive::napi;
#[napi]
fn sum(a: f64, b: f64) -> f64 {
a + b
}
在通過 napi-cli 將上述代碼編譯成 node 可以調(diào)用的二進(jìn)制代碼。
編譯后，在electron使用上述代碼，如下所示：
import { sum as rsSum } from '@rebebuca/native'
// 輸出 7
console.log(rsSum(2, 5))
napi-rs 的使用請閱讀官方文檔，地址是：https://napi.rs/
至此，language bindings 的闡述就完成了。我們通過這種方式，可以完成對重要功能的源碼保護(hù)。
目前熟知的一個安全問題是克隆攻擊，此問題的主流解決方案是將用戶認(rèn)證信息和應(yīng)用設(shè)備指紋進(jìn)行綁定。
整體流程如如下圖所示：
如上圖所示：
主要有以下措施：
以上具體細(xì)節(jié)不再介紹，自行搜索上述方案。
除此之外，還有個官方推薦的最佳安全實(shí)踐，有空可以看看，地址如下：https://www.electronjs.org/docs/latest/tutorial/security。
至此，安全性這塊實(shí)踐就介紹完了。
本文介紹了我們對跨系統(tǒng)桌面端技術(shù)的調(diào)研、確定技術(shù)選型，以及用 electron 開發(fā)過程中，總結(jié)的實(shí)踐經(jīng)驗(yàn)及踩坑填坑過程，如構(gòu)建、性能優(yōu)化、質(zhì)量保障、安全等。
希望對讀者在開發(fā)跨端桌面應(yīng)用過程中有所幫助，文章難免有不足和錯誤的地方，歡迎讀者評論。
[1] Electron官方開發(fā)者手冊
[2] 快速了解新一代跨平臺桌面技術(shù)——Electron》
[3] Electron初體驗(yàn)(快速開始、跨進(jìn)程通信、打包、踩坑等)
[4] Electron 基礎(chǔ)入門 簡單明了，看完啥都懂了
[5] 網(wǎng)易云信Web端IM的聊天消息全文檢索技術(shù)實(shí)踐
學(xué)習(xí)交流：
- 移動端IM開發(fā)入門文章：《新手入門一篇就夠：從零開發(fā)移動端IM》
- 開源IM框架源碼：https://github.com/JackJiang2011/MobileIMSDK（備用地址點(diǎn)此）
（本文已同步發(fā)布于：http://www.52im.net/thread-4044-1-1.html）
本系列文章的前面幾篇主要是從Electron技術(shù)本身進(jìn)行了討論（包括：第1篇初步了解Electron、第2篇進(jìn)行了快速開始和技術(shù)體驗(yàn)、第3篇基于實(shí)際開發(fā)考慮的技術(shù)棧選型等），各位讀者也應(yīng)該對Electron的開發(fā)有了較為深入的了解。
本篇將回到IM即時通訊技術(shù)本身，根據(jù)蘑菇街的實(shí)際技術(shù)實(shí)踐，總結(jié)和分享基于Electron開發(fā)跨平臺IM客戶端的過程中，需要考慮的典型技術(shù)問題以及我們的解決方案。希望能給你帶來幫助。
學(xué)習(xí)交流：
- 移動端IM開發(fā)入門文章：《新手入門一篇就夠：從零開發(fā)移動端IM》
- 開源IM框架源碼：https://github.com/JackJiang2011/MobileIMSDK（備用地址點(diǎn)此）
（本文已同步發(fā)布于：http://www.52im.net/thread-4051-1-1.html
*請認(rèn)真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
