微前端架構應用

微前端架構:優勢,缺點和痛點
一. 什麼是微前端
“微前端架構”就是構建基於微服務的前端應用架構。
其思想是將前端應用切分爲一系列可以單獨部署的松耦合的應用,然後將這些應用組裝起來創建單個面向用戶的應用程序。
微前端的實現各不相同,因爲不同的公司的技術方案不同,從服務器端頁面嵌入到iframes到Javascript元框架(meta-frameworks)和web components。
二. 微服務的一些優勢包括:
微前端架構具備以下幾個核心價值:
技術棧無關:主框架不限制接入應用的技術棧,子應用具備完全自主權
獨立開發、獨立部署:子應用倉庫獨立,前後端可獨立開發,部署完成後主框架自動完成同步更新
獨立運行時:每個子應用之間狀態隔離,運行時狀態不共享,進行迭代和更新不互相影響。

這些都是實實在在的優點,尤其是對於大型和複雜的項目,但是小的應用程序也能夠從獨立發佈帶來一些收益。
三. 缺點:操作複雜
隨着我們從編輯靜態文件到複雜的構建系統,移植(transpilation)和大型框架,獲得功能良好的前端環境的複雜性已經大大增加。微前端進一步加劇了這種趨勢,現在在整個應用程序中進行任何類型的測試可能都需要多個協調的前端,更不用說使用什麼工具將他們融合在一起了。
微前端老手可能會遇到的挑戰:

需要在開發中運行許多不同的應用程序以測試完成的體驗
跟蹤和調試問題需要跨全部系統
跨系統進行版本控制

本質上講,是通過前端的簡單性換取整個系統(前端/後端)的複雜性。
四. 痛點: 性能,不連貫的體驗
在twitter上有許多對於微前端的揶揄

微前端有一些非常糟糕的問題:

每個團隊都有自己的選擇,瀏覽器最終可能會下載多個框架和重複的代碼
用戶不會單獨體驗你的公司網站或者產品。這也是反對對組件進行完全範圍界定的論點之一 ——— 對於完全分離的團隊這個問題可能更嚴重。
微前端的某些實現(尤其是嵌入iframe的實現)可能會帶來巨大的可訪問性的挑戰

雖然擁護者會辯稱這些事情不一定要發生,但這種情況似乎確實使我們更有可能看到這些問題。
五. 折中方案: 微前端使用的範圍
是利還是弊取決於你和你的環境因素。對於規模較小,位於同一地點的團隊和相對簡單的產品而言,微前端的好處相對於弊端而言是很小的,而對於大型多面的產品和多個分佈式團隊而言,好處可能會超過挑戰。
還有很多方法在消除不利影響的情況下獲取許多好處

通過堅持選擇單一的框架,並利用諸如single-spa.js之類的協調框架,您可以通過共享資源和僅下載一次公共代碼來減輕很多性能損失。
使用共享的組件庫,也可以消除許多用戶體驗不一致的問題。
當然,在每個步驟中都會放棄一些獨立性。在某些時候,就根本不再是微前端架構。在這個範圍內那個確切的對你有意義的點在哪裏,取決於你的產品和代碼組織。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章