阅文时长 | 1.38分钟 字数统计 | 2218.4字符
主要内容 | 1、引言&背景 2、学习过程记录 3、概念性&底层知识 4、存疑&日后研究 5、声明与参考资料
『浅尝辄止·认识Blazor及基础使用』
编写人 | SCscHero 编写时间 | 2021/8/1 AM12:14
文章类型 | 系列 完成度 | 已完成
座右铭 每一个伟大的事业，都有一个微不足道的开始。

一、引言&背景   完成度：100%

a) 学习由来&目标

最近公司内部的技术分享大会提到了Blazor，初步了解到这是个可以使用C#编写客户端的技术，个人理解有些类似MVC中的Razor。于是通过微软官方的学习路径学习一下，传送门。本次学习目标主要是了解几个方面：

  1. Blazor是什么，为什么会推出专门技术？？能做什么？用在什么场景下？有哪些优劣势？
  2. 目前的Blazor哪些公司应用了？未来的发展将如何？
  3. 我是否有必要深入研究这门技术？这门技术以我的其他技术栈是否可以胜任？

b) 总结&个人片面理解分析

  1. 从目前初步理解来看，Blazor这门技术与目前三大主流前端框架有许多相似的地方，比如：组件化开发、服务端渲染、Razor等。有一些三大前端框架开发基础的，对这一套上手一定不会陌生。但博主还是认为，这门技术推出的时间，注定不会掀起风浪，因此学习价值并不大，在之后的有公司真正用起来了，再学习也不迟，一门技术的成熟一定要有一定的生态基础。
  2. 目前来看国外生态还是强于国内，但依照目前态势，还是观望官方数据吧。
  3. 学习理念即可，比如C#替代JS，但博主认为这还是技术捆绑，C#更多的是做服务端，客户端JS才是王者，而且目前的.Neter都具备JS技术栈的开发能力，并有强大的生态，用C#代替JS实在是别扭，因此如果不脱离实际来看，这门技术也是雷声小雨点小。当然本次学习体验还是不错的，如果早推出十年，博主相信还是有机会。

c) 环境准备

  • VS2019或VS2022最新版本
  • VS Code。
  • .Net5 SDK。

二、学习过程记录   完成度：100%

a) 相关CLI

  1. 新建一个Blazor应用，名称为上层文件夹目录
dotnet new blazor
  1. 启动并监听运行，即修改了代码会自动响应。
dotnet watch run
  1. 新建一个组件：页面、组件等。
dotnet new razorcomponent -n [名称] -o [类型：Pages等]

b) 完整过程

  1. 可见目标框架默认选择的是.Net 5.0，博主用的IDE是VS2019，并不是VS2022，使用VS2022暂未测试，估计可能是.Net 6.0。
  1. 从目录结构上来看，包含有.razor格式的文件，也包含有.cshtml格式的文件。看起来让人觉得就是一个去掉了Controller的纯前端的.cshtml的文件改了名字叫Razor。Blazor官方示例的例子，将客户端的计数器使用了C#实现。没有使用JS。可见Code实现了类似于Vue的响应式编程的效果。但是不禁让人疑惑，类似于JS中强大的插件生态，替代了JS，C#又有哪些优势呢？
  1. 新建的Blazor应用默认的示例。

三、概念性&底层知识   完成度：100%

1. WebAssembly。

WebAssembly (WASM) 是一种开放的二进制标准。 它用于定义旨在 Web 浏览器中运行的程序的可移植代码格式。 WebAssembly 是一种文本程序集语言，具有专用于实现快速下载和近乎本机性能的精简二进制格式。
WebAssembly 为 C、C++ 和 Rust 等语言提供了编译目标。 它设计为与 JavaScript 一起运行，因此两者可协同工作。 WebAssembly 还可生成可下载和脱机运行的渐进式 Web 应用程序。

2. BlazorWebAssembly。

使用 Blazor WebAssembly，开发人员可以在浏览器中运行 .NET 代码。 它是一种单页应用框架，使用的是 WebAssembly 开放标准，无需插件或代码生成。在浏览器中通过 WebAssembly 执行的 .NET 代码在浏览器的 JavaScript 沙盒中运行。 该代码具有沙盒提供的所有安全和保护特性。 这有助于防止客户端计算机上的恶意操作。

3. Blazor的两种模式，即服务器渲染。官方的说法如下：

Blazor 服务器在 ASP.NET Core 应用中添加了对在服务器上托管 Razor 组件的支持。 可通过 SignalR 连接处理 UI 更新。运行时停留在服务器上并处理：

  • 执行应用的 C# 代码。
  • 将 UI 事件从浏览器发送到服务器。
  • 将 UI 更新应用于服务器发送回的已呈现的组件。
  • Blazor 服务器用于与浏览器通信的连接还用于处理 JavaScript 互操作调用。
    ----来自《微软官方文档-什么是Blazor》1

4. Blazor Web 应用使用哪个运行时？
浏览器提供的运行时
使用 Web 应用部署的 .NET 运行时

Blazor 应用在浏览器中运行或在 .NET 5 运行时上的服务器上运行

使用 Web 应用部署的 JavaScript 运行时

5. 如何定义 Blazor UI？
作为混合使用 HTML 和 C# 的 Razor 页面

Razor 文件定义了构成应用中部分 UI 的组件

作为使用 XML 的 XAML 页面
使用 .NET Standard 库中定义的 C#

