Blazor帶我重玩前端(二)

• 2020 年 7 月 6 日
• 筆記
• .NET Core, Blazor, H::技術潮流之不拘一格

概覽

Blazor目前有兩種託管模式，一種是Server-Side模式，一種是WebAssembly模式。官方首先支援的是Service-Side模式，使用WebAssembly模式，需要更新到最新版VS2019。 小編目前的精力是更多的專註於Blazor-WebAssembly模式的研究，所以本系列文章只會對Server-Side模式做簡要說明。

WebAssembly

WebAssembly模式（也可叫做Client-Side模式），WebAssembly前文已經說了很多了，本文不再做額外討論。我們主要來看一下ASP.NET Core Blazor是如何實現WebAssembly模式的。Blazor啟動後，會將依賴項、.NET運行時以及應用組件下載瀏覽器，應用將在瀏覽器上直接運行。其交互如圖所示：

同時其UI更新和事件處理也在統一進程中進行，如下圖所示：

WebAssembly優點

• Web 程式集在客戶端、瀏覽器內運行，因此可以作為靜態文件進行部署。
• 相對於Server-Side模式，當與伺服器連接斷掉時，依然可以連接，但是涉及到資料庫查詢等後台功能時，肯定是無法正常工作的。
• 可以減少伺服器負載壓力。

WebAssembly缺點

• 首次載入時間會比較長，因為它需要下載應用的依賴項、運行時以及 WAT 文件。
  
• Blazor WebAssembly 僅適用於較新的瀏覽器，並且對搜索引擎並不友好。
  

Server-Side

Server-Side模式於2019年9月發布，其目的是使得ASP.NET Core 應用中在伺服器上執行應用。 其交互如圖所示：

UI 更新、事件處理和 JavaScript 調用是通過 SignalR 連接進行處:

Server-Side優點

• Blazor 伺服器端已經先於客戶端呈現了HTML內容。相對於WebAssembly模式要下載很多的文件，Server-Side的啟動速度更快，也對搜索引擎更加友好。
• 由於瀏覽器端只需要專註於HTML相關內容的展示，這意味Server-Side幾乎不會遇到什麼兼容性。

Server-Side缺點

• 由於其每個交互HTML由伺服器端預呈現，這意味Server-Side無法使用靜態化方案。同時其往返流程所涉及到的時間消耗，這也只能使得Server-Side模式可能會有更高的延遲。
• 需要始終與伺服器建立活動連接，一旦伺服器關閉，應用也將立即停止工作。
• 伺服器壓力會較大。