Blazor Server 与 Blazor WebAssembly 选型记录

最近在学 Blazor，最开始搞不清楚 Server 模式和 WebAssembly 模式到底该怎么选。官方文档写得比较分散，自己又把两个模板都跑了一遍，对比了实际使用感受，才慢慢理清楚。这篇笔记把两种模式的原理和自己的选型思路整理一下。

一、两种模式的原理区别

简单说，区别在于代码在哪里运行：

• Blazor Server：代码跑在服务器上，浏览器和服务器之间通过 SignalR 实时通信。浏览器只是个"视图"，点击、输入都通过 WebSocket 发到服务器处理，服务器算完再把 DOM 差异推回来。
• Blazor WebAssembly（WASM）：代码下载到浏览器里，通过 WebAssembly 在客户端运行，直接操作 DOM，不需要一直连着服务器。首次加载完之后，离线也能用。

二、对比表

维度	Blazor Server	Blazor WebAssembly
代码运行位置	服务器	浏览器（WASM）
首次加载	快，只下载页面	慢，要下载 dll
网络依赖	必须联网	加载后可离线
服务器压力	所有用户占一条连接	客户端分担
调试	直接调试服务端代码	客户端调试相对麻烦
部署	需要 ASP.NET Core 服务器	可放静态站点 / CDN

三、最小项目结构

用 .NET CLI 新建一个 Server 项目：

dotnet new blazor -o MyServerApp --interactive Server

新建一个 WASM 项目：

dotnet new blazor -o MyWasmApp --interactive WebAssembly

四、自己的选型结论

• 内部系统、后台管理、需要频繁调数据库 → 选 Server，不用考虑首次加载慢的问题，调试也方便。
• 面向公网、对首屏速度敏感、想把前端放 CDN → 选 WASM，但要接受首次加载较大。
• 不确定的话，从 Server 开始，因为它对新手更友好，调试体验最好。

五、学习中踩的小坑

刚学 Blazor 时，在组件里写 JS 调用总是报错，后来发现 Server 模式下 JSInterop 的调用是经过 SignalR 序列化的，不能直接传复杂的 .NET 对象引用，只能传可序列化的数据。这个点文档里提得比较少，自己试了几次才搞明白。另外，Server 模式如果服务器网络抖动，页面会重连，做内部系统没问题，做面向公网的交互密集型应用就要权衡。