資訊專欄INFORMATION COLUMN
摘要：最初，也在使用，并且最初看來功能安好。和的區(qū)別最大的區(qū)別在于托管于而不是。存在的問題在使用中，我們發(fā)現(xiàn)存在的問題主要表現(xiàn)在兩方面。使用考慮到的獨立性，我們設計了一個來管理所有，并使用和建立通訊。
在 FoxOne 1.5.1 版更新中，打開各個交易所網(wǎng)頁的速度得到了巨大提升。
我們分別在不同的網(wǎng)絡環(huán)境下，測算了新版 FoxOne 在 Dom 加載和頁面加載條件下的所需時間：
可以看到，無論是 DOM 加載速度還是 Page 加載速度，新方案都有不同程度的提升（從 9% ~ 31%）。我們是怎么做到的呢？
Webview的問題FoxOne 的桌面版本使用了 Electron + Electron Builder + Vue 作為技術(shù)棧。Electron 是使用 Web 技術(shù)構(gòu)建桌面 App 的框架，而 Electron Builder 則為 Electron 提供了打包、簽名、跨平臺 CI、自動更新的全家桶方案。
我們當初選擇 Electron，是因為 Web 技術(shù)會為 FoxOne 開發(fā)提供了很多便利，但由于 Electron 項目對 Chromuim 的依賴，在 Chromuim 上游的一些問題也就無縫平移到了 Electron。其中的典型就是
webview 可以看作一個跑在獨立進程中的更安全的 iframe。如果我們需要在 Electron App 中嵌入一個網(wǎng)頁（而不是在新窗口中打開），把它放在 webview 中是官方建議的標準做法，很多著名桌面軟件也在使用它。
最初，F(xiàn)oxOne 也在使用 webview，并且最初看來功能安好。但是很快我們就發(fā)現(xiàn)了問題：
一、雖然 webview 跑在獨立進程中，但是在 DOM 結(jié)構(gòu)上與 Renderer 進程同源，因此渲染 webview 時會拖累整個 Renderer 進程的 DOM；
二、webview 中存在一些 issues (1,2,3)，這些問題我們不能解決，Electron 團隊也不能解決——甚至，考慮到 webview 在 Chromuim 中狹窄的應用范圍，可能 Chromuim 團隊也沒打算解決。
針對以上問題，我們決定使用browserview 來代替 webview。
browserview 和 webview 的區(qū)別最大的區(qū)別在于 browserview 托管于 main process 而不是 renderer。這非常類似于 Chrome 中對頁面的處理方式，因此可以獲得很高的頁面響應速度。
當然，因為從此 GUI 分屬于兩個 process，所以代價是我們必須在處理 GUI 布局時對 browserview 多帶帶處理。
browserview 存在的問題在使用中，我們發(fā)現(xiàn) browserview 存在的問題主要表現(xiàn)在兩方面。
browserview 缺少 webview 豐富的 API。使用 browserview，你將無法使用插件，預加載腳本，截圖等能力
browserview 不活動在 renderer 進程，因此無法使用舒服的 CSS 來控制布局。
對于第一點，我們在實現(xiàn)中選擇直接操作 webContents，來獲取失去的方法和屬性。對于第二點，我們設計了專門的 browserview manager 來控制 browserview 的布局外在表現(xiàn)。
使用 browserview考慮到 browserview 的獨立性，我們設計了一個 browserview manager 來管理所有 browserviews，并使用 ipcMain 和 ipcRenderer 建立通訊。
當用戶在客戶端進行操作（如前進、后退、刷新、切換頁等）時，對應的指令通過 Electron event 機制傳達到 browserview manager，然后讓 browserview manager 操作 browserview 和其中的 webcontents 執(zhí)行指令。
結(jié)語雖然 browserview 在 Electron 中依然是一個實驗性功能，API 也不完備，缺乏 script preload 等 webview 擁有的機制。但如果你需要在 App 中嵌入外部網(wǎng)頁，在合適的 trade-off 下，使用 browserview 不失一個好選擇。
招聘時間～FoxOne 是一個技術(shù)導向的創(chuàng)新團隊。我們正在圍繞基礎研究和產(chǎn)品化，尋覓正確的區(qū)塊鏈技術(shù)應用方向。而現(xiàn)在，改變世界需要有你同行。
我們正在招聘前端工程師、移動端工程師、爬蟲工程師、Golang 研發(fā)工程師、社群產(chǎn)品運營。歡迎青睞 FoxOne 的優(yōu)秀人才加入我們。
請留意我們的招聘郵箱為 jobs@fox.one。謝謝大家閱讀。
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/107671.html
摘要：發(fā)布本周正式發(fā)布，包含了一系列的特性提升與問題修復，同時也在不斷致力于將打造地更為輕巧與高性能。當然，姜振勇老師還會介紹的多種服務，包括大數(shù)據(jù)網(wǎng)絡和安全，展現(xiàn)彈性安全和高可擴展性的全方位能力。 showImg(http://upload-images.jianshu.io/upload_images/1647496-2ce7598e6987d9af.jpg?imageMogr2/aut...
摘要：前端日報精選流式分頁方案探索異步流程控制掘金虛擬內(nèi)部是如何工作的眾成翻譯移動端圖片上傳旋轉(zhuǎn)壓縮的解決方案源碼分析整體流程支持中文譯升級指南掘金第期理解前端現(xiàn)狀答題救不了前端新人掘金進階系列文件上傳下載數(shù)組操作大全 2017-06-30 前端日報 精選 流式分頁方案探索異步流程控制 - 掘金虛擬DOM內(nèi)部是如何工作的? - 眾成翻譯移動端圖片上傳旋轉(zhuǎn)、壓縮的解決方案 · Issue #1...
摘要：最少化請求用戶在瀏覽網(wǎng)頁時，超過的時間都是在請求下載網(wǎng)頁資源，包括圖片，樣式，腳本，等等，減少這些資源的下載請求數(shù)目，便成了讓網(wǎng)頁提速的關鍵。但需要提的是，中對請求的長度限制在字節(jié)以內(nèi)參考，所以如果超過這個長度，只能使用請求。 前端工程師常常被提起網(wǎng)站性能，如何讓網(wǎng)站訪問更快等問題，本文就做個總結(jié)。 最少化HTTP請求 用戶在瀏覽網(wǎng)頁時，超過80%的時間都是在請求下載網(wǎng)頁資源，包括...
摘要：最少化請求用戶在瀏覽網(wǎng)頁時，超過的時間都是在請求下載網(wǎng)頁資源，包括圖片，樣式，腳本，等等，減少這些資源的下載請求數(shù)目，便成了讓網(wǎng)頁提速的關鍵。但需要提的是，中對請求的長度限制在字節(jié)以內(nèi)參考，所以如果超過這個長度，只能使用請求。 前端工程師常常被提起網(wǎng)站性能，如何讓網(wǎng)站訪問更快等問題，本文就做個總結(jié)。 最少化HTTP請求 用戶在瀏覽網(wǎng)頁時，超過80%的時間都是在請求下載網(wǎng)頁資源，包括...
摘要：為了能使不同的進程互相訪問資源并進行協(xié)調(diào)工作，才有了進程間通信。此時，就需要與渲染進程通信了。發(fā)消息，渲染進程收消息內(nèi)部使用來發(fā)消息。 作者：鐘離，酷家樂PC客戶端負責人原文地址：https://webfe.kujiale.com/electron-ku-jia-le-ke-hu-duan-kai-fa-shi-jian-fen-xiang-jin-cheng-tong-xin/酷家...
閱讀 3054·2023-04-26 00:40
閱讀 2391·2021-09-27 13:47
閱讀 4197·2021-09-07 10:22
閱讀 2966·2021-09-06 15:02
閱讀 3307·2021-09-04 16:45
閱讀 2484·2021-08-11 10:23
閱讀 3599·2021-07-26 23:38
閱讀 2900·2019-08-30 15:54
