微前端架構(gòu)是為了在解決單體應(yīng)用在一個(gè)相對(duì)長(zhǎng)的時(shí)間跨度下，由于參與的人員、團(tuán)隊(duì)的增多、變遷，從一個(gè)普通應(yīng)用演變成一個(gè)巨石應(yīng)用(Frontend Monolith)后，隨之而來(lái)的應(yīng)用不可維護(hù)的問(wèn)題。這類問(wèn)題在企業(yè)級(jí) Web 應(yīng)用中尤其常見(jiàn)。
微前端框架內(nèi)的各個(gè)應(yīng)用都支持獨(dú)立開(kāi)發(fā)部署、不限技術(shù)框架、支持獨(dú)立運(yùn)行、應(yīng)用狀態(tài)隔離但也可共享等特征。
本文會(huì)從框架的應(yīng)用隔離實(shí)現(xiàn)方案、實(shí)戰(zhàn)、優(yōu)缺點(diǎn)三個(gè)方面探一探各個(gè)框架。幫助大家了解各個(gè)框架是如何使用，如何運(yùn)行，從而能選出適合自己項(xiàng)目的微前端方案。
iframe
在沒(méi)有各大微前端解決方案之前，iframe是解決這類問(wèn)題的不二之選，因?yàn)?code>iframe提供了瀏覽器原生的硬隔離方案，不論是樣式隔離、js 隔離這類問(wèn)題統(tǒng)統(tǒng)都能被完美解決。
但他的最大問(wèn)題也在于他的隔離性無(wú)法被突破，導(dǎo)致應(yīng)用間上下文無(wú)法被共享，隨之帶來(lái)的開(kāi)發(fā)體驗(yàn)、產(chǎn)品體驗(yàn)的問(wèn)題：
-
url 不同步，瀏覽器刷新 iframe url 狀態(tài)丟失、后退前進(jìn)按鈕無(wú)法使用。
-
UI 不同步，DOM 結(jié)構(gòu)不共享，彈窗只能在iframe內(nèi)部展示，無(wú)法覆蓋全局
-
全局上下文完全隔離，內(nèi)存變量不共享，iframe 內(nèi)外系統(tǒng)的通信、數(shù)據(jù)同步等需求，主應(yīng)用的 cookie 要透?jìng)鞯礁蛎疾煌淖討?yīng)用中實(shí)現(xiàn)免登效果。
-
慢，每次子應(yīng)用進(jìn)入都是一次瀏覽器上下文重建、資源重新加載的過(guò)程。文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-852159.html
single-spa
目前(2024年4月)github star 13k文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-852159.html
到了這里，關(guān)于微前端框架主流方案剖析的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
