前言 💢
🎯 记得以前用 Asp.net 做 网页开发 是的时候那时候还是 Web Forms ，后来 MVC 出来后也是火的不得了。那个时候还没有所谓的前后端分离一说，像 Vue.js 、React 、Angular 的这些前端框架还没出生，那时候 Jquery 风靡一时,后端开发人员基本都会，那时候没有前端开发一说，顶多就是美工UI充当一下。
回顾过去🕐
这么多年过去了，我从纯 后端 开发 辗转 安卓、IOS、小程序、web前端、物联网各个领域，现在回过头来再看现如今的 ASP.NET Core Web 应用框架，优点感觉陌生了，我记忆中还停留在 MVC时代。后来接触开发的都是前后端分离的，基于 Vue2/3 全家桶的，现在又出来 Razor 和 Blazor 两个 ASP.NET Core 自带的 Web UI 框架，简单查阅了下，貌似官方在一直更新优化，现在也是有模有样很强大，索性花点时间了解下。
官方推荐✅
ASP.NET Core 是一个完整的 UI 框架。 你可以选择要结合哪些功能，以满足应用的 Web UI 需求。对于新的项目开发，我们推荐 ASP.NET Core Blazor 。
一、ASP.NET Core Blazor 🎀
Blazor 是一个全栈 Web UI 框架，建议用于大多数 Web UI 方案。
使用 Blazor 的好处：
- 可重用的组件模型。
- 高效的基于差异的组件呈现。
- 通过 WebAssembly 从服务器或客户端灵活地呈现组件。
- 使用 C# 生成丰富的交互式 Web UI 组件。
- 从服务器静态呈现组件。
- 逐步增强服务器呈现组件，以实现更流畅的导航和表单处理并启用流式呈现。
- 共享客户端和服务器上通用逻辑的代码。
- 与 JavaScript 互操作。
- 将组件与现有的 MVC、 Razor 页面或基于JavaScript 的应用集成。
有关 Blazor 及其体系结构和优势的完整概述，请参阅 ASP.NET CoreBlazor 和 ASP.NET Core Blazor 托管模型。 若要开始使用第一个 Blazor 应用，请参阅生成第一个 Blazor 应用。
二、ASP.NET Core Razor Pages 🎗️
Razor 页面是一个基于页面的模型，用于生成服务器呈现的 Web UI。 Razor 页面 UI 在服务器上动态呈现，以生成页面的 HTML 和 CSS 来响应浏览器请求。 页面在到达客户端时已准备好显示。 对 Razor Pages 的支持是建立在 ASP.NET Core MVC 基础之上的。
🔖 Razor 页面的优势：
- 快速构建和更新 UI。 页面的代码与页面一起保存，同时保持 UI 和业务逻辑关注点相互分离。
- 可进行测试并缩放到大型应用。
- 组织 ASP.NET Core 页面，使用起来比 ASP.NET MVC 更简单：
- 视图的具体逻辑和视图模型可以一起保存在它们自己的命名空间和目录中。
- 相关页面的组可以保存在各自的命名空间和目录中。
若要开始使用你的第一个 ASP.NET Core Razor Pages 应用，请参阅 Razor 。 有关 ASP.NET Core Razor Pages、其体系结构和优势的完整概述，请参阅 Razor 。
三、ASP.NET Core MVC 🧣
ASP.NET Core MVC 在服务器上呈现 UI，并使用模型-视图-控制器 ( MVC ) 结构模式。 MVC 模式将应用分成三组主要组件：模型、视图和控制器。 用户请求被路由到控制器。 控制器负责使用模型来执行用户操作或检索查询结果。 控制器选择要显示给用户的视图，并为其提供所需的任何模型数据。
🔖 ASP.NET Core MVC 的优势：
- 基于可缩放且成熟的模型生成 大型 Web 应用。
- 明确分离关注点以获得最大的灵活性。
- 模型-视图-控制器的责任分离，确保了业务模型的发展，而不会与底层的实现细节紧密相连。
若要开始使用 ASP.NET Core MVC，请参阅开始使用 ASP.NET Core MVC。 有关 ASP.NET Core MVC 的体系结构和优势的概述，请参阅 ASP.NET Core MVC 概述。
四、单页应用程序 (SPA) 📑
使用热门的 JavaScript 框架（如 Angular、React 和 Vue）生成适用于 ASP.NET Core 应用的客户端逻辑。 ASP.NET Core 为 Angular、React 和 Vue 提供了项目模板，也可以用于其他 JavaScript 框架。
在前面列出的客户端呈现的优点基础上，将 ASP.NET Core SPA 与 JavaScript 框架结合使用也有🔖一些优点：
- JavaScript 运行时环境已随浏览器提供。
- 大型社区和成熟的生态系统。
- 使用热门的 JS 框架（如 Angular、React 和 Vue）构建适用于 ASP.NET Core 应用的客户端逻辑。
🚫缺点：
- 需要更多编码语言、框架和工具。
- 难以共享代码，因此一些逻辑可能会重复。
如要入门，请参阅：
- 使用 Angular 创建 ASP.NET Core 应用
- 使用 React 创建 ASP.NET Core 应用
- 使用 Vue 创建 ASP.NET Core 应用
- Visual Studio 中的 JavaScript 和 TypeScript
五、组合多个 Web UI 解决方案⚖️
MVC 、 Razor Pages 和 Blazor 都是 ASP.NET Core 框架的一部分，设计为可以结合使用。 Razor 组件可以集成到Razor Pages 和 MVC 应用。 呈现视图或页面时，可以同时预呈现组件。
在 MVC 或 Razor Pages 的优点基础上，MVC 或 Razor Pages 与 Blazor 结合使用的优点如下：
- 预呈现会在服务器上执行 Razor 组件，并将其呈现到视图或页面中，从而提高应用的感知加载时间。
- 使用组件标记帮助程序将交互性添加到现有视图或页面。
若要开始使用 ASP.NET Core MVC 或 Razor Pages， Blazor请参阅 将 ASP.NET Core Razor 组件与 MVC 或 Razor Pages 集成。
六、定位和性能分析 🆚
在性能方面， Blazor Web 和 Razor Pages 各有千秋。Blazor Web 最初加载时，可能会有些"慢热"，因为它需要把整个应用和 .NET 运行时下载到浏览器中。然而，一旦进入状态， Razor Pages 的表现就是一气呵成------所有交互都在客户端完成，没有频繁的服务器往返，因此体验上会更流畅。
Razor Pages 则在初次登场时表现迅速------所有内容都由服务器提前渲染好，直接送到浏览器。这意味着初次加载很快，但是在后续的交互中，每次请求都要与服务器"见面"，所以用户体验可能稍显迟滞。
七、SEO 优化分析 📧
对于 SEO 来说， Razor Pages 是天然的亲和力型选手，因为所有的内容都是服务器渲染的，搜索引擎的爬虫们可以轻松抓取页面内容。而 Blazor Web 则需要一些额外的"功夫"来优化 SEO ，因为它主要在客户端渲染内容，这对搜索引擎来说，多少有些"难懂"。
八、灵活性
Blazor Web 更像是一个拼插积木的高手，它的一切都基于组件。每个组件都是一个独立的小积木，你可以随心所欲地拼搭它们------增加、减少、嵌套、复用，完全按照你的需要来定制。这种基于组件的开发方式，带来了极高的灵活性和复用性。
而 Razor Pages 则走的是"页面"路线，每个页面都有自己固定的角色。它的页面模型更像是一张张独立的剧本------每个页面有它的 HTML（.cshtml 文件）和后台逻辑（.cs 文件），虽然简单直观，但是灵活性稍逊一筹。
喜欢的话关注一下吧~~💕