当前位置: 首页 > news >正文

Blazor 托管模型 BlazorWebAssembly和Blazor Server

BlazorWebAssembly 应用

BlazorWebAssembly 应用使用基于 WebAssembly 的 .NET 运行时在浏览器中直接执行。 BlazorWebAssembly 应用的工作方式类似于 Angular 和 React 等前端 JavaScript 框架。 但不是编写 JavaScript,而是编写 C#。 .NET 运行时与应用、应用程序集和任何必需的依赖项一起下载。 无需浏览器插件和扩展。

下载的程序集是普通的 .NET 程序集,就像在任何其他 .NET 应用中使用的程序集一样。 运行时支持 .NET Standard,因此可将现有的 .NET Standard 用于 BlazorWebAssembly 应用。 但这些程序集仍在浏览器安全沙盒中执行。 某些功能可能会引发 PlatformNotSupportedException,如尝试访问文件系统或打开任意网络连接。

应用加载时,.NET 运行时会启动并指向应用程序集。 应用启动逻辑会运行,并且根组件会呈现。 Blazor 根据组件呈现的输出计算 UI 更新。 然后应用 DOM 更新。
在这里插入图片描述

BlazorWebAssembly 应用完全在客户端运行。 此类应用可以部署到 GitHub 网页或 Azure 静态网站托管等静态网站托管解决方案。 在服务器上根本不需要 .NET。 到应用的某些部分的深层链接通常需要服务器上的路由解决方案。 路由解决方案会将请求重定向到应用的根。 例如,可以通过使用 URL 重写 IIS 中的规则来处理此重定向。

要利用 Blazor 和全栈 .NET Web 开发的所有优势,请使用 ASP.NET Core 托管 BlazorWebAssembly 应用。 通过使用客户端和服务器上的 .NET,你可以轻松共享代码,并使用一组一致的语言、框架和工具生成应用。 Blazor 提供便捷的模板,可用于设置包含 BlazorWebAssembly 应用和 ASP.NET Core 托管项目的解决方案。 生成解决方案后,Blazor 应用中已生成的静态文件由已设置回退路由的 ASP.NET Core 应用托管。

Blazor Server 应用

Blazor 组件会将其输出呈现为名为 RenderTree 的中间抽象。 Blazor 框架然后将呈现的内容与之前呈现的内容相比较。 这些差异会应用到 DOM。 Blazor 组件根据呈现的输出的应用方式进行去耦。 因此组件本身运行的进程无需与更新 UI 的进程相同。 实际上,它们甚至不必在同一计算机上运行。

在 Blazor Server 应用中,组件在服务器上运行,而不是在浏览器中的客户端运行。 浏览器中发生的 UI 事件通过实时连接发送到服务器。 事件被分派到正确的组件实例。 组件将呈现,计算的 UI 差异被序列化后发送到浏览器并在其中应用于 DOM。
在这里插入图片描述

如果你使用过 ASP.NET AJAX 和 Blazor 控件,可能不会对 UpdatePanel Server 托管模型感到陌生。 UpdatePanel 控件负责应用部分页面更新以响应页面上的触发事件。 触发时,UpdatePanel 会请求部分更新,然后应用该更新,无需刷新页面。 UI 状态使用 ViewState 进行管理。 Blazor Server 应用略有不同,因为该应用需要与客户端建立活动连接。 此外,服务器上的所有 UI 状态都需要进行维护。 除了这些差异之外,这两个模型在概念上类似。

Blazor 两种托管模型的优缺点

BlazorWebAssembly 优点:

  1. 没有 .NET 服务器端依赖项。 应用下载到客户端后即可正常运行。
  2. 可充分利用客户端资源和功能。
  3. 工作可从服务器转移到客户端。
  4. 无需 ASP.NET Core Web 服务器即可托管应用。 无服务器部署方案可行(例如通过 CDN 为应用提供服务的方案)。

BlazorWebAssembly 缺点:

  1. 浏览器功能限制了该应用。
  2. 需要客户端硬件和软件支持(例如 WebAssembly 支持)。
  3. 下载项大小较大,应用加载耗时较长。
  4. NET 运行时和工具支持不够完善。 例如,.NET Standard 支持和调试方面存在限制。

