Thoughtworks 技術專家 Phodal：2022 年前端趨勢總結

類微前端：豐富與靈活的各類模式

與多年前相比，微前端及類微前端模式已經靈活多變：

• 微內核模式，即胖 vendor + 插件式的瘦組件。
• 標準微前端模式，基於定製的底座，以使各個應用、組件完全獨立。
• 混合模式，即介於微內核與微服務化模式，諸如半嵌入的微內核模式。
• 無組件模式，諸如基於 Web Components、Islands 架構模式構建豐富的組件集。

現在，我們的挑戰變成：如何選擇合適的模式？

工具鏈：追求速度與非凡體驗

眾所周知，JavaScript 的工具鏈存在執行速度的問題，主要體現在編譯方面，進而影響到開發和構建速度。

• Rust 作為 JavaScript 的基礎設施語言之一，在底層的 Node.js 生態方面，諸如 NAPI-RS 提供了使用 Rust 構建預編譯 Node.js 原生擴展的能力。而圍繞編譯與構建的 SWC、Parcel 等工具也提供了更快的開發體驗。
• 其它語言，諸如採用 Golang 語言的 ESBuild、採用 Zig 語言的 Bun 開發的 JS 運行時等。

接下來，我們要考慮的是兼容性。

低代碼的另外一種聲音

社區已經達成共識：針對不同的場景，構建不同的低代碼平台。而對於中小型公司，還面臨着一個問題，開發人員響應“熱鬧驅動開發”開發了低代碼平台，而這些低代碼平台似乎並沒有真正體現價值？設計不出適合業務使用的體驗與流程？

值得一提的是，金融科技公司傾向於招聘會 Python 的業務人員。或許，你需要真正懂數字化的業務？

瀏覽器智能

在移動設備上運行 TensorFlow Lite，在邊緣型的嵌入式設備中能部署 AI 應用（tinyML），那麼直接運行在瀏覽器上的 AI 也將變得流行（TensorFlow.js、ML5.js）。而我們還要面對模型體積帶來的網絡影響，如何平衡體積與質量成為了一種挑戰？

架構模式：SDUI 與 Islands

在 2022 年裏，一些過去陌生的架構模式，也逐漸變得耳熟能詳。

• Server Driven UI。在 SDUI 架構下，服務器返回的數據（JSON）會包含頁面的組件信息、佈局以及數據類型等等，前端則根據這些信息來渲染 UI。從模式上來説，它與我們現今構建的低代碼模式極為類似，圍繞生成的 JSON 生成組件等的信息。相比之下，只是產出的結果和過程數據略有差異。
• Islands 架構（孤島架構）。孤島架構鼓勵在服務器呈現的網頁中使用小的、集中的交互塊。Islands 的輸出是漸進式增強的 HTML，更具體地説明了增強是如何發生的。

這兩種模式依賴服務器來動態生成，還存在依賴 CDN 的動態生成模式。

邊緣 JavaScript

多年前，Cloudflare 公司提供了一個名為 Cloudflare Worker 的工具，可以在邊緣側執行應用程序。越來越多的主流框架支持這種方式，諸如 Next.js 的 Edge Runtime。簡單來説，CDN 廠商提供了一個動態的 JavaScript 服務器，讓代碼運行在邊緣側，以提高應用程序的訪問速度。其適合處理預處理場景，諸如授權等，也應用於 Islands 架構。