原文作者: Christian Findlay
原文鏈接： https://christianfindlay.com/2020/07/09/blazor-vs-traditional-web-apps/
Blazor是Microsoft團隊開發的單頁面應用程序（SPA）框架，它是與React，Angular和Vue.js有相同之處，但是它使用的是C＃而不是JavaScript。它將C＃帶入SPA領域，並向傳統的Web應用程序框架（如ASP .NET Web窗體和ASP .NET Core MVC）挑戰，來構建Web應用程序。本文討論了SPA和傳統Web應用程序之間的選擇，並說明了服務器端渲染和客戶端渲染之間的區別。
傳統Web應用程序
傳統的Web應用程序是很少或沒有客戶端處理的應用程序。HTML在服務器端渲染並傳遞到瀏覽器。它們主要圍繞靜態文本和填寫表單，並且大多數交互都需要刷新整頁。瀏覽器通過HTML表單將數據發送到服務器，然后服務器再進行處理。像 ASP 和 PHP 這樣的技術，在客戶端和服務器之間的進行數據傳輸並處理。這種方式允許 html代碼 和后端代碼寫在一起， 這樣的優勢是可以快速進行頁面開發，傳統的Web應用程序工作流通常向用戶提供一個表單，一個提交按鈕，並且在用戶單擊按鈕后會從服務器收到響應，這樣的用戶體驗通常不好。
ASP Web Forms是傳統Web應用程序技術的示例，但是它不支持設計現代Web API。Microsoft引入了.NET Core，它支持從現代Web API到傳統Web應用程序的所有內容，.NET Core的MVC風格是用於構建傳統Web應用程序的框架。
SPA 單頁面應用程序
SPA單頁應用程序是基於Web的應用程序，其中基於通過API調用與服務器之間進行數據傳輸來動態修改UI。SPA在客戶端呈現 HTML DOM。服務器通常在會話開始時傳輸所有HTML，JavaScript和CSS或WebAssembly代碼，並且不將其作為后續API調用的一部分進行傳輸。瀏覽器修改HTML DOM，而不是從服務器請求獲取完整的HTML內容。
Ajax是邁向SPA框架的第一步，這種方法在2000年代初開始流行。它使用JavaScript調用服務器端API，允許異步處理並局部刷新頁面。與傳統的Web應用程序相比，改善了用戶交互體驗，瀏覽器可以在屏幕上執行數據的部分更新，並且每次調用都沒有HTML傳輸，許多傳統的Web應用程序開始部分集成Ajax，開發人員在后端定義API接口，然后前端js負責api接口調用和處理。
Webpack等JavaScript模塊化的打包程序開始出現，它簡化了構建純JavaScript應用程序的過程，很方便對程序打包成原生的應用， 與Vue.js，Angular和React等框架結合使用時，SPA更方便構建和部署，並且前端和后端人員定義API后可以並行開發，提升效率。
什么是Blazor?
Blazor是一個SPA框架，它使用編譯的C＃來操縱HTML DOM來替代JavaScript，Blazor允許使用服務器端或客戶端托管模型，但是無論哪種情況，瀏覽器都可以操作HTML DOM客戶端，該應用程序仍然是SPA應用程序。
對於C＃程序員而言，非Blazor的SPA框架可能會有陡峭的學習曲線。Typescript與C＃有一些相似之處，但是編程范例卻大不相同。Blazor允許C＃開發人員使用Visual Studio進行構建和調試，而TypeScript主要將開發人員與VS Code聯系在一起。Visual Studio工具集通常是C＃開發人員更熟悉的。
C＃程序員幾乎無需學習就可以開始開發Blazor Web應用程序，如果C＃程序員已經使用ASP MVC，你會更得心應手，Blazor語法與ASP MVC語法非常相似，如果您的團隊擁有MVC的代碼庫，則向Blazor的過渡將會更加容易。
Blazor托管模型
區分Blazor托管模型和頁面渲染很重要,在客戶端模型中，Blazor在瀏覽器內部的WebAssembly（WASM）上運行，在服務器端模型中，Blazor在服務器上運行，並通過Signal-R將HTML傳輸到客戶端。兩種模型都可提供與React，Vue.js或Angular等SPA框架同樣的用戶體驗，但是有一些差異，服務器端模式不需要瀏覽器中的WASM支持，這意味着某些較舊的瀏覽器可以使用服務器端托管模型。
服務器模式的優點
- 初始頁面下載可以小很多
- 可以利用已安裝的服務器端組件進行處理
- Visual Studio完全支持使用服務器端模型進行調試
服務器模式的缺點
- 沒有離線功能，斷開互聯網連接后，處理將停止。
- 延遲增加
客戶端模式的優點
- 客戶端UI處理，可以減少對服務器的壓力
- 當用戶比較多時，服務器不用去管理很多的Socket連接
- 比Js 有更好的處理性能
客戶端模式的缺點
- WASM上的.NET目前還沒有發揮其全部性能潛力, 但是AOT編譯有望在不久的將來顯著提高性能。
- 互動僅限於瀏覽器的功能
- 初始化頁面比較慢，因為要下載 .NET 運行時。
- 調試客戶端Blazor應用程序會受到一些限制和問題。
總結
用戶通常期望現代的Web應用程序具有SPA的功能，傳統的Web應用程序可能適用於涉及傳統基礎架構或簡單頁面，但是，如果用戶在整個頁面重新加載時提供了不好的體驗，他們可能不太會喜歡使用這些程序，具有C＃經驗的開發團隊應在下一個Web應用程序中考慮Blazor,Blazor可能意味着不需要培訓人員使用JavaScript或TypeScript，並且提供了服務器和客戶端兩種模式，可以靈活使用。
最后
歡迎掃碼關注我們的公眾號 【全球技術精選】，專注國外優秀博客的翻譯和開源項目分享，也可以添加QQ群 897216102
