為何選擇 Electron
Electron 是一個框架,使開發人員能夠透過結合網頁技術 (HTML、JavaScript、CSS) 與 Node.js 和原生程式碼,為 macOS、Windows 和 Linux 構建跨平台桌面應用程式。它是開放原始碼、MIT 授權,且無論商業或個人用途皆可免費使用。在本文件中,我們將解釋公司和開發人員為何選擇 Electron。
我們可以將 Electron 的優點分為兩個問題:首先,您為何應該使用網頁技術來構建您的應用程式?其次,您為何應該選擇 Electron 作為執行此操作的框架?
如果您已為您的應用程式使用網頁技術,您可以直接跳到下方的「為何選擇 Electron?」章節。
為何選擇網頁技術
網頁技術包括 HTML、CSS、JavaScript 和 WebAssembly。它們是現代網際網路的店面。這些技術已成為構建使用者介面的最佳選擇 — 無論是消費者應用程式還是關鍵任務的商業應用程式皆是如此。對於需要在瀏覽器中執行的應用程式以及無法從瀏覽器存取的桌面應用程式而言,這都是事實。我們在此大膽聲稱,這不僅適用於需要在多個作業系統上運行的跨平台應用程式,而且總體而言也是如此。
舉例來說,NASA 實際的任務控制中心是使用網頁技術編寫的。彭博終端是每個金融機構都能找到的電腦系統,它也是使用網頁技術編寫並在 Chromium 內運行的。每個使用者每年的費用為 25,000 美元。麥當勞的點餐亭為全球最大的食品零售商提供動力,完全由 Chromium 構建。SpaceX 的龍飛船 2 號太空艙使用 Chromium 來顯示其介面。您應該明白重點:網頁技術是用於構建使用者介面的絕佳技術堆疊。
以下是我們 Electron 維護者押注於網頁的原因。
多功能性
現代版本的 HTML 和 CSS 使您的開發人員和設計師能夠充分表達自己。網頁的展示包括 Google 地球、Netflix、Spotify、Gmail、Facebook、Airbnb 或 GitHub。無論您的應用程式需要什麼樣的介面,您都將能夠使用 HTML、CSS 和 JavaScript 來表達它。
如果您想專注於構建出色的產品,而無需弄清楚如何在特定的 UI 框架中實現設計師的願景,那麼網頁是一個安全的選擇。
可靠性
網頁技術是地球上使用者介面最常用的基礎。它們也因此而得到強化。現代電腦從 CPU 到作業系統都經過最佳化,以擅長運行網頁技術。您使用者裝置的製造商 — 無論是 Android 手機還是最新的 MacBook — 都將確保他們可以瀏覽網站、在 YouTube 上播放影片或顯示電子郵件。反過來,即使您只有一個使用者,他們也會確保您的應用程式擁有穩定的基礎。
如果您想專注於構建出色的產品,而無需除錯以前從未有人發現過的奇怪缺陷,那麼網頁是一個安全的選擇。
互通性
無論您需要與哪個供應商或客戶資料互動,他們可能都已考慮到與網頁的整合路徑。根據您的技術選擇,嵌入 YouTube 影片可能需要 30 秒,或者可能需要您聘請一個專門負責串流和硬體加速影片解碼的團隊。就 YouTube 而言,使用提供的播放器以外的任何內容實際上都違反了他們的條款和條件,因此在您實作自己的影片串流解碼器之前,您可能會先嵌入一個瀏覽器框架。
如果使用網頁技術構建應用程式,幾乎沒有任何平台無法運行您的應用程式。幾乎所有帶有顯示器的裝置 — 無論是 ATM、汽車資訊娛樂系統、智慧型電視、冰箱還是 Nintendo Switch — 都配備了顯示網頁技術的方法。如果您想實現跨平台,那麼網頁是一個安全的選擇。
普及性
很容易找到具有網頁技術構建經驗的開發人員。如果您是開發人員,您將很容易在 Google、Stack Overflow、GitHub 或您選擇的程式碼 AI 上找到問題的答案。無論您需要解決什麼問題,很可能有人早已很好地解決了這個問題 — 而且您可以在網路上找到謎題的答案。
如果您想專注於構建出色的產品,並能充分利用資源和材料,那麼網頁是一個安全的選擇。
為何選擇 Electron
Electron 將 Chromium、Node.js 和編寫自訂原生程式碼的能力結合到一個框架中,用於構建強大的桌面應用程式。使用 Electron 主要有三個原因
企業級
Electron 可靠、安全、穩定且成熟。它是公司構建旗艦產品的首選。我們的首頁上列出了一些公司,但在聊天應用程式中,Slack、Discord 和 Skype 都是使用 Electron 構建的。在 AI 應用程式中,OpenAI 的 ChatGPT 和 Anthropic 的 Claude 都使用 Electron。Visual Studio Code、Loom、Canva、Notion、Docker 和無數其他領先的軟體開發商都押注於 Electron。
我們確實優先考慮讓 Electron 易於使用,並讓開發人員感到愉快。這很可能是 Electron 今天如此受歡迎的主要原因 — 但讓 Electron 保持活力和蓬勃發展的是維護者專注於使 Electron 盡可能穩定、安全、高效能,並能夠用於最終使用者的關鍵任務用例。我們正在構建一個 Electron,它已準備好在任何類型的無法修復的錯誤、未修補的安全漏洞和中斷都是最壞情況的場景中使用。
成熟
我們目前的估計是,地球上大多數桌上型電腦至少運行一個 Electron 應用程式。Electron 的成長歸功於優先考慮其維護團隊中的人才、在管理持續維護方面培養卓越且永續的工程實務,並主動邀請押注於 Electron 的公司直接為專案做出貢獻。我們是 OpenJS 基金會的影響力專案,而 OpenJS 基金會本身又是 Linux 基金會的一部分。我們與 Node.js、ESLint、Webpack 或 Linux Kernel 或 Kubernetes 等其他基金會專案共享資源和專業知識。
對於身為開發人員的您來說,這一切在實務上意味著什麼?
- 可靠的發布時程:Electron 將與每個第二個主要的 Chromium 發布版本同步發布一個新的主要版本,通常與 Chromium 在同一天發布。無論是在構建流程和工具方面,還是在每週投入的原始工時方面,都需要付出大量工作才能實現這一目標。
- 沒有獨裁者:有時,押注於一項技術也需要您押注於單個人或公司。反過來,這需要您相信該人或公司永遠不會崩潰、開始直接與您作對,或做出任何其他劇烈的事情,導致您重新思考整個技術堆疊。Electron 由多家不同的公司(Microsoft、Slack/Salesforce、Notion 等)維護,並將繼續歡迎更多有興趣確保他們在「決策桌上佔有一席之地」的公司。
穩定性、安全性、效能
Electron 透過將最新版本的 Chromium、V8 和 Node.js 直接與應用程式二進制檔案捆綁在一起,在所有目標平台(macOS、Windows、Linux)上提供最佳體驗。在以最高的穩定性、安全性和效能運行和渲染網頁內容方面,我們目前認為這個堆疊是「同類最佳」。
為何要捆綁任何東西
您可能想知道,當大多數現代作業系統已經隨附瀏覽器和某種形式的網頁檢視時,我們為何要將 Chromium 的網頁堆疊與我們的應用程式捆綁在一起。捆綁不僅大幅增加了 Electron 維護者的工作量,還增加了 Electron 應用程式的總磁碟大小(大多數應用程式都大於 100MB)。許多 Electron 維護者曾經開發過使用嵌入式網頁檢視的應用程式 — 並且從那時起就接受了增加的磁碟大小和維護者工作量作為值得的權衡。
當使用作業系統的內建網頁檢視時,您會受到您需要支援的最舊作業系統版本中包含的瀏覽器版本的限制。我們發現這種方法存在以下問題
- 穩定性:現代網頁技術堆疊非常複雜,因此,您遲早會遇到錯誤。如果您使用作業系統的網頁檢視,您唯一的補救方法是要求您的客戶升級他們的作業系統。如果該機器無法升級(因為無法升級到最新的 macOS 或 Windows 11),您將不得不要求他們購買新電腦。如果您運氣不好,您現在將失去一位主要客戶,因為他們不會僅僅因為一個團隊想要嘗試您的新創公司應用程式而升級他們整個數千台機器的機隊。在這種情況下,您別無選擇。即使發生這種情況的風險也是 Electron 維護者所屬公司無法接受的。
- 安全性: 與您可以透過發布應用程式更新來修復穩定性錯誤的方式類似,您也可以發布應用程式的安全修復程式,而無需要求您的客戶升級他們的作業系統。即使作業系統供應商優先更新其內建瀏覽器,我們也沒有看到他們以類似的緊迫性可靠地更新內建網頁檢視。捆綁網頁渲染器讓您(開發人員)掌握控制權。
- 效能: 對於簡單的 HTML 文件,內建網頁檢視有時會比捆綁框架的應用程式使用更少的資源。對於較大的應用程式,我們的經驗是,與內建網頁檢視相比,我們可以透過最新版本的 Chromium 提供更好的效能。您可能會認為內建檢視可以與其他應用程式和作業系統共享大量資源 — 但出於安全原因,應用程式必須在它們自己的沙箱中運行,彼此隔離。在那時,問題是作業系統的網頁檢視是否比 Chromium 更有效能。在許多應用程式中,我們的經驗是,捆綁 Chromium 和 Node.js 使我們能夠構建更好、效能更高的體驗。
為何捆綁 Chromium 和 Node.js
Electron 的目標是使其支援的應用程式能夠提供最佳的使用者體驗,其次是最佳的開發人員體驗。Chromium 目前是可用的最佳跨平台渲染堆疊。Node.js 使用 Chromium 的 JavaScript 引擎 V8,讓我們能夠結合兩者的優勢。
- 在您需要時使用原生程式碼:由於 Node.js 成熟的原生插件系統,您始終可以編寫原生程式碼。沒有任何系統 API 是您無法觸及的。無論您想要整合什麼 macOS、Windows 或 Linux 功能 — 只要您可以使用 C、C++、Objective-C、Rust 或其他原生語言來完成,您就可以在 Electron 中完成。同樣,這讓您(開發人員)擁有最大的控制權。使用 Electron,您可以使用網頁技術,而無需僅選擇網頁技術。
開發人員體驗
總而言之,我們的目標是構建一個成熟、企業級且適用於關鍵任務應用程式的 Electron。我們優先考慮可靠性、穩定性、安全性和效能。話雖如此,您也可以因為 Electron 的開發人員體驗而選擇它
- 強大的生態系統:您在 npm 上找到的任何內容都將在 Electron 內部運行。您可用的關於如何使用 Node.js 的任何資源也適用於 Electron。此外,Electron 本身也有一個蓬勃發展的生態系統 — 包括大量安裝程式、更新程式、更深入的作業系統整合等等的選擇。
- 大量的內建功能: 在過去十年中,Electron 的核心獲得了許多您可能需要用於構建應用程式的原生功能。Electron 使用 C++ 和 Objective-C 編寫,具有數十個易於使用的 API,用於更深入的作業系統整合 — 例如用於透明或異形小工具的高級視窗自訂、接收來自 Apple 推播通知網路的推播通知,或處理應用程式的自訂 URL 協定。
- 開放原始碼:整個堆疊都是開放原始碼,並開放供您檢查。這確保了您在未來新增任何功能或修復您可能遇到的任何錯誤的自由。
- 在您需要時使用原生程式碼: 值得重申的是,Electron 允許您混合和匹配網頁技術與 C++、C、Objective-C、Rust 和其他原生語言。無論是 SQLite、整個 LLM,還是僅僅是呼叫一個特定原生 API 的能力,Electron 都將使其變得容易。
為何選擇其他方案
如上所述,網頁是一個用於構建介面的絕佳平台。但這並不意味著我們(維護者)會使用 HTML 和 CSS 構建所有東西。以下是一些值得注意的例外情況
資源受限的環境和物聯網: 在記憶體或處理能力非常有限的情況下(例如,在低功耗 ARM Cortex-M 上,記憶體為 1MB,處理能力為 100MHz),您可能需要使用低階語言直接與顯示器對話,以輸出基本文字和圖像。即使在功率稍高的單晶片裝置上,您也可能需要考慮嵌入式 UI 框架。經典範例是智慧型手錶。
小磁碟佔用空間:壓縮後的 Electron 應用程式通常約為 80 到 100 MB。如果較小的磁碟佔用空間是硬性要求,您將必須使用其他方案。
作業系統 UI 框架和函式庫:透過允許您編寫原生程式碼,Electron 可以執行原生應用程式可以執行的任何操作,包括使用作業系統的 UI 組件,例如 WinUI、SwiftUI 或 AppKit。實際上,大多數 Electron 應用程式很少使用這種能力。如果您希望您的應用程式的大部分是使用作業系統提供的介面組件構建的,那麼您最好為您想要鎖定的每個作業系統構建完全原生的應用程式。並非不可能使用 Electron 做到這一點,只是整體而言,開發過程可能會更容易。
遊戲和即時圖形: 如果您正在構建需要複雜即時 3D 圖形的高效能遊戲或應用程式,那麼 Unity、Unreal Engine 或 DirectX/OpenGL 等原生框架將提供更好的效能和更直接地存取圖形硬體。網頁愛好者可能會指出一些注意事項,例如即使 Unreal Engine 也隨附 Chromium — 或者 WebGPU 和 WebGL 正在快速發展,並且許多遊戲引擎(包括此處列出的引擎)現在可以將其遊戲輸出為可以在瀏覽器中運行的格式。話雖如此,如果您要求我們構建下一個 AAA 遊戲,我們可能會使用網頁技術以外的其他方案。
嵌入輕量級網站:Electron 應用程式通常主要是網頁應用程式,並在有用的地方加入原生程式碼。處理繁重的 Electron 應用程式傾向於使用 HTML/CSS 編寫 UI,並使用 Rust、C++ 或其他原生語言構建後端。如果您計劃構建一個主要的原生應用程式,並且還想在特定檢視中顯示一個小型網站,那麼您最好使用作業系統提供的網頁檢視或類似 ultralight 的方案。