服务器端使用jsp还是asp_快速了解 ASP.NET Core Blazor
最近在几个微信 .NET 交流群里大家讨论比较频繁的话题就是这几天自己的面试经历。
面试官:“你刚说你喜欢研究新技术,那你有了解过 Blazor 吗?”
作为一位专注于 .NET 开发的软件工程师,你好意思说你对 Blazor 一点也不解吗?.NET 新技术也就是那么几个,连微软最近在逛推的 Blazor 你都不了解,你好意思说你喜欢研究新技术?
讲真,确实有很多童鞋对 Blazor 还不了解,平时埋头写代码改 Bug,哪有时间去研究 Blazor,再说这种玩意儿公司会不会采用还是个很大疑问呢。是这个理,但如果等你的公司(国内使用了.NET 技术的公司)都开始使用 Blazor 了,Blazor 还能算是新技术吗?出于真正对技术的兴趣和热爱,对于新技术,有人会主动地去了解(不一定要研究得很深),而不是等到需要用的时候再去了解。至少他们会知道新技术有哪些优点,在公司技术选型上就可以给到自己的意见甚至推广新技术的使用,这可能就是他们和普通程序员拉开差距的原因之一。
不管你是真对 Blazor 感兴趣,还是只是为了应付面试,作为 .NET 开发者,没用过 Blazor 很正常,但至少应该了解一下,哪怕是花个一两分钟看看这篇文章的介绍。
使用 C# 实现 Web 交互式 UI
Blazor 允许你使用 C# 来实现 Web 交互式 UI,而不需要使用 JavaScript。尽管 JavaScript 的生态很强大,但这种弱类型语言在业务逻辑比较复杂的大型 Web 开发上还是存在较大的缺陷。当然,经过几年的发展 JavaScript 的弱类型问题可以通过工程手段来解决,甚至使用 TypeScript 来替代,但在实现可重用组件上还是有诸多的不理想。
Blazor 应用可以使用 C#、HTML 和 CSS 实现可重用 Web UI 组件,客户端和服务器代码都用 C# 编写的,允许你共享代码和库。Blazor 是 ASP.NET Core 的一个新特性,所以可以很好的集成到 ASP.NET Core MVC/Razor Pages 应用中。
下面是一段来自于模板的 Blazor 代码:
@page "/counter"
Counter
Current count: @currentCount
class="btn btn-primary" @onclick="IncrementCount">Click me
@code {private int currentCount = 0;private void IncrementCount()
{
currentCount++;
}
}
在 WebAssembly 或服务器端运行
Blazor 支持两种运行方式,一是在客户端使用 WebAssembly 运行,二是在服务器端运行直接渲染到浏览器。
Blazor 可以使用 WebAssembly 直接在浏览器中运行客户端 C# 代码,正因为它是运行在 WebAssembly 上的 .NET 程序,所以客户端也可以重用服务器端的代码和库。
即使不使用 WebAssembly,Blazor 也可以在服务器端运行客户端的业务逻辑。客户端 UI 事件使用实时消息框架 SignalR 发送回服务器,一旦执行完成,所需的 UI 更改将发送到客户端渲染到 DOM 中。
目前主流开发单页应用(SPA)使用 Vue 或 React 的很多,但要实现服务器端渲染(SSR),还是挺麻烦的,尽管有现成的像 Next.js 或 Nuxt.js 这样的框架可以使用,但由于它们更新迭代比较快,依赖的 npm 包多而杂,后期维护和升级成本也很高。所以从 SSR 支持这一点来讲,Blazor 应用还是有明显优势的。
基于开放的 Web 标准
为了使用统一的编程语言或使用统一的标准,常见的做法是将一种编程语言编写的代码转换为另一种编程语言,比如将 TypeScript 编写代码转换成 JavaScript 以便在浏览器中运行。而 Blazor 使用的是开放的 Web 标准,不需要额外的插件或代码语言转换。Blazor 可以在所有主流的 Web 浏览器中工作,包括移动端浏览器。
在客户端运行 Blazor 代码和 JavaScript 框架一样是在安全的沙箱中执行的,在基于开放的 Web 标准基础上,Blazor 具有服务器端代码的灵活性,比如直接连接数据库。
和 JavaScript 交互
在 Blazor 应用中,你可以在 C# 代码中调用 JavaScript 代码,也可以在 JavaScript 代码中调用 C# 代码,两者可以很容易实现交互操作。好处是,在使用 C# 编写业务代码时,你依然可以继续使用现有庞大的 JavaScript 库生态系统。当使用服务器端运行代码时,Blazor 会负责在客户端使用 JavaScript 无缝调用 C# 代码。
下面是一个 JavaScrit 调用 C# 的示例。
先使用 JSInvokable 特性标注一个 C# 方法为允许 JavaScript 调用:
"button" class="btn btn-primary" onclick="exampleJsFunctions.returnArrayAsyncJs()"> Trigger .NET static method ReturnArrayAsync@code { [JSInvokable]public static Task<int[]> ReturnArrayAsync() {return Task.FromResult(new int[] { 1, 2, 3 }); }}
然后在 JavaScript 代码中调用 C# 代码:
window.exampleJsFunctions = { ... returnArrayAsyncJs: function () { DotNet.invokeMethodAsync('BlazorSample', 'ReturnArrayAsync') .then(data => { data.push(4);console.log(data); }); }, ...};
其它
对我来说 Blazor 最吸引的优点是前后端代码的共用以及组件的重用。通过 nuget 管理和引用共用组件和库不仅比 npm 包管理方便,而且体积也小很多。
Blazor 的生态也正逐步发展起来了,虽然还没有听说哪个大公司在用,但 Blazor 的理念是未来趋势,值得你花点时间了解和研究一下。
往期精彩回顾
【推荐】.NET Core开发实战视频课程 ★★★
.NET Core实战项目之CMS 第一章 入门篇-开篇及总体规划
【.NET Core微服务实战-统一身份认证】开篇及目录索引
Redis基本使用及百亿数据量中的使用技巧分享(附视频地址及观看指南)
.NET Core中的一个接口多种实现的依赖注入与动态选择看这篇就够了
10个小技巧助您写出高性能的ASP.NET Core代码
用abp vNext快速开发Quartz.NET定时任务管理界面
在ASP.NET Core中创建基于Quartz.NET托管服务轻松实现作业调度
现身说法:实际业务出发分析百亿数据量下的多表查询优化
关于C#异步编程你应该了解的几点建议
C#异步编程看这篇就够了
服务器端使用jsp还是asp_快速了解 ASP.NET Core Blazor相关推荐
- 快速了解 ASP.NET Core Blazor
最近在几个微信 .NET 交流群里大家讨论比较频繁的话题就是这几天自己的面试经历. 面试官:"你刚说你喜欢研究新技术,那你有了解过 Blazor 吗?" 作为一位专注于 .NET ...
- .NET Core实战项目之CMS 第二章 入门篇-快速入门ASP.NET Core看这篇就够了
本来这篇只是想简单介绍下ASP.NET Core MVC项目的(毕竟要照顾到很多新手朋友),但是转念一想不如来点猛的(考虑到急性子的朋友),让你通过本文的学习就能快速的入门ASP.NET Core.既 ...
- ASP.NET Core Blazor Webassembly 之 渐进式应用(PWA)
Blazor支持渐进式应用开发也就是PWA.使用PWA模式可以使得web应用有原生应用般的体验. 什么是PWA PWA应用是指那些使用指定技术和标准模式来开发的web应用,这将同时赋予它们web应用和 ...
- ASP.NET Core Blazor Webassembly 之 组件
关于组件 现在前端几大轮子全面组件化.组件让我们可以对常用的功能进行封装,以便复用.组件这东西对于搞.NET的同学其实并不陌生,以前ASP.NET WebForm的用户控件其实也是一种组件.它封装ht ...
- ASP.NET Core Blazor 初探之 Blazor Server
上周初步对Blazor WebAssembly进行了初步的探索(ASP.NET Core Blazor 初探之 Blazor WebAssembly).这次来看看Blazor Server该怎么玩. ...
- 使用VS 2019,.NET Core 3和Web API创建ASP.NET Core Blazor CRUD应用程序
目录 介绍 Blazor Blazor客户端应用程序 Blazor服务器应用程序 背景 先决条件 使用代码 第1步-创建数据库和表 第2步-创建ASP.NET Core Blazor服务器应用程序 运 ...
- ASP.NET Core Blazor WebAssembly 之 .NET JavaScript互调
Blazor WebAssembly可以在浏览器上跑C#代码,但是很多时候显然还是需要跟JavaScript打交道.比如操作dom,当然跟angular.vue一样不提倡直接操作dom:比如浏览器的后 ...
- ASP.NET Core Blazor Webassembly 之 路由
web最精妙的设计就是通过url把多个页面串联起来,并且可以互相跳转.我们开发系统的时候总是需要使用路由来实现页面间的跳转.传统的web开发主要是使用a标签或者是服务端redirect来跳转.那今天来 ...
- ASP.NET Core Blazor Webassembly 之 数据绑定
上一次我们学习了Blazor组件相关的知识(Asp.net Core Blazor Webassembly - 组件).这次继续学习Blazor的数据绑定相关的知识.当代前端框架都离不开数据绑定技术. ...
最新文章
- 当img 路径为空时不显示x号
- 【AI视野·今日CV 计算机视觉论文速览 第183期】28 Apr 2020
- 华为服务器装系统一直在读盘,系统重装一直在启动服务器
- kettle的命名参数接口NamedParams实现与Job命名参数的传递和使用实现
- serlvet配置xml和@WebServlet
- 在VSAN实验环境下如何将普通HDD标注成SSD
- 从入门到精通,C程序员必读的3本
- 银行卡Bin查询接口
- 《EMU8086安装报告》
- 六自由度机器人设计过程-范例
- html-QQ登陆界面
- Excel智能分析报表案例:某餐饮公司各门店经营现状分析报表
- Android 获取手机Ram 和 Rom大小
- 吃鸡神器iPhone苹果7Plus手机基础使用教程
- 看板游戏——叠纸飞机
- 移动浏览器成巨头新角力场
- 2019世界智能网联汽车大会10月召开
- 201421123042 《Java程序设计》第5周学习总结
- Unity-3D相机跟随控制
- voa 1500单词
热门文章
- 【Java算法】一天24小时中,时针和分针一共重合多少次?
- el-date-picker设置默认日期_ERP入门教程:快速掌握金蝶ERP的基础-物料批次管理的应用及设置...
- Find Integer(费马大定理的使用)
- 2.4操作系统之死锁详解(预防、避免、检测、解除)+思维导图
- 200设备管理器找不到蓝牙_达尔优LK200蓝牙键盘,一键切换+支持三台设备+百元不到...
- 定位 android8.1.0,8.1.2 实现Android定位(2)
- java kafka 消费_java编程之Kafka_消费者API详解
- richedit line insertion error什么意思_大连 LINE 是怎样的一个公司?
- android 下载进度条代码实现,Android 文件下载进度条的实现
- 乖离性暗机器人_乖离性百万亚瑟王国服超弩暗机器人如何打|乖离性百万亚瑟王国服超弩暗机器人平民打法攻略分享_好特教程...