Blazor Server 优点:

  1. 下载大小明显小于客户端应用,并且应用的加载速度更快。
  2. 应用可以充分利用服务器功能,包括使用任何与 .NET 兼容的 API。
  3. 服务器上的 .NET 用于运行应用,因此调试等现有 .NET 工具可按预期正常工作。
  4. 支持瘦客户端。 例如,服务器端的应用适用于不支持 WebAssembly 以及资源受约束的设备上的浏览器。
  5. 应用的 .NET/C# 代码库(其中包括应用的组件代码)不适用于客户端。

Blazor Server 缺点:

  1. UI 延迟更高。 每次用户交互都涉及到网络跃点。
  2. 不支持脱机工作。 如果客户端连接失败,应用会停止工作。
  3. 如果具有多名用户,则应用扩缩性存在挑战。 服务器必须管理多个客户端连接并处理客户端状态。
  4. 需要 ASP.NET Core 服务器为应用提供服务。 不支持无服务器部署方案。 例如,无法从 CDN 提供应用。

上述优缺点列表可能会让你顾虑重重,但你可在以后更改托管模型。 无论是否选择 Blazor 托管模型,组件模型都是相同的。 原则上,相同组件可用于任一托管模型。 应用代码不会更改,但最佳做法是引入抽象,使组件与托管模型无关。 抽象使应用能够更轻松地采用不同的托管模型。

相关文章:

Blazor 托管模型 BlazorWebAssembly和Blazor Server

BlazorWebAssembly 应用 BlazorWebAssembly 应用使用基于 WebAssembly 的 .NET 运行时在浏览器中直接执行。 BlazorWebAssembly 应用的工作方式类似于 Angular 和 React 等前端 JavaScript 框架。 但不是编写 JavaScript,而是编写 C#。 .NET 运行时与应用、应用程序…...

从未想过制作数据可视化展示竟可以如此简单

还在跟着网络上一节课好几个小时的付费课程学习如何制作数据可视化大屏嘛?还在为不知道怎么设计数据展示排版而苦恼?今天教大家用最简单的方式制作一个数据可视化大屏,首先让我们看一下参考大屏样式:接下来我们将制作数据可视化大…...

企业电子招投标采购系统源码之功能模块的描述

功能模块: 待办消息,招标公告,中标公告,信息发布 描述: 全过程数字化采购管理,打造从供应商管理到采购招投标、采购合同、采购执行的全过程数字化管理。通供应商门户具备内外协同的能力,为外部供…...

LeetCode-2341. 数组能形成多少数对【哈希表,计数】

LeetCode-2341. 数组能形成多少数对【哈希表,计数】题目描述:解题思路一:哈希表,将数组中的数加入哈希表中,若有两个相同的数就记录下来,并消去两个。最后只需遍历哈希表中置为1的个数即可。解题思路二&…...

vue-echarts实现多功能图表

前言作为前端人员,日常图表、报表、地图的接触可谓相当频繁,今天小编隆重退出前端框架之VUE结合百度echart实现中国地图各种图表的展示与使用;作为“你值得拥有”专栏阶段性末篇,值得一看主要实现功能——中国地图——环形图——折…...

C#快键精灵

我发过挺多工作中用到的C#内容,整体链接和内容去这里看下:C#基础知识体系框架图,及起对应我发过的博客_花开莫与流年错_的博客-CSDN博客_c#架构图 可以记住电脑上鼠标、键盘操作记录,用处就很多,比较灵活了&#xff0c…...

谷歌、微软、Meta?谁才是 Python 最大的金主?

你知道维护 Python 这个大规模的开源项目,每年需要多少资金吗? 答案是:约 200 万美元! PSF(Python 软件基金会)在 2022 年 6 月发布了 2021 的年度报告,其中披露了以下这份支出明细&#xff08…...

面向对象笔记

标准JavaBean类1.类名见名知意2.成员变量由private修饰3.提供两个构造方法 无参构造和带全部参数构造4.提供每一个成员变量对应的set/get方法5.如果有其它行为,也要写上空参构造 初始化默认值带参构造 初始化参数 创建对象由虚拟机调用,不能手动调用每创…...

tofu:一款功能强大的模块化Windows文件系统安全测试工具

关于tofu tofu是一款功能强大的针对Windows文件系统安全的模块化工具,该工具可以使用离线方法对目标Windows文件系统进行渗透测试,并通过绕过Windows系统登录界面来帮助广大研究人员测试Windows主机的安全性。除此之外,该工具还可以执行哈希…...

VS中scanf为什么会报错

