本文翻譯自 Sending UI over APIs，主要介紹了透過 API 來渲染 UI 頁面的方案，這種方案常用於客戶端的動態渲染以及一些運營活動頁面的渲染。這篇文章主要從伺服器拿到 UI 的結構
透過 API 傳送 UI 是一種改變我們對 UI 思考方式的技術，該技術也被稱之為伺服器驅動的 UI。與傳統的 UI 開發正規化相比，這種開發方式更加靈活，也正在影響和改變著傳統的 UI 開發方式。
伺服器驅動的 UI 不僅僅是一個理論概念；一些科技行業的公司已經開始實施這種方法。例如 Instagram、Lyft 和 Airbnb 利用伺服器驅動的 UI 向全球數百萬使用者提供動態內容和更新。
那麼，什麼是伺服器驅動的 UI？它們是如何工作的，為什麼它們在現代 JavaScript 開發中變得如斯重要？本文旨在回答這些問題，並深入介紹伺服器驅動的 UI，它們的優劣勢，以及如何在自己的專案中實現它們。
瞭解伺服器驅動的 UI
伺服器驅動的 UI 代表了一種新的 UI 開發方法。它們透過 API 在伺服器端動態生成 UI，並將其傳送到客戶端。這種方法可以提供更快的迭代速度和更個性化的使用者體驗。
儘管需要面臨著一些挑戰，例如應用商店指南和離線使用者體驗，但伺服器驅動的 UI 為 UI 開發的未來提供了另外的方向。
相比之下，伺服器驅動的 UI 是在伺服器上動態生成並透過 API 傳送到客戶端的。伺服器傳送 UI 用 JSON 來表示，然後在客戶端進行渲染。這意味著可以在伺服器端更新 UI，而無需對客戶端進行任何更改。
UI 變得動態且靈活，可以根據使用者行為、A/B 測試結果或新功能釋出等各種因素實時更改。例如，Builder.io 在其框架 SDK 中使用這種方法，透過提供可接受 JSON 輸入並渲染基於視覺構建的設計的元件：
javascriptimport { BuilderComponent } from "@builder.io/react";export default async function MyPage({ params }) { const builderJSON = await builder // 使用URL中指定的頁面路徑獲取 Builder 中的頁面內容 JSON .get("page", { userAttributes: { urlPath: "/" + (params?.page?.join("/") || ""), }, }) return ( > );}
這種方法相比傳統的 UI 開發具有幾個優點。首先，它允許更快的迭代，因為可以在伺服器端進行更改，並立即在客戶端上反映出來。它還使後端開發人員能夠參與前端開發，因為他們可以在伺服器上定義 UI 結構和行為。
然而，伺服器驅動的 UI 也面臨一些挑戰。它們需要以不同的方式思考 UI 開發，並需要考慮如何處理操作並保持流暢的使用者體驗。但是透過仔細的規劃和實施，這些挑戰是可以克服的。
伺服器驅動的 UI 在 Instagram 中的作用
Instagram 對伺服器驅動的 UI 的採用為這種創新方法提供了一個引人注目的案例研究。這家社交媒體巨頭開發了一種名為 “blocks” 的技術，利用伺服器驅動的 UI 的概念向用戶提供動態內容和更新。
Steve Sewell（Builder.io的執行長）和 Yaser Alkayale（Instagram/Meta的工程師）就透過 API 傳送 UI 進行了一次對話。
在 Instagram 的實現中，伺服器向客戶端傳送一個樹狀結構的 blocks。每個 block 表示 UI 的一部分，幷包含有關應該渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。然後客戶端遍歷此樹形結構，按照 blocks 所指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的UI元件中發現一個錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即修復所有使用者的錯誤。
此外，伺服器驅動的 UI 使 Instagram 能夠更快地迭代其產品。產品團隊不再需要等待發布新的應用程式版本，而是可以在伺服器上對 UI 進行更改，並立即在應用程式中看到這些變化。這導致了更加敏捷和響應性的產品開發過程。
伺服器驅動的 UI 的好處
採用伺服器驅動的 UI 帶來了許多優勢，可以顯著提升開發過程和終端使用者體驗。
即時修復錯誤和更快的迭代：正如 Instagram 的案例所示，其中最重要的優勢之一是能夠立即修復錯誤並進行更快的迭代。可以在伺服器端對 UI 進行更改，並立即在客戶端反映出來，無需使用者更新應用程式或開發人員經歷冗長的應用商店稽核流程。
後端開發人員參與前端開發：伺服器驅動的 UI也 模糊了前端和後端開發之間的界限。後端開發人員可以在伺服器上定義 UI 結構和行為，從而更直接地參與前端開發過程。這可以更有效地利用資源，形成更具凝聚力的開發團隊。
動態和個性化的使用者體驗：透過伺服器驅動的 UI，使用者體驗可以根據各種因素進行動態定製。例如，伺服器可以基於使用者的行為、偏好甚至 A/B 測試結果傳送不同的 UI。這可以帶來更加個性化和令人著迷的使用者體驗。
減少客戶端複雜性：透過將大部分 UI 邏輯移到伺服器端，伺服器驅動的 UI 可以減少客戶端的複雜性。這可以使客戶端更輕、更快，從而提高效能和使用者體驗的流暢性。
構建伺服器驅動的 UI：實用指南
一開始，構建伺服器驅動的 UI 可能會令人望而生畏，但透過對過程的清晰理解和一些實踐步驟，會逐步解決對這些問題。以下是構建伺服器驅動的 UI 的步驟：
建立樹狀結構：構建伺服器驅動的UI的第一步是建立一個類似樹狀的結構，代表您的 UI。樹中的每個節點對應一個 UI 元件，幷包含有關渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。
處理操作：在伺服器驅動的 UI 中，需要處理操作，例如使用者互動。可以透過在元件中包含操作處理程式來完成，這些處理程式向伺服器傳送請求。然後，伺服器可以根據操作響應一個新的 UI 樹。
使用 JSON 格式：通常使用 JSON 格式表示 UI 樹，可以透過 API 輕鬆傳送並由客戶端解析。
實現渲染引擎：在客戶端，您需要一個渲染引擎，它可以遍歷UI樹並按照樹所指定的方式渲染元件。
測試和迭代：與任何開發過程一樣，測試和迭代至關重要。務必對您的伺服器驅動的UI進行全面測試，並根據您的發現進行改進。
伺服器驅動 UI 的角色
Instagram 採用伺服器驅動 UI 的方法提供了一個引人注目的案例研究，展示了這種創新方法在實踐中的應用。這家社交媒體巨頭開發了一項名為 “blocks” 的技術，利用伺服器驅動UI的概念向用戶提供動態內容和更新。
Builder.io 執行長 Steve Sewell 與 Instagram/Meta 工程師 Yaser Alkayale 就透過 API 傳送 UI 進行了討論：
在 Instagram 的實現中，伺服器向客戶端傳送一個類似樹形結構的 blocks。每個 block 代表 UI 的一部分，幷包含有關要渲染哪個元件以及將哪些屬性傳遞給該元件的資訊。然後客戶端遍歷這個樹結構，按照 blocks 指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的 UI 元件中發現錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即為所有使用者修復該錯誤。
此外，伺服器驅動 UI 使 Instagram 能夠更快地迭代其產品。產品團隊無需等待發布新版本的應用程式，而是可以在伺服器上對 UI 進行更改，立即在應用程式中看到這些變化。這導致了更加敏捷和具有響應性的產品開發過程。
應對伺服器驅動 UI 的挑戰
儘管伺服器驅動 UI 為 UI 開發帶來了新的可能性，但也引入了開發人員需要意識到的新考慮因素：
應用商店準則：應用商店有一些需要遵循的準則。確保您使用的伺服器驅動 UI 符合這些準則非常重要。在提交應用程式進行稽核時，透明地說明您的 UI 方法可以幫助避免潛在問題。
離線使用者體驗：由於伺服器驅動 UI 依賴於伺服器通訊，保障離線情況下的使用者體驗可能會有挑戰。實施快取等策略可以確保即使沒有網路連線，也能維持一致的使用者體驗。
效能考慮：雖然伺服器驅動 UI 提供了動態功能，但還需要考慮效能問題。高效的網路請求和最佳化的渲染技術可以幫助保持流暢的使用者體驗。
增加的複雜性：實施伺服器驅動 UI 可能會給開發過程增加一層複雜性，因為 UI 管理發生在伺服器端和客戶端。然而，透過良好結構化的方法和明確的責任分工，可以有效管理這種複雜性。
儘管這些考慮因素存在其自身的挑戰，但它們也為問題解決和創新提供了機會。透過深思熟慮的規劃和執行，伺服器驅動 UI 可以成為您開發工具包中寶貴的補充。
結論
透過 API 傳送UI或伺服器驅動 UI 代表了 UI 開發領域的重大轉變。透過將大部分 UI 邏輯移到伺服器上，這種方法提供了一種動態性和靈活性，正在重新塑造行業。
從即時錯誤修復和更快的迭代到使後端開發人員能夠參與前端開發，伺服器驅動 UI 帶來了許多優勢。它們還可以實現更個性化和令人著迷的使用者體驗，並減少客戶端的複雜性以提高效能。
儘管存在應用商店準則和管理離線體驗等挑戰，但透過仔細規劃和戰略性方法，可以有效解決這些問題。
在提高前輩的 JavaScript 開發世界中，伺服器驅動 UI 不僅是一個理論概念，而且是 Instagram 等主要平臺正在採用的實際方法。隨著我們不斷突破 UI 開發的可能性，伺服器驅動 UI 為未來提供了令人興奮的方向。
作者:ikoofe
本文翻譯自 Sending UI over APIs，主要介紹了透過 API 來渲染 UI 頁面的方案，這種方案常用於客戶端的動態渲染以及一些運營活動頁面的渲染。這篇文章主要從伺服器拿到 UI 的結構
透過 API 傳送 UI 是一種改變我們對 UI 思考方式的技術，該技術也被稱之為伺服器驅動的 UI。與傳統的 UI 開發正規化相比，這種開發方式更加靈活，也正在影響和改變著傳統的 UI 開發方式。
伺服器驅動的 UI 不僅僅是一個理論概念；一些科技行業的公司已經開始實施這種方法。例如 Instagram、Lyft 和 Airbnb 利用伺服器驅動的 UI 向全球數百萬使用者提供動態內容和更新。
那麼，什麼是伺服器驅動的 UI？它們是如何工作的，為什麼它們在現代 JavaScript 開發中變得如斯重要？本文旨在回答這些問題，並深入介紹伺服器驅動的 UI，它們的優劣勢，以及如何在自己的專案中實現它們。
瞭解伺服器驅動的 UI
伺服器驅動的 UI 代表了一種新的 UI 開發方法。它們透過 API 在伺服器端動態生成 UI，並將其傳送到客戶端。這種方法可以提供更快的迭代速度和更個性化的使用者體驗。
儘管需要面臨著一些挑戰，例如應用商店指南和離線使用者體驗，但伺服器驅動的 UI 為 UI 開發的未來提供了另外的方向。
相比之下，伺服器驅動的 UI 是在伺服器上動態生成並透過 API 傳送到客戶端的。伺服器傳送 UI 用 JSON 來表示，然後在客戶端進行渲染。這意味著可以在伺服器端更新 UI，而無需對客戶端進行任何更改。
UI 變得動態且靈活，可以根據使用者行為、A/B 測試結果或新功能釋出等各種因素實時更改。例如，Builder.io 在其框架 SDK 中使用這種方法，透過提供可接受 JSON 輸入並渲染基於視覺構建的設計的元件：
javascriptimport { BuilderComponent } from "@builder.io/react";export default async function MyPage({ params }) { const builderJSON = await builder // 使用URL中指定的頁面路徑獲取 Builder 中的頁面內容 JSON .get("page", { userAttributes: { urlPath: "/" + (params?.page?.join("/") || ""), }, }) return ( > );}
這種方法相比傳統的 UI 開發具有幾個優點。首先，它允許更快的迭代，因為可以在伺服器端進行更改，並立即在客戶端上反映出來。它還使後端開發人員能夠參與前端開發，因為他們可以在伺服器上定義 UI 結構和行為。
然而，伺服器驅動的 UI 也面臨一些挑戰。它們需要以不同的方式思考 UI 開發，並需要考慮如何處理操作並保持流暢的使用者體驗。但是透過仔細的規劃和實施，這些挑戰是可以克服的。
伺服器驅動的 UI 在 Instagram 中的作用
Instagram 對伺服器驅動的 UI 的採用為這種創新方法提供了一個引人注目的案例研究。這家社交媒體巨頭開發了一種名為 “blocks” 的技術，利用伺服器驅動的 UI 的概念向用戶提供動態內容和更新。
Steve Sewell（Builder.io的執行長）和 Yaser Alkayale（Instagram/Meta的工程師）就透過 API 傳送 UI 進行了一次對話。
在 Instagram 的實現中，伺服器向客戶端傳送一個樹狀結構的 blocks。每個 block 表示 UI 的一部分，幷包含有關應該渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。然後客戶端遍歷此樹形結構，按照 blocks 所指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的UI元件中發現一個錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即修復所有使用者的錯誤。
此外，伺服器驅動的 UI 使 Instagram 能夠更快地迭代其產品。產品團隊不再需要等待發布新的應用程式版本，而是可以在伺服器上對 UI 進行更改，並立即在應用程式中看到這些變化。這導致了更加敏捷和響應性的產品開發過程。
伺服器驅動的 UI 的好處
採用伺服器驅動的 UI 帶來了許多優勢，可以顯著提升開發過程和終端使用者體驗。
即時修復錯誤和更快的迭代：正如 Instagram 的案例所示，其中最重要的優勢之一是能夠立即修復錯誤並進行更快的迭代。可以在伺服器端對 UI 進行更改，並立即在客戶端反映出來，無需使用者更新應用程式或開發人員經歷冗長的應用商店稽核流程。
後端開發人員參與前端開發：伺服器驅動的 UI也 模糊了前端和後端開發之間的界限。後端開發人員可以在伺服器上定義 UI 結構和行為，從而更直接地參與前端開發過程。這可以更有效地利用資源，形成更具凝聚力的開發團隊。
動態和個性化的使用者體驗：透過伺服器驅動的 UI，使用者體驗可以根據各種因素進行動態定製。例如，伺服器可以基於使用者的行為、偏好甚至 A/B 測試結果傳送不同的 UI。這可以帶來更加個性化和令人著迷的使用者體驗。
減少客戶端複雜性：透過將大部分 UI 邏輯移到伺服器端，伺服器驅動的 UI 可以減少客戶端的複雜性。這可以使客戶端更輕、更快，從而提高效能和使用者體驗的流暢性。
構建伺服器驅動的 UI：實用指南
一開始，構建伺服器驅動的 UI 可能會令人望而生畏，但透過對過程的清晰理解和一些實踐步驟，會逐步解決對這些問題。以下是構建伺服器驅動的 UI 的步驟：
建立樹狀結構：構建伺服器驅動的UI的第一步是建立一個類似樹狀的結構，代表您的 UI。樹中的每個節點對應一個 UI 元件，幷包含有關渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。
處理操作：在伺服器驅動的 UI 中，需要處理操作，例如使用者互動。可以透過在元件中包含操作處理程式來完成，這些處理程式向伺服器傳送請求。然後，伺服器可以根據操作響應一個新的 UI 樹。
使用 JSON 格式：通常使用 JSON 格式表示 UI 樹，可以透過 API 輕鬆傳送並由客戶端解析。
實現渲染引擎：在客戶端，您需要一個渲染引擎，它可以遍歷UI樹並按照樹所指定的方式渲染元件。
測試和迭代：與任何開發過程一樣，測試和迭代至關重要。務必對您的伺服器驅動的UI進行全面測試，並根據您的發現進行改進。
伺服器驅動 UI 的角色
Instagram 採用伺服器驅動 UI 的方法提供了一個引人注目的案例研究，展示了這種創新方法在實踐中的應用。這家社交媒體巨頭開發了一項名為 “blocks” 的技術，利用伺服器驅動UI的概念向用戶提供動態內容和更新。
Builder.io 執行長 Steve Sewell 與 Instagram/Meta 工程師 Yaser Alkayale 就透過 API 傳送 UI 進行了討論：
在 Instagram 的實現中，伺服器向客戶端傳送一個類似樹形結構的 blocks。每個 block 代表 UI 的一部分，幷包含有關要渲染哪個元件以及將哪些屬性傳遞給該元件的資訊。然後客戶端遍歷這個樹結構，按照 blocks 指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的 UI 元件中發現錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即為所有使用者修復該錯誤。
此外，伺服器驅動 UI 使 Instagram 能夠更快地迭代其產品。產品團隊無需等待發布新版本的應用程式，而是可以在伺服器上對 UI 進行更改，立即在應用程式中看到這些變化。這導致了更加敏捷和具有響應性的產品開發過程。
應對伺服器驅動 UI 的挑戰
儘管伺服器驅動 UI 為 UI 開發帶來了新的可能性，但也引入了開發人員需要意識到的新考慮因素：
應用商店準則：應用商店有一些需要遵循的準則。確保您使用的伺服器驅動 UI 符合這些準則非常重要。在提交應用程式進行稽核時，透明地說明您的 UI 方法可以幫助避免潛在問題。
離線使用者體驗：由於伺服器驅動 UI 依賴於伺服器通訊，保障離線情況下的使用者體驗可能會有挑戰。實施快取等策略可以確保即使沒有網路連線，也能維持一致的使用者體驗。
效能考慮：雖然伺服器驅動 UI 提供了動態功能，但還需要考慮效能問題。高效的網路請求和最佳化的渲染技術可以幫助保持流暢的使用者體驗。
增加的複雜性：實施伺服器驅動 UI 可能會給開發過程增加一層複雜性，因為 UI 管理發生在伺服器端和客戶端。然而，透過良好結構化的方法和明確的責任分工，可以有效管理這種複雜性。
儘管這些考慮因素存在其自身的挑戰，但它們也為問題解決和創新提供了機會。透過深思熟慮的規劃和執行，伺服器驅動 UI 可以成為您開發工具包中寶貴的補充。
結論
透過 API 傳送UI或伺服器驅動 UI 代表了 UI 開發領域的重大轉變。透過將大部分 UI 邏輯移到伺服器上，這種方法提供了一種動態性和靈活性，正在重新塑造行業。
從即時錯誤修復和更快的迭代到使後端開發人員能夠參與前端開發，伺服器驅動 UI 帶來了許多優勢。它們還可以實現更個性化和令人著迷的使用者體驗，並減少客戶端的複雜性以提高效能。
儘管存在應用商店準則和管理離線體驗等挑戰，但透過仔細規劃和戰略性方法，可以有效解決這些問題。
在提高前輩的 JavaScript 開發世界中，伺服器驅動 UI 不僅是一個理論概念，而且是 Instagram 等主要平臺正在採用的實際方法。隨著我們不斷突破 UI 開發的可能性，伺服器驅動 UI 為未來提供了令人興奮的方向。
作者:ikoofe
本文翻譯自 Sending UI over APIs，主要介紹了透過 API 來渲染 UI 頁面的方案，這種方案常用於客戶端的動態渲染以及一些運營活動頁面的渲染。這篇文章主要從伺服器拿到 UI 的結構
透過 API 傳送 UI 是一種改變我們對 UI 思考方式的技術，該技術也被稱之為伺服器驅動的 UI。與傳統的 UI 開發正規化相比，這種開發方式更加靈活，也正在影響和改變著傳統的 UI 開發方式。
伺服器驅動的 UI 不僅僅是一個理論概念；一些科技行業的公司已經開始實施這種方法。例如 Instagram、Lyft 和 Airbnb 利用伺服器驅動的 UI 向全球數百萬使用者提供動態內容和更新。
那麼，什麼是伺服器驅動的 UI？它們是如何工作的，為什麼它們在現代 JavaScript 開發中變得如斯重要？本文旨在回答這些問題，並深入介紹伺服器驅動的 UI，它們的優劣勢，以及如何在自己的專案中實現它們。
瞭解伺服器驅動的 UI
伺服器驅動的 UI 代表了一種新的 UI 開發方法。它們透過 API 在伺服器端動態生成 UI，並將其傳送到客戶端。這種方法可以提供更快的迭代速度和更個性化的使用者體驗。
儘管需要面臨著一些挑戰，例如應用商店指南和離線使用者體驗，但伺服器驅動的 UI 為 UI 開發的未來提供了另外的方向。
相比之下，伺服器驅動的 UI 是在伺服器上動態生成並透過 API 傳送到客戶端的。伺服器傳送 UI 用 JSON 來表示，然後在客戶端進行渲染。這意味著可以在伺服器端更新 UI，而無需對客戶端進行任何更改。
UI 變得動態且靈活，可以根據使用者行為、A/B 測試結果或新功能釋出等各種因素實時更改。例如，Builder.io 在其框架 SDK 中使用這種方法，透過提供可接受 JSON 輸入並渲染基於視覺構建的設計的元件：
javascriptimport { BuilderComponent } from "@builder.io/react";export default async function MyPage({ params }) { const builderJSON = await builder // 使用URL中指定的頁面路徑獲取 Builder 中的頁面內容 JSON .get("page", { userAttributes: { urlPath: "/" + (params?.page?.join("/") || ""), }, }) return ( > );}
這種方法相比傳統的 UI 開發具有幾個優點。首先，它允許更快的迭代，因為可以在伺服器端進行更改，並立即在客戶端上反映出來。它還使後端開發人員能夠參與前端開發，因為他們可以在伺服器上定義 UI 結構和行為。
然而，伺服器驅動的 UI 也面臨一些挑戰。它們需要以不同的方式思考 UI 開發，並需要考慮如何處理操作並保持流暢的使用者體驗。但是透過仔細的規劃和實施，這些挑戰是可以克服的。
伺服器驅動的 UI 在 Instagram 中的作用
Instagram 對伺服器驅動的 UI 的採用為這種創新方法提供了一個引人注目的案例研究。這家社交媒體巨頭開發了一種名為 “blocks” 的技術，利用伺服器驅動的 UI 的概念向用戶提供動態內容和更新。
Steve Sewell（Builder.io的執行長）和 Yaser Alkayale（Instagram/Meta的工程師）就透過 API 傳送 UI 進行了一次對話。
在 Instagram 的實現中，伺服器向客戶端傳送一個樹狀結構的 blocks。每個 block 表示 UI 的一部分，幷包含有關應該渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。然後客戶端遍歷此樹形結構，按照 blocks 所指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的UI元件中發現一個錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即修復所有使用者的錯誤。
此外，伺服器驅動的 UI 使 Instagram 能夠更快地迭代其產品。產品團隊不再需要等待發布新的應用程式版本，而是可以在伺服器上對 UI 進行更改，並立即在應用程式中看到這些變化。這導致了更加敏捷和響應性的產品開發過程。
伺服器驅動的 UI 的好處
採用伺服器驅動的 UI 帶來了許多優勢，可以顯著提升開發過程和終端使用者體驗。
即時修復錯誤和更快的迭代：正如 Instagram 的案例所示，其中最重要的優勢之一是能夠立即修復錯誤並進行更快的迭代。可以在伺服器端對 UI 進行更改，並立即在客戶端反映出來，無需使用者更新應用程式或開發人員經歷冗長的應用商店稽核流程。
後端開發人員參與前端開發：伺服器驅動的 UI也 模糊了前端和後端開發之間的界限。後端開發人員可以在伺服器上定義 UI 結構和行為，從而更直接地參與前端開發過程。這可以更有效地利用資源，形成更具凝聚力的開發團隊。
動態和個性化的使用者體驗：透過伺服器驅動的 UI，使用者體驗可以根據各種因素進行動態定製。例如，伺服器可以基於使用者的行為、偏好甚至 A/B 測試結果傳送不同的 UI。這可以帶來更加個性化和令人著迷的使用者體驗。
減少客戶端複雜性：透過將大部分 UI 邏輯移到伺服器端，伺服器驅動的 UI 可以減少客戶端的複雜性。這可以使客戶端更輕、更快，從而提高效能和使用者體驗的流暢性。
構建伺服器驅動的 UI：實用指南
一開始，構建伺服器驅動的 UI 可能會令人望而生畏，但透過對過程的清晰理解和一些實踐步驟，會逐步解決對這些問題。以下是構建伺服器驅動的 UI 的步驟：
建立樹狀結構：構建伺服器驅動的UI的第一步是建立一個類似樹狀的結構，代表您的 UI。樹中的每個節點對應一個 UI 元件，幷包含有關渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。
處理操作：在伺服器驅動的 UI 中，需要處理操作，例如使用者互動。可以透過在元件中包含操作處理程式來完成，這些處理程式向伺服器傳送請求。然後，伺服器可以根據操作響應一個新的 UI 樹。
使用 JSON 格式：通常使用 JSON 格式表示 UI 樹，可以透過 API 輕鬆傳送並由客戶端解析。
實現渲染引擎：在客戶端，您需要一個渲染引擎，它可以遍歷UI樹並按照樹所指定的方式渲染元件。
測試和迭代：與任何開發過程一樣，測試和迭代至關重要。務必對您的伺服器驅動的UI進行全面測試，並根據您的發現進行改進。
伺服器驅動 UI 的角色
Instagram 採用伺服器驅動 UI 的方法提供了一個引人注目的案例研究，展示了這種創新方法在實踐中的應用。這家社交媒體巨頭開發了一項名為 “blocks” 的技術，利用伺服器驅動UI的概念向用戶提供動態內容和更新。
Builder.io 執行長 Steve Sewell 與 Instagram/Meta 工程師 Yaser Alkayale 就透過 API 傳送 UI 進行了討論：
在 Instagram 的實現中，伺服器向客戶端傳送一個類似樹形結構的 blocks。每個 block 代表 UI 的一部分，幷包含有關要渲染哪個元件以及將哪些屬性傳遞給該元件的資訊。然後客戶端遍歷這個樹結構，按照 blocks 指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的 UI 元件中發現錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即為所有使用者修復該錯誤。
此外，伺服器驅動 UI 使 Instagram 能夠更快地迭代其產品。產品團隊無需等待發布新版本的應用程式，而是可以在伺服器上對 UI 進行更改，立即在應用程式中看到這些變化。這導致了更加敏捷和具有響應性的產品開發過程。
應對伺服器驅動 UI 的挑戰
儘管伺服器驅動 UI 為 UI 開發帶來了新的可能性，但也引入了開發人員需要意識到的新考慮因素：
應用商店準則：應用商店有一些需要遵循的準則。確保您使用的伺服器驅動 UI 符合這些準則非常重要。在提交應用程式進行稽核時，透明地說明您的 UI 方法可以幫助避免潛在問題。
離線使用者體驗：由於伺服器驅動 UI 依賴於伺服器通訊，保障離線情況下的使用者體驗可能會有挑戰。實施快取等策略可以確保即使沒有網路連線，也能維持一致的使用者體驗。
效能考慮：雖然伺服器驅動 UI 提供了動態功能，但還需要考慮效能問題。高效的網路請求和最佳化的渲染技術可以幫助保持流暢的使用者體驗。
增加的複雜性：實施伺服器驅動 UI 可能會給開發過程增加一層複雜性，因為 UI 管理發生在伺服器端和客戶端。然而，透過良好結構化的方法和明確的責任分工，可以有效管理這種複雜性。
儘管這些考慮因素存在其自身的挑戰，但它們也為問題解決和創新提供了機會。透過深思熟慮的規劃和執行，伺服器驅動 UI 可以成為您開發工具包中寶貴的補充。
結論
透過 API 傳送UI或伺服器驅動 UI 代表了 UI 開發領域的重大轉變。透過將大部分 UI 邏輯移到伺服器上，這種方法提供了一種動態性和靈活性，正在重新塑造行業。
從即時錯誤修復和更快的迭代到使後端開發人員能夠參與前端開發，伺服器驅動 UI 帶來了許多優勢。它們還可以實現更個性化和令人著迷的使用者體驗，並減少客戶端的複雜性以提高效能。
儘管存在應用商店準則和管理離線體驗等挑戰，但透過仔細規劃和戰略性方法，可以有效解決這些問題。
在提高前輩的 JavaScript 開發世界中，伺服器驅動 UI 不僅是一個理論概念，而且是 Instagram 等主要平臺正在採用的實際方法。隨著我們不斷突破 UI 開發的可能性，伺服器驅動 UI 為未來提供了令人興奮的方向。
作者:ikoofe
本文翻譯自 Sending UI over APIs，主要介紹了透過 API 來渲染 UI 頁面的方案，這種方案常用於客戶端的動態渲染以及一些運營活動頁面的渲染。這篇文章主要從伺服器拿到 UI 的結構
透過 API 傳送 UI 是一種改變我們對 UI 思考方式的技術，該技術也被稱之為伺服器驅動的 UI。與傳統的 UI 開發正規化相比，這種開發方式更加靈活，也正在影響和改變著傳統的 UI 開發方式。
伺服器驅動的 UI 不僅僅是一個理論概念；一些科技行業的公司已經開始實施這種方法。例如 Instagram、Lyft 和 Airbnb 利用伺服器驅動的 UI 向全球數百萬使用者提供動態內容和更新。
那麼，什麼是伺服器驅動的 UI？它們是如何工作的，為什麼它們在現代 JavaScript 開發中變得如斯重要？本文旨在回答這些問題，並深入介紹伺服器驅動的 UI，它們的優劣勢，以及如何在自己的專案中實現它們。
瞭解伺服器驅動的 UI
伺服器驅動的 UI 代表了一種新的 UI 開發方法。它們透過 API 在伺服器端動態生成 UI，並將其傳送到客戶端。這種方法可以提供更快的迭代速度和更個性化的使用者體驗。
儘管需要面臨著一些挑戰，例如應用商店指南和離線使用者體驗，但伺服器驅動的 UI 為 UI 開發的未來提供了另外的方向。
相比之下，伺服器驅動的 UI 是在伺服器上動態生成並透過 API 傳送到客戶端的。伺服器傳送 UI 用 JSON 來表示，然後在客戶端進行渲染。這意味著可以在伺服器端更新 UI，而無需對客戶端進行任何更改。
UI 變得動態且靈活，可以根據使用者行為、A/B 測試結果或新功能釋出等各種因素實時更改。例如，Builder.io 在其框架 SDK 中使用這種方法，透過提供可接受 JSON 輸入並渲染基於視覺構建的設計的元件：
javascriptimport { BuilderComponent } from "@builder.io/react";export default async function MyPage({ params }) { const builderJSON = await builder // 使用URL中指定的頁面路徑獲取 Builder 中的頁面內容 JSON .get("page", { userAttributes: { urlPath: "/" + (params?.page?.join("/") || ""), }, }) return ( > );}
這種方法相比傳統的 UI 開發具有幾個優點。首先，它允許更快的迭代，因為可以在伺服器端進行更改，並立即在客戶端上反映出來。它還使後端開發人員能夠參與前端開發，因為他們可以在伺服器上定義 UI 結構和行為。
然而，伺服器驅動的 UI 也面臨一些挑戰。它們需要以不同的方式思考 UI 開發，並需要考慮如何處理操作並保持流暢的使用者體驗。但是透過仔細的規劃和實施，這些挑戰是可以克服的。
伺服器驅動的 UI 在 Instagram 中的作用
Instagram 對伺服器驅動的 UI 的採用為這種創新方法提供了一個引人注目的案例研究。這家社交媒體巨頭開發了一種名為 “blocks” 的技術，利用伺服器驅動的 UI 的概念向用戶提供動態內容和更新。
Steve Sewell（Builder.io的執行長）和 Yaser Alkayale（Instagram/Meta的工程師）就透過 API 傳送 UI 進行了一次對話。
在 Instagram 的實現中，伺服器向客戶端傳送一個樹狀結構的 blocks。每個 block 表示 UI 的一部分，幷包含有關應該渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。然後客戶端遍歷此樹形結構，按照 blocks 所指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的UI元件中發現一個錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即修復所有使用者的錯誤。
此外，伺服器驅動的 UI 使 Instagram 能夠更快地迭代其產品。產品團隊不再需要等待發布新的應用程式版本，而是可以在伺服器上對 UI 進行更改，並立即在應用程式中看到這些變化。這導致了更加敏捷和響應性的產品開發過程。
伺服器驅動的 UI 的好處
採用伺服器驅動的 UI 帶來了許多優勢，可以顯著提升開發過程和終端使用者體驗。
即時修復錯誤和更快的迭代：正如 Instagram 的案例所示，其中最重要的優勢之一是能夠立即修復錯誤並進行更快的迭代。可以在伺服器端對 UI 進行更改，並立即在客戶端反映出來，無需使用者更新應用程式或開發人員經歷冗長的應用商店稽核流程。
後端開發人員參與前端開發：伺服器驅動的 UI也 模糊了前端和後端開發之間的界限。後端開發人員可以在伺服器上定義 UI 結構和行為，從而更直接地參與前端開發過程。這可以更有效地利用資源，形成更具凝聚力的開發團隊。
動態和個性化的使用者體驗：透過伺服器驅動的 UI，使用者體驗可以根據各種因素進行動態定製。例如，伺服器可以基於使用者的行為、偏好甚至 A/B 測試結果傳送不同的 UI。這可以帶來更加個性化和令人著迷的使用者體驗。
減少客戶端複雜性：透過將大部分 UI 邏輯移到伺服器端，伺服器驅動的 UI 可以減少客戶端的複雜性。這可以使客戶端更輕、更快，從而提高效能和使用者體驗的流暢性。
構建伺服器驅動的 UI：實用指南
一開始，構建伺服器驅動的 UI 可能會令人望而生畏，但透過對過程的清晰理解和一些實踐步驟，會逐步解決對這些問題。以下是構建伺服器驅動的 UI 的步驟：
建立樹狀結構：構建伺服器驅動的UI的第一步是建立一個類似樹狀的結構，代表您的 UI。樹中的每個節點對應一個 UI 元件，幷包含有關渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。
處理操作：在伺服器驅動的 UI 中，需要處理操作，例如使用者互動。可以透過在元件中包含操作處理程式來完成，這些處理程式向伺服器傳送請求。然後，伺服器可以根據操作響應一個新的 UI 樹。
使用 JSON 格式：通常使用 JSON 格式表示 UI 樹，可以透過 API 輕鬆傳送並由客戶端解析。
實現渲染引擎：在客戶端，您需要一個渲染引擎，它可以遍歷UI樹並按照樹所指定的方式渲染元件。
測試和迭代：與任何開發過程一樣，測試和迭代至關重要。務必對您的伺服器驅動的UI進行全面測試，並根據您的發現進行改進。
伺服器驅動 UI 的角色
Instagram 採用伺服器驅動 UI 的方法提供了一個引人注目的案例研究，展示了這種創新方法在實踐中的應用。這家社交媒體巨頭開發了一項名為 “blocks” 的技術，利用伺服器驅動UI的概念向用戶提供動態內容和更新。
Builder.io 執行長 Steve Sewell 與 Instagram/Meta 工程師 Yaser Alkayale 就透過 API 傳送 UI 進行了討論：
在 Instagram 的實現中，伺服器向客戶端傳送一個類似樹形結構的 blocks。每個 block 代表 UI 的一部分，幷包含有關要渲染哪個元件以及將哪些屬性傳遞給該元件的資訊。然後客戶端遍歷這個樹結構，按照 blocks 指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的 UI 元件中發現錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即為所有使用者修復該錯誤。
此外，伺服器驅動 UI 使 Instagram 能夠更快地迭代其產品。產品團隊無需等待發布新版本的應用程式，而是可以在伺服器上對 UI 進行更改，立即在應用程式中看到這些變化。這導致了更加敏捷和具有響應性的產品開發過程。
應對伺服器驅動 UI 的挑戰
儘管伺服器驅動 UI 為 UI 開發帶來了新的可能性，但也引入了開發人員需要意識到的新考慮因素：
應用商店準則：應用商店有一些需要遵循的準則。確保您使用的伺服器驅動 UI 符合這些準則非常重要。在提交應用程式進行稽核時，透明地說明您的 UI 方法可以幫助避免潛在問題。
離線使用者體驗：由於伺服器驅動 UI 依賴於伺服器通訊，保障離線情況下的使用者體驗可能會有挑戰。實施快取等策略可以確保即使沒有網路連線，也能維持一致的使用者體驗。
效能考慮：雖然伺服器驅動 UI 提供了動態功能，但還需要考慮效能問題。高效的網路請求和最佳化的渲染技術可以幫助保持流暢的使用者體驗。
增加的複雜性：實施伺服器驅動 UI 可能會給開發過程增加一層複雜性，因為 UI 管理發生在伺服器端和客戶端。然而，透過良好結構化的方法和明確的責任分工，可以有效管理這種複雜性。
儘管這些考慮因素存在其自身的挑戰，但它們也為問題解決和創新提供了機會。透過深思熟慮的規劃和執行，伺服器驅動 UI 可以成為您開發工具包中寶貴的補充。
結論
透過 API 傳送UI或伺服器驅動 UI 代表了 UI 開發領域的重大轉變。透過將大部分 UI 邏輯移到伺服器上，這種方法提供了一種動態性和靈活性，正在重新塑造行業。
從即時錯誤修復和更快的迭代到使後端開發人員能夠參與前端開發，伺服器驅動 UI 帶來了許多優勢。它們還可以實現更個性化和令人著迷的使用者體驗，並減少客戶端的複雜性以提高效能。
儘管存在應用商店準則和管理離線體驗等挑戰，但透過仔細規劃和戰略性方法，可以有效解決這些問題。
在提高前輩的 JavaScript 開發世界中，伺服器驅動 UI 不僅是一個理論概念，而且是 Instagram 等主要平臺正在採用的實際方法。隨著我們不斷突破 UI 開發的可能性，伺服器驅動 UI 為未來提供了令人興奮的方向。
作者:ikoofe
本文翻譯自 Sending UI over APIs，主要介紹了透過 API 來渲染 UI 頁面的方案，這種方案常用於客戶端的動態渲染以及一些運營活動頁面的渲染。這篇文章主要從伺服器拿到 UI 的結構
透過 API 傳送 UI 是一種改變我們對 UI 思考方式的技術，該技術也被稱之為伺服器驅動的 UI。與傳統的 UI 開發正規化相比，這種開發方式更加靈活，也正在影響和改變著傳統的 UI 開發方式。
伺服器驅動的 UI 不僅僅是一個理論概念；一些科技行業的公司已經開始實施這種方法。例如 Instagram、Lyft 和 Airbnb 利用伺服器驅動的 UI 向全球數百萬使用者提供動態內容和更新。
那麼，什麼是伺服器驅動的 UI？它們是如何工作的，為什麼它們在現代 JavaScript 開發中變得如斯重要？本文旨在回答這些問題，並深入介紹伺服器驅動的 UI，它們的優劣勢，以及如何在自己的專案中實現它們。
瞭解伺服器驅動的 UI
伺服器驅動的 UI 代表了一種新的 UI 開發方法。它們透過 API 在伺服器端動態生成 UI，並將其傳送到客戶端。這種方法可以提供更快的迭代速度和更個性化的使用者體驗。
儘管需要面臨著一些挑戰，例如應用商店指南和離線使用者體驗，但伺服器驅動的 UI 為 UI 開發的未來提供了另外的方向。
相比之下，伺服器驅動的 UI 是在伺服器上動態生成並透過 API 傳送到客戶端的。伺服器傳送 UI 用 JSON 來表示，然後在客戶端進行渲染。這意味著可以在伺服器端更新 UI，而無需對客戶端進行任何更改。
UI 變得動態且靈活，可以根據使用者行為、A/B 測試結果或新功能釋出等各種因素實時更改。例如，Builder.io 在其框架 SDK 中使用這種方法，透過提供可接受 JSON 輸入並渲染基於視覺構建的設計的元件：
javascriptimport { BuilderComponent } from "@builder.io/react";export default async function MyPage({ params }) { const builderJSON = await builder // 使用URL中指定的頁面路徑獲取 Builder 中的頁面內容 JSON .get("page", { userAttributes: { urlPath: "/" + (params?.page?.join("/") || ""), }, }) return ( > );}
這種方法相比傳統的 UI 開發具有幾個優點。首先，它允許更快的迭代，因為可以在伺服器端進行更改，並立即在客戶端上反映出來。它還使後端開發人員能夠參與前端開發，因為他們可以在伺服器上定義 UI 結構和行為。
然而，伺服器驅動的 UI 也面臨一些挑戰。它們需要以不同的方式思考 UI 開發，並需要考慮如何處理操作並保持流暢的使用者體驗。但是透過仔細的規劃和實施，這些挑戰是可以克服的。
伺服器驅動的 UI 在 Instagram 中的作用
Instagram 對伺服器驅動的 UI 的採用為這種創新方法提供了一個引人注目的案例研究。這家社交媒體巨頭開發了一種名為 “blocks” 的技術，利用伺服器驅動的 UI 的概念向用戶提供動態內容和更新。
Steve Sewell（Builder.io的執行長）和 Yaser Alkayale（Instagram/Meta的工程師）就透過 API 傳送 UI 進行了一次對話。
在 Instagram 的實現中，伺服器向客戶端傳送一個樹狀結構的 blocks。每個 block 表示 UI 的一部分，幷包含有關應該渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。然後客戶端遍歷此樹形結構，按照 blocks 所指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的UI元件中發現一個錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即修復所有使用者的錯誤。
此外，伺服器驅動的 UI 使 Instagram 能夠更快地迭代其產品。產品團隊不再需要等待發布新的應用程式版本，而是可以在伺服器上對 UI 進行更改，並立即在應用程式中看到這些變化。這導致了更加敏捷和響應性的產品開發過程。
伺服器驅動的 UI 的好處
採用伺服器驅動的 UI 帶來了許多優勢，可以顯著提升開發過程和終端使用者體驗。
即時修復錯誤和更快的迭代：正如 Instagram 的案例所示，其中最重要的優勢之一是能夠立即修復錯誤並進行更快的迭代。可以在伺服器端對 UI 進行更改，並立即在客戶端反映出來，無需使用者更新應用程式或開發人員經歷冗長的應用商店稽核流程。
後端開發人員參與前端開發：伺服器驅動的 UI也 模糊了前端和後端開發之間的界限。後端開發人員可以在伺服器上定義 UI 結構和行為，從而更直接地參與前端開發過程。這可以更有效地利用資源，形成更具凝聚力的開發團隊。
動態和個性化的使用者體驗：透過伺服器驅動的 UI，使用者體驗可以根據各種因素進行動態定製。例如，伺服器可以基於使用者的行為、偏好甚至 A/B 測試結果傳送不同的 UI。這可以帶來更加個性化和令人著迷的使用者體驗。
減少客戶端複雜性：透過將大部分 UI 邏輯移到伺服器端，伺服器驅動的 UI 可以減少客戶端的複雜性。這可以使客戶端更輕、更快，從而提高效能和使用者體驗的流暢性。
構建伺服器驅動的 UI：實用指南
一開始，構建伺服器驅動的 UI 可能會令人望而生畏，但透過對過程的清晰理解和一些實踐步驟，會逐步解決對這些問題。以下是構建伺服器驅動的 UI 的步驟：
建立樹狀結構：構建伺服器驅動的UI的第一步是建立一個類似樹狀的結構，代表您的 UI。樹中的每個節點對應一個 UI 元件，幷包含有關渲染哪個元件以及將哪些 props 傳遞給該元件的資訊。
處理操作：在伺服器驅動的 UI 中，需要處理操作，例如使用者互動。可以透過在元件中包含操作處理程式來完成，這些處理程式向伺服器傳送請求。然後，伺服器可以根據操作響應一個新的 UI 樹。
使用 JSON 格式：通常使用 JSON 格式表示 UI 樹，可以透過 API 輕鬆傳送並由客戶端解析。
實現渲染引擎：在客戶端，您需要一個渲染引擎，它可以遍歷UI樹並按照樹所指定的方式渲染元件。
測試和迭代：與任何開發過程一樣，測試和迭代至關重要。務必對您的伺服器驅動的UI進行全面測試，並根據您的發現進行改進。
伺服器驅動 UI 的角色
Instagram 採用伺服器驅動 UI 的方法提供了一個引人注目的案例研究，展示了這種創新方法在實踐中的應用。這家社交媒體巨頭開發了一項名為 “blocks” 的技術，利用伺服器驅動UI的概念向用戶提供動態內容和更新。
Builder.io 執行長 Steve Sewell 與 Instagram/Meta 工程師 Yaser Alkayale 就透過 API 傳送 UI 進行了討論：
在 Instagram 的實現中，伺服器向客戶端傳送一個類似樹形結構的 blocks。每個 block 代表 UI 的一部分，幷包含有關要渲染哪個元件以及將哪些屬性傳遞給該元件的資訊。然後客戶端遍歷這個樹結構，按照 blocks 指定的方式渲染元件。
這種方法使 Instagram 能夠立即更新 UI，而無需推送新版本的應用程式。例如，如果在特定的 UI 元件中發現錯誤，伺服器可以簡單地停止傳送渲染該元件的 blocks，從而立即為所有使用者修復該錯誤。
此外，伺服器驅動 UI 使 Instagram 能夠更快地迭代其產品。產品團隊無需等待發布新版本的應用程式，而是可以在伺服器上對 UI 進行更改，立即在應用程式中看到這些變化。這導致了更加敏捷和具有響應性的產品開發過程。
應對伺服器驅動 UI 的挑戰
儘管伺服器驅動 UI 為 UI 開發帶來了新的可能性，但也引入了開發人員需要意識到的新考慮因素：
應用商店準則：應用商店有一些需要遵循的準則。確保您使用的伺服器驅動 UI 符合這些準則非常重要。在提交應用程式進行稽核時，透明地說明您的 UI 方法可以幫助避免潛在問題。
離線使用者體驗：由於伺服器驅動 UI 依賴於伺服器通訊，保障離線情況下的使用者體驗可能會有挑戰。實施快取等策略可以確保即使沒有網路連線，也能維持一致的使用者體驗。
效能考慮：雖然伺服器驅動 UI 提供了動態功能，但還需要考慮效能問題。高效的網路請求和最佳化的渲染技術可以幫助保持流暢的使用者體驗。
增加的複雜性：實施伺服器驅動 UI 可能會給開發過程增加一層複雜性，因為 UI 管理發生在伺服器端和客戶端。然而，透過良好結構化的方法和明確的責任分工，可以有效管理這種複雜性。
儘管這些考慮因素存在其自身的挑戰，但它們也為問題解決和創新提供了機會。透過深思熟慮的規劃和執行，伺服器驅動 UI 可以成為您開發工具包中寶貴的補充。
結論
透過 API 傳送UI或伺服器驅動 UI 代表了 UI 開發領域的重大轉變。透過將大部分 UI 邏輯移到伺服器上，這種方法提供了一種動態性和靈活性，正在重新塑造行業。
從即時錯誤修復和更快的迭代到使後端開發人員能夠參與前端開發，伺服器驅動 UI 帶來了許多優勢。它們還可以實現更個性化和令人著迷的使用者體驗，並減少客戶端的複雜性以提高效能。
儘管存在應用商店準則和管理離線體驗等挑戰，但透過仔細規劃和戰略性方法，可以有效解決這些問題。
在提高前輩的 JavaScript 開發世界中，伺服器驅動 UI 不僅是一個理論概念，而且是 Instagram 等主要平臺正在採用的實際方法。隨著我們不斷突破 UI 開發的可能性，伺服器驅動 UI 為未來提供了令人興奮的方向。
作者:ikoofe
