一年一度的 .NET Conf 大会上，Blazor 是排在第一个出场的，可见 Blazor 在新版 .Net 中的地位依然是重中之重。
上图是开场 keynote 的演示，全新改版的官方示例项目 EShop，它也是贯穿了从开场到云原生工具 .NET Aspire 介绍时都用到的示例应用。
这个应用已经引入了 .NET 8 的众多新特性，特别是前端部分引入了 Blazor full stack 眼花缭乱的新特性。
出场的依然是两位 Blazor 负责人，Blazor 项目的产品经理丹尼尔和 Blazor 之父史蒂夫。
标题虽然跟前几年一样，《使用 Blazor 构建交互性丰富的 WebUI》，但是内容已经与以往的完全不同。
这一次带来了更快的 Blazor。还一语双关，更快地构建、构建更快的 Web apps。
这个 PPT 是个动画，意思是把 server 和 client 合并在一起了，变成全栈 WebUI。并且把 Blazor 的各大功能重新排位，重点已经不在 server 和 wasm，而是从静态的服务器端渲染、增强导航与路由、流式渲染、单组件/页面的交互性、最后再到运行时自动切换交互性渲染模式。
这些特性下文一一介绍。
01
我从网上看到了 Steve 在另外一个演讲中的 PPT，更能反映出 Blazor 要做静态服务端渲染的初衷。
图中介绍的是整个 Web 发展史：
90年代-2005：是服务端渲染 HTML 的阶段。.Net 这边是 asp 和 webforms。感谢 Webforms 在这个时代就带来了完美的开发与交互体验。
2005-2010 是服务端 HTML+与 js 结合的阶段，主要是利用 jQuery 实现方便的 dom 操作。.Net 这边还是 ASP.NET aspx 时代。
2010-2015 是早期客户端渲染，angularjs、knockout 等。.NET 这边是 MVC 时代。
2015-2022 是现代客户端渲染阶段，也是单页应用。我们熟悉的 react、vue、angular 属于这个阶段。而 Blazor 在2019年发布总算是赶上了末班车。
到了今年，各大前端框架都在做服务端组件，包括最新的 react 和 angular，都不同程度借鉴了 blazor server 的特性。
02
交互性在此前很少提到，只有在 Blazor 的口号——“使用 C# 而不是 JS 来构建交互性 WebUI”中有提到，因为此前 Blazor 默认就是富交互性的。而 .NET8 引入服务端渲染和更多交互性层次之后，就需要大家去理解了。前面讲的“静态”渲染，是“交互性”程度最低的。
从 .NET 8 开始，Blazor 从以前的全局交互性变为页面级和组件级交互性。意思就是全局默认是静态的，可以在局部选择交互性渲染方式。目前可选的交互性渲染方式有 Streaming SSR、Blazor Server、Blazor WebAssembly。
Streaming SSR 是可以让在一次服务端请求中，让服务端连续返回 html。先返回静态的内容，再返回需要查询数据库或其他较慢处理的内容。示例中 Steve 示范了一个倒计时。在一个下单请求中首先返回 Blazor 页面静态渲染的 html，然后返回不同的数字的 html 节点，浏览器上的 blazor.web.js 自动替换掉静态页面中的占位符。
Streaming SSR 的优势是能够加速首次渲染。不必等待所有数据都获取之后才返回所有内容。我之前用 MVC 做过 CMS 项目，一个页面很多内容都需要查询，响应时间很久。如果用 Streaming SSR，就能马上呈现静态的页面布局了。
增强导航能够让页面间的跳转变得像单页面一样。这个特性其实就是之前的 pajx。无刷新跳转。只替换有变动的 dom 节点。但是 Blazor 的这个是服务端支持的，在页面跳转时，在服务端就计算变化的节点，然后只返回有变化的节点。这样能够节省请求流量、保持大多数的 dom。注意事项是需要考虑 JS 的状态。
静态渲染表单。这是静态渲染重要的服务端交互方式。此前是通过事件来实现模型绑定，而 SSR 则是通过 HTTP 请求来做模型绑定。表单验证也变为服务端的，返回的验证信息就是通过上文的 Streaming SSR 实现。这个特性时静态渲染在一定程度上实现了交互性。
交互性组件就是原有的 Blazor Server/Blazor WebAssembly 组件。能够灵活地集成到静态渲染页面中，并且能够与增强导航和表单一起工作。
交互性组件最重要的更新，就是实现了自动模式。自动模式可以让组件/页面先使用 Server 实现交互性，同时后台加载 WebAssembly 文件，加载完后，自动切换到 WebAssembly。
总结如上图。
最后还有 One more thing，全新的 All in one 模板。把之前的两个 Blazor 模板和这次的全部功能集成到一个模板中，通过配置选项来根据需求选择需要的渲染模式、示例内容等等。
特别是授权类型这个选项，选择个人授权后，模板中就包含是整个 Identity UI，从注册登录到用户管理都在里面了。而且是使用 SSR 实现类的，对学习 SSR 的朋友非常有帮助。
另外最新版的 VS 还支持了 Blazor 页面脚手架，终于可以跟 MVC/Razor Pages 一样通过 VS 点点鼠标就创建一个 CRUD 页面了！
列表页面用了 QuickGrid。有我的代码贡献！这下我再也不用担心大家不会写 Blazor了！
最后的最后，丹尼尔做了个总结，如果想让已有应用能够使用 .NET 8 中 Blazor 带来的新特性，可以根据这个指引来实施。
1. 如果是已有的 Blazor 应用，那么只需要升级到 .NET 8 即可。
2. 如果是 ASP.NET Core app，可以添加 Blazor 页面。
3. 对于已有的 MVC/Razor Pages 项目，也可以通过 <component> tag helper 来引入 Blazor 组件。
4. 对于 Minimal APIs/Controllers 项目，还可以返回 RazorComponentResult 来返回 Blazor 页面。
5. 如果 api 还配合了JS 前端框架，那么也可以通过 custom element 来引入 Blazor 组件和页面。
这个指引是递进的，适应在不同场景中集成 Blazor。
总得来说，SSR 能够解决前台用户侧的场景，Auto 模式能够解决加载慢和网络问题。作为 Blazor 的老用户，我认为 Auto 模式是很强的功能，基本上解决了 Blazor 一直以来被诟病的加载问题和网络问题。但是要注意的是数据请求方式和组件状态的切换。请求方式需要从 server 的直接访问数据库切换为 API 调用，这就需要用户实现两套方法。Blazor 只自动处理一部分状态的切换，更多的需要用户自己处理。
这两点我已经这最近两个月有所探究，总结了一些可以方面实现的方法和结合两者的布局模板。打算在下个月16号 .NET Conf China 大会给大家分享并带来更多内容。
诚邀赞助
AntDesign Blazor 项目和 Blazor 中文社区预计将会在 12月16日到北京参加 .NET Conf China 大会。届时会对 Blazor 和 AntBlazor 项目进行社区推广。
但不论是我们的开源项目、社区还是这次活动，都是为爱发电和非盈利的，如果 antblazor 与社区对你有所帮助，请赞助支持，以支持我到北京的路费和推广物料费用。
所有费用收支都会在 antblazor 项目的赞助名单中公开。对于大额捐助，可以在我们的项目网站和今后推广中提供品牌推广。
请点下方赞赏按钮，也可以加我微信 JamesYeungMVP 联系。
杨舜杰
Microsoft MVP
.NET基金会项目 AntDesign Blazor 创建者、Blazor 中文社区组织者。热爱开源，专注于开发技术与研发效能。
微软最有价值专家（MVP）是微软公司授予第三方技术专业人士的一个全球奖项。30年来，世界各地的技术社区领导者，因其在线上和线下的技术社区中分享专业知识和经验而获得此奖项。MVP 是经过严格挑选的专家团队，他们代表着技术最精湛且最具智慧的人，是对社区投入极大的热情并乐于助人的专家。MVP 致力于通过演讲、论坛问答、创建网站、撰写博客、分享视频、开源项目、组织会议等方式来帮助他人，并最大程度地帮助微软技术社区用户使用 Microsoft 技术。
更多详情请点击阅读原文登录官方网站：
https://mvp.microsoft.com/zh-cn
