動態載入 Web Component
什麼是 Web Component?Web Component 是一個封裝自定義元件的技術,讓我們可以輕易地在不同應用程式中重用這些被封裝的元件,不僅如此,Web Component 不限定應用程式使用的框架或函式庫,不論今天是 Angular 或 React,甚至是 Vanilla JavaScript 都能夠輕鬆使用。 INFO:關於 Web Component 的詳細資訊可以參考 MDN。 為什麼需要 Web Component?Web Component 的問世,可以實現較理想的 微前端(Micro Frontend) 概念,在過去,會以 iframe 的形式將其他團隊開發的元件、頁面嵌入至自己的系統內來實現微前端,但這樣的做法會有很多的限制,比如:跨域、生命週期等。 透過 Web Component 則可以避免這些問題,因為概念上就是將其他團隊開發的元件程式碼嵌入並串接至自己的系統裡。 NOTE:微前端也可以用 Module Federation 技術來實作,有興趣的話,可以參考相關文件。 動態載入 Web Component目前常見的 Web...