简单来讲&#xff0c;scanf会强行输入内容&#xff0c;所以是不安全的。 我们来看这样的例子&#xff1a; #include <iostream> using namespace std;int main() {char demo[3];scanf("%s", demo);return 0; }对于以上代码&#xff0c;当我们输入字符不超过3时…...

使用kubeadm部署k8s1.24.0版本,遇到的坑总结

使用kubeadm部署k8s1.24.0版本&#xff0c;遇到的坑总结环境安装遇到的问题环境 操作系统&#xff1a;centos7 内核&#xff1a;5.4.231-1.el7.elrepo.x86_64 kubeadm&#xff1a;1.24.0 kubelet&#xff1a;1.24.0 kubectl&#xff1a;1.24.0 cri&#xff1a;docker cni&…...

【C++】特殊类设计

&#x1f308;欢迎来到C专栏~~特殊类设计 (꒪ꇴ꒪(꒪ꇴ꒪ )&#x1f423;,我是Scort目前状态&#xff1a;大三非科班啃C中&#x1f30d;博客主页&#xff1a;张小姐的猫~江湖背景快上车&#x1f698;&#xff0c;握好方向盘跟我有一起打天下嘞&#xff01;送给自己的一句鸡汤&a…...

中创教育PMP如何轻松应对公司90%以上的沟通难题

掌握沟通技能&#xff0c;可以让问题从1变成0&#xff1b; 掌握沟通技能&#xff0c;可以让机会从0变成1&#xff1b; 掌握沟通技能&#xff0c;可以让成功从1变成100&#xff1b; 难题一、当领导问你某件事&#xff0c;但你又不太清楚时 【说话公式】需要思考需要确认晚点回…...

#笨鸟先飞# 数据结构与算法基础 课程笔记 第六章 图

图的定义和基本术语图&#xff1a;G( V , E ) Graph&#xff08;Vertex&#xff0c;Edge&#xff09;V&#xff1a;顶点&#xff08;数据元素&#xff09;的有穷非空集合&#xff1b;E&#xff1a;边的有穷集合。无向图&#xff1a;每条边都是无方向的有向图&#xff1a;每条边…...

深入浅出带你学习Apache中间件常见漏洞

前言 上一篇文章给大家总结了一下IIS中间件的漏洞&#xff0c;这篇文章就给大家讲一下apache中间件漏洞&#xff0c;说起apache大家一定不会陌生&#xff0c;这是我们日常中经常用到的中间件&#xff0c;下面由我来给大家讲解一下改中间件常见的漏洞。 Apache是什么&#xff…...

用多种指针方法访问数据元素,实现逆序输出

这里注意下数组指针的下标表示&#xff1a; 我们已经知道&#xff0c;数组名a总是指向a[0]的指针&#xff0c;*(ai)是对a[i]的引用&#xff0c;实际上&#xff0c;编译器中&#xff0c;对数组的引用&#xff0c;如a[i]&#xff0c;总是被编译器改写成*(ai)的形式。 另外说明下…...

WebDAV之葫芦儿·派盘+NMM

NMM 支持WebDAV方式连接葫芦儿派盘。 推荐一款文件管理器,可以对手机中的文件进行多方面的管理,支持语法高亮和ftp等远程的文件的管理。支持从WebDav服务器连接葫芦儿派盘服务下载文件和上传文件。 NMM文本编辑器是一款文件管理器,在功能上面更加的适合于一些编程人员进行使…...

Redis多级缓存

文章目录一. 什么是多级缓存二. JVM进程缓存一. 什么是多级缓存 传统的缓存策略一般是请求到达Tomcat后&#xff0c;先查询Redis&#xff0c;如果未命中则查询数据库&#xff0c;如图&#xff1a; 存在下面的问题&#xff1a; 请求要经过Tomcat处理&#xff0c;Tomcat的性能…...

【原创】java+swing+mysql会议室管理系统设计与实现

本文主要介绍使用javaswingmysql等技术去设计完成一个企业公司的会议室管理系统&#xff0c;帮助企业员工去进行会议室的预约安排。 功能分析&#xff1a; 会议室管理系统的使用角色&#xff0c;一般分为管理员和员工用户&#xff0c;管理员进行数据管理&#xff0c;员工进行…...

【Redis】Redis 常用数据类型操作 ① ( 数据库操作 | Redis 数据库连接参数 | Redis 数据库个数 | Redis 访问机制 )

