跑分安卓第一！Redmi K60至尊版8月發布！盧偉冰：目標年度性能之王
8月5日消息，Redmi K60至尊版將于8月發布，在此前舉行的戰略發布會上，官方該機將搭載搭載天璣9200+處理器，安兔兔V10跑分超177萬分，是目前安卓陣營最高的分數
微前端是一種架構風格，旨在將大型前端應用程序拆分為更小、更可管理的部分。它通過將前端應用程序劃分為多個獨立的子應用，每個子應用都有自己的代碼庫和獨立的開發團隊來實現。這些子應用可以獨立部署、獨立運行，并且可以在同一個頁面上協同工作。
微前端的核心思想是將前端應用程序拆分為多個獨立的功能模塊，每個模塊都可以獨立開發、測試和部署。這樣可以提高開發效率，降低代碼耦合度，并且可以讓不同團隊獨立開發不同的模塊，從而提高團隊的協作效率。
在微前端架構中，每個子應用都可以使用不同的技術棧和框架，因此可以根據具體需求選擇最適合的技術棧。同時，微前端還提供了一些通信機制，使得不同子應用之間可以進行跨域通信和共享數據。
總之，微前端是一種將前端應用程序拆分為多個獨立子應用的架構風格，可以提高開發效率、降低代碼耦合度，并且可以讓不同團隊獨立開發不同的模塊，從而提高團隊的協作效率。
微前端并不是一項新的技術，而是一種架構理念，它將單一的 web 應用拆解成多個可以獨立開發、獨立運行、獨立部署的小型應用，并將它們整合為一個應用。
在實際業務中，我們也遇到同樣的問題，并且在不同的業務場景下嘗試了各種解決方案，如 iframe、npm 包、微前端框架，并對各種方案的優劣進行了對比。
iframe：在所有微前端方案中，iframe 是最穩定的、上手難度最低的，但它有一些無法解決的問題，例如性能低、通信復雜、雙滾動條、彈窗無法全局覆蓋，它的成長性不高，只適合簡單的頁面渲染。
npm 包：將子應用封裝成 npm 包，通過組件的方式引入，在性能和兼容性上是最優的方案，但卻有一個致命的問題就是版本更新，每次版本發布需要通知接入方同步更新，管理非常困難。
微前端框架：流行的微前端框架有 single-spa 和 qiankun，它們將維護成本和功能上達到一種平衡，是目前實現微前端備受推崇的方案。
圖片
在 single-spa 和 qiankun 中都是通過監聽 url change 事件，在路由變化時匹配到渲染的子應用并進行渲染。這種基于路由監聽渲染是 single-spa 最早實現的，作為出現最早、最有影響力的微前端框架，single-spa 被很多框架和公司借鑒，也導致目前實現的微前端的方式大多是基于路由監聽。
微前端的核心在于資源加載與渲染，iframe 的渲染方式就是一個典型，只要能夠實現一種元素隔離的功能并且路由符合要求，子應用理論上不需要修改代碼就可以嵌入另外一個頁面渲染，
圖片
micro-app 是京東零售推出的一款微前端框架，它基于類 WebComponent 進行渲染，從組件化的思維實現微前端，旨在降低上手難度、提升工作效率。它是目前接入微前端成本最低的框架，并且提供了JS沙箱、樣式隔離、元素隔離、預加載、資源地址補全、插件系統、數據通信等一系列完善的功能。
micro-app 與技術棧無關，也不和業務綁定，可以用于任何前端框架。
圖片
micro-app 是京東出品，一款基于 WebComponent 的思想，輕量、高效、功能強大的微前端框架。micro-app 作為一個用于實現微前端架構的開源庫，具有以下幾個優勢：
micro-app 使用起來成本最低，將所有的頁面封裝到一個類 WebComponent 組件中，從而實現在主應用基座中嵌入一行代碼即可渲染一個微前端應用。不需要像 single-spa 和 qiankun 一樣要求子應用修改渲染邏輯并暴露出方法，也不需要修改 webpack 配置，是目前市面上接入微前端成本最低的方案。提供了 js沙箱、樣式隔離、元素隔離、預加載、數據通信、靜態資源補全等一系列完善的功能。沒有任何依賴，這賦予它小巧的體積和更高的擴展性。為了保證各個業務之間獨立開發、獨立部署的能力，micro-app 做了諸多兼容，在任何技術框架中都可以正常運行。
圖片
圖片
WebComponent 核心組成有兩部分：CustomElement 和 ShadowDom。
由于 WebComponent 是原生組件，它可以在任何框架中使用，理論上是實現微前端最優的方案。但 WebComponent 有一個無法解決的問題 - ShadowDom的兼容性非常不好，一些前端框架在 ShadowDom 環境下無法正常運行，尤其是 react 框架。
圖片
而對于 micro-app 它選擇了另外一條路類 WebComponent + HTML Entry。
micro-app，它的渲染機制和功能與 WebComponent 類似，開發者可以像使用 web 組件一樣接入微前端。它可以兼容任何框架，在使用方式和數據通信上也更加組件化，這顯著降低了基座應用的接入成本，并且由于元素隔離的屬性，子應用的改動量也大大降低。
micro-app 的核心功能在 CustomElement 基礎上進行構建，CustomElement 用于創建自定義標簽，并提供了元素的渲染、卸載、屬性修改等鉤子函數，通過鉤子函數獲知微應用的渲染時機，并將自定義標簽作為容器，微應用的所有元素和樣式作用域都無法逃離容器邊界，從而形成一個封閉的環境。
圖片
micro-app 將所有功能都封裝到一個類 WebComponent 組件中，從而實現在基座應用中嵌入一行代碼即可渲染一個微前端應用。同時micro-app 還提供了js沙箱、樣式隔離、元素隔離、預加載、數據通信、靜態資源補全等一系列完善的功能。micro-app 零依賴，沒有任何依賴，這賦予它小巧的體積和更高的擴展性。micro-app 兼容所有框架，為了保證各個業務之間獨立開發、獨立部署的能力，micro-app 做了諸多兼容，在任何技術框架中都可以正常運行。
本文鏈接：http://www.www897cc.com/showinfo-26-16751-0.html基于 Web Components 的微前端框架
聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。郵件：2376512515@qq.com
上一篇： 阿里二面：ThreadLocal內存泄露靈魂四問，人麻了！
下一篇： 用積分神經網絡在一分鐘內轉換DNN
Copyright ? 2016-2023 天津谷騏科技有限公司 版權所有 sitemap.xml
違法及侵權請聯系：2376512515@qq.com 津ICP備18001702號
津公網安備 12010102000574號