选择 ASP.NET Core Web UI

ASP.NET Core 是一个完整的 UI 框架。 你可以选择要结合哪些功能,以满足应用的 Web UI 需求。

文章目录



一、ASP.NET Core Blazor

Blazor 是一个全栈 Web UI 框架,建议用于大多数 Web UI 方案。

使用 Blazor 的好处:

  • 可重用的组件模型。
  • 高效的基于差异的组件呈现。
  • 通过 WebAssembly 从服务器或客户端灵活地呈现组件。
  • 使用 C# 生成丰富的交互式 Web UI 组件。
  • 从服务器静态呈现组件。
  • 逐步增强服务器呈现组件,以实现更流畅的导航和表单处理并启用流式呈现。
  • 共享客户端和服务器上通用逻辑的代码。
  • 与 JavaScript 互操作。
  • 将组件与现有的 MVC、 Razor 页面或基于 JavaScript 的应用集成。

二、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 MVC

ASP.NET Core MVC 在服务器上呈现 UI,并使用模型-视图-控制器 (MVC) 结构模式。 MVC 模式将应用分成三组主要组件:模型、视图和控制器。 用户请求被路由到控制器。 控制器负责使用模型来执行用户操作或检索查询结果。 控制器选择要显示给用户的视图,并为其提供所需的任何模型数据。

ASP.NET Core MVC 的优势:

  • 基于可缩放且成熟的模型生成大型 Web 应用。
  • 明确分离关注点以获得最大的灵活性。
  • 模型-视图-控制器的责任分离,确保了业务模型的发展,而不会与底层的实现细节紧密相连。

四、采用前端JavaScript框架的ASP.NET Core单页应用程序(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 应用的客户端逻辑。

缺点:

  • 需要更多编码语言、框架和工具。
  • 难以共享代码,因此一些逻辑可能会重复。

组合多个 Web UI 解决方案:ASP.NET Core MVC 或 Razor Pages 和 Blazor

MVC、Razor Pages 和 Blazor 都是 ASP.NET Core 框架的一部分,设计为可以结合使用。 Razor 组件可以集成到 Razor Pages 和 MVC 应用。 呈现视图或页面时,可以同时预呈现组件。

在 MVC 或 Razor Pages 的优点基础上,MVC 或 Razor Pages 与 Blazor 结合使用的优点如下:

  • 预呈现会在服务器上执行 Razor 组件,并将其呈现到视图或页面中,从而提高应用的感知加载时间。
  • 使用组件标记帮助程序将交互性添加到现有视图或页面。

相关推荐
m0_7482451715 分钟前
vue登录成功之后的token处理
前端·javascript·vue.js
S-X-S33 分钟前
HTML - 蛆(畅享版)
前端·html
beyondjxx39 分钟前
纯css 实现呼吸灯效果
前端·css·css3
等一场春雨39 分钟前
CSS3 实现火焰-小火苗效果
前端·css·css3
m0_748254091 小时前
vue3前端组件库的搭建与发布(一)
前端
Irises`1 小时前
flex自适应页面
开发语言·前端·javascript
NoneCoder1 小时前
CSS系列(22)-- 容器查询详解
前端·css
无限大.1 小时前
深入探讨HTML页面中CSS的加载顺序
前端·css·html
chengchong_cc2 小时前
redis 缓存使用
前端·redis·缓存
SoraLuna2 小时前
「Mac畅玩鸿蒙与硬件46」UI互动应用篇23 - 自定义天气预报组件
开发语言·算法·macos·ui·华为·harmonyos