概览

Blazor目前有两种托管模式,一种是Server-Side模式,一种是WebAssembly模式。官方首先支持的是Service-Side模式,使用WebAssembly模式,需要更新到最新版VS2019。 小编目前的精力是更多的专注于Blazor-WebAssembly模式的研究,所以本系列文章只会对Server-Side模式做简要说明。

WebAssembly

WebAssembly模式(也可叫做Client-Side模式),WebAssembly前文已经说了很多了,本文不再做额外讨论。我们主要来看一下ASP.NET Core Blazor是如何实现WebAssembly模式的。Blazor启动后,会将依赖项、.NET运行时以及应用组件下载浏览器,应用将在浏览器上直接运行。其交互如图所示:

同时其UI更新和事件处理也在统一进程中进行,如下图所示:

WebAssembly优点

  • Web 程序集在客户端、浏览器内运行,因此可以作为静态文件进行部署。
  • 相对于Server-Side模式,当与服务器连接断掉时,依然可以连接,但是涉及到数据库查询等后台功能时,肯定是无法正常工作的。
  • 可以减少服务器负载压力。

WebAssembly缺点

  • 首次加载时间会比较长,因为它需要下载应用的依赖项、运行时以及 WAT 文件。
  • Blazor WebAssembly 仅适用于较新的浏览器,并且对搜索引擎并不友好。

Server-Side

Server-Side模式于2019年9月发布,其目的是使得ASP.NET Core 应用中在服务器上执行应用。 其交互如图所示:

UI 更新、事件处理和 JavaScript 调用是通过 SignalR 连接进行处:

Server-Side优点

  • Blazor 服务器端已经先于客户端呈现了HTML内容。相对于WebAssembly模式要下载很多的文件,Server-Side的启动速度更快,也对搜索引擎更加友好。
  • 由于浏览器端只需要专注于HTML相关内容的展示,这意味Server-Side几乎不会遇到什么兼容性。

Server-Side缺点

  • 由于其每个交互HTML由服务器端预呈现,这意味Server-Side无法使用静态化方案。同时其往返流程所涉及到的时间消耗,这也只能使得Server-Side模式可能会有更高的延迟。
  • 需要始终与服务器建立活动连接,一旦服务器关闭,应用也将立即停止工作。
  • 服务器压力会较大。

Blazor带我重玩前端(二)的更多相关文章

  1. Blazor带我重玩前端(一)

    写在前面 曾经我和前端朋友聊天的时候,我说我希望有一天可以用C#写前端,不过当时更多的是美好的想象,而现在这一切正变得真实…… 什么是Blazor 我们知道浏览器可以正确解释并执行JavaScript ...

  2. Blazor带我重玩前端(三)

    写在前面 需要升级VS2019以及.NET Core到最新版(具体的最低支持,我已经忘了,总是越新支持的就越好),以更好的支持自己开发Blazor项目. WebAssembly 搜索Blazor模板 ...

  3. Blazor带我重玩前端(四)

    布局 Blazor中的布局和MVC中的布局是类似的. 创建布局 新建一个Razor页面,所有新增的布局都要继承LayoutComponentBase,同时标识自定义内容的输出位置,即标识Body的位置 ...

  4. Blazor带我重玩前端(五)

    概述 本文主要讨论Blazor事件内容,由于blazor事件部分很多,所以会分成上下两篇,本文为第一篇,后续会有第二篇. 我们可以视组件是一个类,我们先看一下前文所说的Index.Razor页面生成的 ...

  5. Blazor带我重玩前端(六)

    本文主要讨论Blazor事件内容,由于blazor事件部分很多,所以会分成上下两篇,本文为第二篇. 双向绑定 概述 如图所示 当点击单项绑定的时候,MyOnewayComponent里的属性值会发生变 ...

  6. 重学前端 --- Promise里的代码为什么比setTimeout先执行?

    首先通过一段代码进入讨论的主题 var r = new Promise(function(resolve, reject){ console.log("a"); resolve() ...

  7. 「kuangbin带你飞」专题二十 斜率DP

    layout: post title: 「kuangbin带你飞」专题二十 斜率DP author: "luowentaoaa" catalog: true tags: mathj ...

  8. 「kuangbin带你飞」专题二十二 区间DP

    layout: post title: 「kuangbin带你飞」专题二十二 区间DP author: "luowentaoaa" catalog: true tags: - ku ...

  9. 重学前端--js是面向对象还是基于对象?

    重学前端-面向对象 跟着winter老师一起,重新认识前端的知识框架 js面向对象或基于对象编程 以前感觉这两个在本质上没有什么区别,面向对象和基于对象都是对一个抽象的对象拥有一系列的行为和状态,本质 ...

随机推荐

  1. Java实现第八届蓝桥杯杨辉三角

    杨辉三角 杨辉三角也叫帕斯卡三角,在很多数量关系中可以看到,十分重要. 第0行: 1 第1行: 1 1 第2行: 1 2 1 第3行: 1 3 3 1 第4行: 1 4 6 4 1 - 两边的元素都是 ...

  2. java实现第五届蓝桥杯年龄巧合

    年龄巧合 小明和他的表弟一起去看电影,有人问他们的年龄.小明说:今年是我们的幸运年啊.我出生年份的四位数字加起来刚好是我的年龄.表弟的也是如此.已知今年是2014年,并且,小明说的年龄指的是周岁. 请 ...

  3. CentOS7——配置阿里云镜像源

    CentOS7--配置阿里云镜像源 #下载CentOS 7的repo文件 curl -o /etc/yum.repos.d/CentOS-Base.repo http://mirrors.aliyun ...

  4. WDCP3.3中多PHP版本安装方法,以及安装遇到的问题

    [多版本php安装] 安装方法如下: wget http://down.wdlinux.cn/in/phps.sh sh phps.sh (共支持8个版本的PHP,如5.2.17/5.3.29/5.4 ...

  5. Edge浏览器现已支持Tampermonkey(油猴)

    Tampermonkey,Greasemonkey,这种扩展可以让我们的浏览器自动运行我们自己定义的脚本,然后就出现了相关网站(比如https://greasyfork.org/zh-CN)让大家在上 ...

  6. (四)MySQL条件查询(通配符、模糊查询)、排序查询、分组查询(单行、分组函数)

    一.条件查询 1.含义:前面学的基础查询可以查询一个或多个字段,如果需要的数据仅仅是其中的某一行或多行就用到了条件查询. 2.语法:(序号表示语句执行顺序) SELECT 字段名 ③ FROM 表名 ...

  7. MQ系列(0)——MQ简介

    mq简介 mq 就是消息队列(Message Queue).想必大家对队列的数据结构已经很熟悉了,消息队列可以简单理解为:把要传输的数据放在队列中,mq 就是存放和发送消息的这么一个队列中间件.在消息 ...

  8. mitmdump+python的使用(代码篇)

    mitmproxy+python代码篇 一.上个推文我们介绍了mitmdump的简单操作,下面我们开始学习,mitmdump配合python脚本的使用.第一点先讲日志输出.请看图片 先导入ctx模块: ...

  9. SpringMVC框架搭建流程(完整详细版)

    SpringMVC框架搭建流程 开发过程 1)配置DispatcherServlet前端控制器 2)开发处理具体业务逻辑的Handler(@Controller. @RequestMapping) 3 ...

  10. java中Proxy类初探

    在java中提供了一个动态代理类,这个类位于java.lang.reflect包中的Proxy类中.什么是动态代理类呢?就是可以在运行时创建一个实现了一组给定接口的新类.听上去有点高深的样子,其实是提 ...