技術期刊 · 路塵終見泰山平 | 微前端及插件化架構在 Wix 的實踐;編輯器架構的第二路徑;業務中的前端組件化體系……

HEADER

蒲公英 · JELLY技術期刊 Vol.47

不想當架構師的程序員不是“合格”的程序員?這一類的言論在很多文章中應該很常見吧,我們需要架構思維,要有抽象能力,要學會分層……需要的太多太多,可很少有合適的項目能夠幫助我們養成這些思考的習慣,比如業務組件體系的設計,又比如編輯器等等,需要權衡技術與業務之間的平衡,架構設計穩定性與拓展能力,面對業務保持思考,泰山如砥平。

觀海志

登山則情滿於山,觀海則意溢於海

微前端及插件化架構在 Wix 的實踐

梗概:微前端的概念已經出現了相當一段時間。我們從 2013 年左右就開始在 Wix 中使用這種架構,甚至早在它被命名爲 Wix 之前。這也是我們在 2016 年逐漸從 AngularJS 遷移到 React 的關鍵因素。多年來,我們一直在改進它,並積累了大量的經驗。在本文中,我想與大家分享一些我們爲了發展大規模微前端開發概念所做的工作(在撰寫本文時,我們有 700名 開發人員在這個體系架構上工作)。

推薦語:作爲世界上最優秀的建站產品之一,Wix 的建站編輯器功能和拓展性都非常強大。他們很早就採用微前端作爲可插拔系統的解決方案,並一直在這個體系上進行迭代。這篇文章詳細介紹了他們可插拔式微前端架構的誕生背景及技術實踐,包括一整套的開發/測試、構建/發佈、監控等的工作流,對應的可插拔的微前端架構的 IoC 庫已開源:https://github.com/wix/repluggable

編輯器架構的第二路徑

梗概:Slate 讓你構建像 Medium, Dropbox Paper 或者是 Google Docs 這樣豐富,直觀的編輯器,而不會讓你在代碼實現上深陷複雜度的泥潭。

推薦語:編輯器應用的複雜度堪稱是 Web 應用中數一數二的,業內知名的多人協同編輯器難度更是堪稱業內標杆,但是編輯器真的就只能設計的無比複雜麼?值得一提的是 Slate 整體設計優雅且靈活,各個模塊設計精巧卻十分易懂,值得細細品味。高效穩健的代碼有時候和設計複雜度並沒有很高的關聯性,這很值得我們在組織各個模塊能力時思考。

業務中的前端組件化體系

梗概:組件化已經是一個老生常談,但是又經久不衰的話題。隨着技術的更迭,業務複雜度的增加,組件化被反覆拿出來重新審視,可以說組件化之路一定程度上體現了程序開發的發展歷程。

推薦語:本文從實際業務場景出發,針對組件實現上的常見問題,深入淺出的剖析了組件設計思路,以及業務中的前端組件化體系的搭建,可以瞭解到組件狀態的可組合性、分層複用以及跨技術棧集成等知識點,具備很強的實操性,非常值得一讀。

構建網站的 Spotlight 插件

梗概:考慮實現類似 MacOS 的 Spotlight 和 Linear 的 command+k 體驗?使用 kbar 可以爲您的站點添加一個快速的、可擴展的 command + k 菜單。

推薦語:提升用戶體驗是一個很宏大的命題,但是有的時候卻只需要簡單的幾步,例如你可以使用 kbar 就能夠爲您的網站加入媲美 Spotlight 的 command + k 體驗,相信這對於很多個人開發者會很有幫助~

流觴亭

因山卜地心機巧,望水如天眼力窮

Theia 技術揭祕之插件拓展

梗概:Theia 的插件化設計十分有趣,在保證功能穩定的同時賦予了系統極強的拓展能力,本文從名詞開始解析,敘述在 Cloud IDE 設計的過程中,需要一個怎樣的插件系統,深入淺出的講解不同系統模塊之間的架構,教你快速上手編寫 Theia 插件。

推薦語:Theia 插件系統功能非常強大,如此龐大的工程,同時還耦合了繁複的能力模塊,卻依然能保持高質量的代碼和清晰的架構,這是很多業務項目都難以做到的,這樣的項目架構可能很多時候並不需要,但一定值得我們思考和學習。

Theia 技術揭祕之 Theme

梗概:Theia 的主題設計遵循了 VS Code 的 Theme 規範,本文從類型開始,詳細說明了實現需要考慮的問題,以及 Theia 應用具體實現 VS Code 規範下的 Theme 插件的細節。

推薦語:對於編輯器來說,從零開始實現是不現實的,那麼如果可以兼容現有的設計就是一個很棒的選擇,VS Code 各種意義上來說,都是一個極好的參考對象,通過兼容 VS Code 的主題就能夠極大減少用戶的遷移成本。

「蒲公英」期刊,每週更新,我們專注於挖掘「基礎技術工程化跨端框架技術圖形編程服務端開發桌面開發人工智能設計哲學前端框架」等多個大方向的業界熱點,並加以專業的解讀;不僅如此,我們還會推介精選凹凸技術文章,向大家呈現團隊內的研究技術方向。

擡頭仰望,蒲公英的種子會生根發芽,如夏花絢爛;格物致知,我們登高遠眺、滄海拾遺,以求積硅步而至千里。

蒲公英 · JELLY技術期刊貢獻指南

FOOTER

歡迎關注凹凸實驗室博客:aotu.io

或者關注凹凸實驗室公衆號(AOTULabs),不定時推送文章。

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