四、存疑&日后研究   完成度：100%

  1. 调试方式，目前使用的是CLI启动，F12找到Source没有JS相关的代码，不知道如何调试。另外可以看到Blazor引用了Blazor.server.js，底层也是相等于在用JS。
  1. 与几大主流WebUI的优劣势，如React、Angular、Vue等。目前看了几篇文章，说是和GO等Web技术相比，性能弱但开发效率高。

五、声明与参考资料   完成度：100%

微软官方学习路径
微软官方Blazor文档

原创博文，未经许可请勿转载。

如有帮助，欢迎点赞、收藏、关注。如有问题，请评论留言！如需与博主联系的，直接博客私信SCscHero即可。

  1. 微软官方文档-什么是Blazor。 ↩︎

浅尝辄止·认识Blazor及基础使用相关推荐

  1. .NET开发者的机遇与Web Blazor基础(有彩蛋)

    一.唠唠WebAssembly的发展历程 目前有很多支持WebAssembly的项目,但发展最快的是Blazor,这是一个构建单页面的.NET技术,目前已经从Preview版本升级到了beta版本,微 ...

  2. 《进击吧！Blazor！》系列入门教程 第一章 7.图表

    作者备注 <进击吧!Blazor!>是本人与张善友老师合作的Blazor零基础入门系列视频,此系列能让一个从未接触过Blazor的程序员掌握开发Blazor应用的能力. 视频地址:http ...

  3. 淘汰过时的工具也有错？微软的 Blazor 框架会是下一个 SilverLight？

    整理 | 苏宓 出品 | CSDN(ID:CSDNnews) 在 HTML5 的冲击下,和 Adobe Flash Player 的发展趋势相类似,微软投入十几年时间打造的 Silverlight 最 ...

  4. 《进击吧！Blazor！》系列入门教程 第一章 4.数据交互

    <进击吧!Blazor!>是本人与张善友老师合作的Blazor零基础入门教程视频,此教程能让一个从未接触过Blazor的程序员掌握开发Blazor应用的能力. 视频地址:https://s ...

  5. 《进击吧！Blazor！》系列入门教程 第一章 8.部署

    <进击吧!Blazor!>是本人与张善友老师合作的Blazor零基础入门教程视频,此教程能让一个从未接触过Blazor的程序员掌握开发Blazor应用的能力. 视频地址:https://s ...

  6. 《进击吧！Blazor！》系列入门教程 第一章 3.页面制作

    <进击吧!Blazor!>是本人与张善友老师合作的Blazor零基础入门教程视频,此教程能让一个从未接触过Blazor的程序员掌握开发Blazor应用的能力. 视频地址:https://s ...

  7. 【学术相关】谈谈国自然申请中标的经验

    申报国自然基金技巧 从整体上理解,国家自然科学基金申请书(以下简称申请书)包含了两个系列的内容,一是围绕科学问题.科学假说及研究过程的内容,二是项目实施相关的内容.本文围绕申请书中科学研究的各部分内容 ...

  8. 【经验】刚读硕士怎么感觉学机器学习和深度学习越学越不懂？

    有同学问:研一,在学机器学习和深度学习,为什么感觉越学越不会,怎么解决这个问题? 我搜集了一些意见和建议,供参考. 高赞回答一 作者:曲終人不散丶 来源:知乎 我的研一我记得是先找了一本比较薄的,通俗 ...

  9. 《软技能-代码之外的生存指南》读书笔记

    简介 这本书的作者John Sonmez是个有着健硕肌肉的非典型程序员.十八.九岁就开始投资房地产,当过模特,为在线培训网站录过50多期视频课程.可以访问他的网站Simple Programmer感受 ...

最新文章

  1. 实验三 密码破解技术
  2. 【AI应用】三分钟，带你了解英特尔明年重点发力的这八大方向
  3. 依赖倒置(DIP),控制反转(IoC)与依赖注入(DI)
  4. ibatis多参数的问题
  5. 《伊甸之路》：离“现象级”一步之遥
  6. 记录 之 不同的Normalization方式
  7. 《设计模式其实很简单》
  8. Domain Model：业务对象的进一步设计
  9. 霸气！Power 支持混合云、多云，性能完胜 x86！
  10. Java：转换列表 String 到一个字符串
  11. DCDC电源模块方案 大功率DCDC变换器
  12. uml 流程图符号 含义
  13. 我的世界java版的名字是独一无二吗_2018独一无二霸气网名，二字网名超拽霸气冷酷...
  14. JVM的垃圾回收Serial、Serial Old、Parallel Scavenge、Parallel Old的介绍和STW(Stop The World)
  15. 技术无罪！开发者强烈抗议后，这款被封杀的下载神器恢复了
  16. 算法学习之“Big Oh Notation”
  17. Python中的True和False详解
  18. 关于Cause: java.sql.SQLException: The server time zone value 的解决办法
  19. 用c#实现一个鼠标连点器
  20. 75页政务大数据资源平台建设解决方案（附下载）.pptx

热门文章

  1. 树莓派魔镜MagicMirror —— 2 烧写系统卡
  2. SpringBoot实现音乐网站解析（支持腾讯、网易、小米、酷狗）
  3. Mybatis—动态SQL语句与逆向工程
  4. 树莓派下利用opencv在图片上画汉字点阵（写一句话）
  5. 将时谐电磁场引入工程电磁场的意义_工程电磁场教案-国家精品课华北电力学院崔翔-第4章(倪光正主编教材)...
  6. 案例分析中可能的考点1：招投标程序
  7. CreateFont函数为什么改变不了字体？该怎么解决
  8. 找回XShell保存过的密码
  9. 国外程序员整理机器学习资源大全
  10. 技嘉B85M-D3V主板鼠标失灵的解决办法