文章目录一、Redis 数据库连接参数二、Redis 数据库个数三、Redis 访问机制一、Redis 数据库连接参数 连接 Redis 数据库 , 只需要 IP 地址 , 端口号 , 访问密码 即可 , 如果没有 设置 访问密码 可忽略该选项 ; Redis 默认端口号是 6379 ; 参考 【Redis】Redis 数据库 安装、…...

挑战杯推荐项目

“人工智能”创意赛 - 智能艺术创作助手&#xff1a;借助大模型技术&#xff0c;开发能根据用户输入的主题、风格等要求&#xff0c;生成绘画、音乐、文学作品等多种形式艺术创作灵感或初稿的应用&#xff0c;帮助艺术家和创意爱好者激发创意、提高创作效率。 ​ - 个性化梦境…...

DeepSeek 赋能智慧能源:微电网优化调度的智能革新路径

目录 一、智慧能源微电网优化调度概述1.1 智慧能源微电网概念1.2 优化调度的重要性1.3 目前面临的挑战 二、DeepSeek 技术探秘2.1 DeepSeek 技术原理2.2 DeepSeek 独特优势2.3 DeepSeek 在 AI 领域地位 三、DeepSeek 在微电网优化调度中的应用剖析3.1 数据处理与分析3.2 预测与…...

日语学习-日语知识点小记-构建基础-JLPT-N4阶段(33):にする

日语学习-日语知识点小记-构建基础-JLPT-N4阶段(33):にする 1、前言(1)情况说明(2)工程师的信仰2、知识点(1) にする1,接续:名词+にする2,接续:疑问词+にする3,(A)は(B)にする。(2)復習:(1)复习句子(2)ために & ように(3)そう(4)にする3、…...

安宝特方案丨XRSOP人员作业标准化管理平台:AR智慧点检验收套件

在选煤厂、化工厂、钢铁厂等过程生产型企业&#xff0c;其生产设备的运行效率和非计划停机对工业制造效益有较大影响。 随着企业自动化和智能化建设的推进&#xff0c;需提前预防假检、错检、漏检&#xff0c;推动智慧生产运维系统数据的流动和现场赋能应用。同时&#xff0c;…...

前端开发面试题总结-JavaScript篇(一)

文章目录 JavaScript高频问答一、作用域与闭包1.什么是闭包&#xff08;Closure&#xff09;&#xff1f;闭包有什么应用场景和潜在问题&#xff1f;2.解释 JavaScript 的作用域链&#xff08;Scope Chain&#xff09; 二、原型与继承3.原型链是什么&#xff1f;如何实现继承&a…...

Angular微前端架构:Module Federation + ngx-build-plus (Webpack)

以下是一个完整的 Angular 微前端示例&#xff0c;其中使用的是 Module Federation 和 npx-build-plus 实现了主应用&#xff08;Shell&#xff09;与子应用&#xff08;Remote&#xff09;的集成。 &#x1f6e0;️ 项目结构 angular-mf/ ├── shell-app/ # 主应用&…...

python报错No module named ‘tensorflow.keras‘

是由于不同版本的tensorflow下的keras所在的路径不同&#xff0c;结合所安装的tensorflow的目录结构修改from语句即可。 原语句&#xff1a; from tensorflow.keras.layers import Conv1D, MaxPooling1D, LSTM, Dense 修改后&#xff1a; from tensorflow.python.keras.lay…...

FFmpeg:Windows系统小白安装及其使用

一、安装 1.访问官网 Download FFmpeg 2.点击版本目录 3.选择版本点击安装 注意这里选择的是【release buids】&#xff0c;注意左上角标题 例如我安装在目录 F:\FFmpeg 4.解压 5.添加环境变量 把你解压后的bin目录&#xff08;即exe所在文件夹&#xff09;加入系统变量…...

AI语音助手的Python实现

引言 语音助手(如小爱同学、Siri)通过语音识别、自然语言处理(NLP)和语音合成技术,为用户提供直观、高效的交互体验。随着人工智能的普及,Python开发者可以利用开源库和AI模型,快速构建自定义语音助手。本文由浅入深,详细介绍如何使用Python开发AI语音助手,涵盖基础功…...

c# 局部函数 定义、功能与示例

C# 局部函数&#xff1a;定义、功能与示例 1. 定义与功能 局部函数&#xff08;Local Function&#xff09;是嵌套在另一个方法内部的私有方法&#xff0c;仅在包含它的方法内可见。 • 作用&#xff1a;封装仅用于当前方法的逻辑&#xff0c;避免污染类作用域&#xff0c;提升…...