Slack最近在beta通道中提供了3.0版本，該版本包含大量的性能提升和漏洞修復。大多數主要變更都是圍繞從Electron組件WebView到BrowserView的遷移，BrowserView是一個更新且更穩定的替代選擇。Slack工程師Charlie Hess發表了一篇博客，概述了這次遷移過程。
Slack使用Electron開發，Electron是一種框架，它使用像NodeJS和Chromium這樣的網絡技術來開發桌面應用程序。雖然這種技術有助于Slack保持跨平臺性，但Slack并未像團隊所希望的那樣穩定。Hess解釋說，這主要是由于WebView，一個用于渲染網頁的Electron特性。
WebView的主要問題之一是組件本身直接在Chromium中實現。這意味著bug修復最終要由Chrome團隊完成，這會大大妨礙進度。為了解決這個問題，Electron團隊引入了BrowserView，它是一個更像Chrome選項卡的組件，并且是操作系統窗口層次結構的一部分。團隊正在遷移，這是Slack 3.0中的大部分工作：
我們的意思是，與WebView不同的是，你不能將BrowserView拖放到DOM中，并使用CSS操作它。與頂級窗口類似，這些視圖只能從后臺Node進程創建。因為我們的應用程序是作為一組React組件來編寫的，該組件包裝了WebView，這些組件位于DOM內，所以這看起來像一次完全重寫。
然而，Hess解釋說，通過做出良好的技術選擇和設計決策，重寫是極其輕松的，并且他估計，最終他們能夠保留超過70%的原始代碼。
該團隊決定引入使用了Redux的redux-electron。本質上，Slack由許多進程組成，每個進程都包含自己的Redux存儲。redux-electron使用Electrons IPC（進程間通信）來共享進程之間的動作，該進程使用主進程作為單一數據源(SSoT)，并將其它進程作為代理。
另一個選擇是TypeScript，Hess說它給這個項目帶來了很多好處。在重構過程中，類型檢查幫助我們避免了許多可能檢測不到的錯誤：
你永遠不用再考慮flatMap的輸出（比如獲得的是數組還是單個項）、reduce的參數順序、或一個看起來像throttle但以D(debounce)作為開頭的運算符名稱。在VS Code中使用自動補全功能時，編寫JavaScript感覺就像在編寫C#。
最后，Hess解釋說，Slack使用redux-observable和基于RxJS 5的中間件。Slack本質上通過一個原語（一個接收和生成動作流的函數）將反應式編程引入Redux。
在線閱讀完整的博客，其中用代碼示例做了更詳細的介紹。此外，最新版本的Slack可以在beta通道下載。
查看英文原文：Slack Desktop Migrated to BrowserView for 3.0
京公網安備 11010502049343號