外贸网站源码免费,大庆市城乡建设局网站,临沂市建设官方网站,天津网站建设哪家权威转载技术社区中一位朋友最新的文章#xff0c;介绍自己为公司的 WebForm 遗留系统使用 Blazor 重写前端 UI 的经历。前言啊#xff0c;又好久没写文章了#xff0c;这一年一直在接触新的领域#xff0c;扩展了一下技术面#xff0c;学了很多新东西。前阵子发现公司内部有个… 转载技术社区中一位朋友最新的文章介绍自己为公司的 WebForm 遗留系统使用 Blazor 重写前端 UI 的经历。前言啊又好久没写文章了这一年一直在接触新的领域扩展了一下技术面学了很多新东西。前阵子发现公司内部有个后台管理系统因为历史悠久还是Webform做的不管是UI风格还是代码设计都已经落后于时代。因为项目陈旧所以后续新增或修改功能的人也往往抱着多一事不如少一事的心态添加各种“补丁”。久而久之后来的人不再乐意维护这样的系统而落后于时代的UI风格也让使用者觉得整个系统看上去很“Low”对接触过市面上第三方后台系统的公司管理者来说自家的后台系统更显得老气横秋需要一次“新生”。当大家对一个系统都产生不满的时候就可以考虑重构或者重写它了。这一切的开始自然是考虑技术选型。最初我考虑使用比较常见的前后端分离模式后端自然是使用ASP.NET Core EF Core前端使用公司内部已经比较成熟的基于Ant-Design-Vue封装的组件模板。但是这样的缺陷也很明显那就是遇到迭代需求要么需要前端的人员参与要么后端人员起码要熟练运用JavaScript和模板。而后台管理系统的功能迭代往往来得比较突兀一方面需求方是内部的使用者使用频率不固定另一方面每一次的迭代其实对内来说并没有产生运营价值。因此对后台管理系统的要求是尽可能单人就能较快的完成前后端工作。那么有读者可能会嘲笑了干嘛非要前后端分离后台直接ASP .NET Core MVC后端渲染好了嘛当然可以。不过一方面是考虑到MVC组件化开发我们没有什么实践经验另一方面是后台系统的页面既可能出现非常多的元素又要简洁易用前后端分离可以将后端变得非常轻量基本只需CRUD而由前端分担偏重的逻辑。如果回到后端渲染的模式那么很可能过了几年之后又变成了今天Webform的情况例如一个复杂页面在后端Page对象里写了一大堆的变量来维护页面控件的状态……现在问题变成了有没有一个Web UI框架可以很好地和ASP.NET Core后端搭配呢我的目光自然放到了年轻的Blazor身上。Blazor发行才两年最初我并没有重视它。当然最大的原因是彼时我未有与之关联的实际需求另外也包括——最早Blazor只发行了Blazor ServerClient Side姗姗来迟以至于我误认为尚处于“全民测试阶段”鉴于Webform、MVC以及曾经的Silverlight我对Blazor在前端领域的发展缺乏信心Blazor WebAssembly是基于WebAssembly的UI框架先行者最先吃螃蟹的人往往也会因为过于超前的理念最终走向沉寂Blazor还太年轻生态沉淀远不如前端三大框架但现在是2021年了当我真正尝试了解它时它带给了我非常大的——惊喜。同时Blazor开源社区也给了我很大的帮助。最大的助力来自于我前同事 JamesYeung 的开源项目Ant Design Blazor 。在我花了两个星期的时间写出旧系统部分页面的demo之后我深感以前自己对Blazor太缺乏了解和信任。我觉得有必要将我曾经的误解以及现在的心得体会写入“DotNet应用”系列文章以供读者参考和交流。什么是Blazor官方文档已经将Blazor应用放在了“C位”。由于官方文档的介绍十分贴切这里请容许我原封不动地搬运过来Blazor 是一个使用 .NET 生成交互式客户端 Web UI 的框架使用 C# 代替 JavaScript 来创建信息丰富的交互式 UI。共享使用 .NET 编写的服务器端和客户端应用逻辑。将 UI 呈现为 HTML 和 CSS以支持众多浏览器其中包括移动浏览器。与新式托管平台如 Docker集成。第一个就是“我”——Blazor简而言之.NET开发者可以用C#来写单独的前端了。那么Blazor是一蹴而就的吗显然非也。Blazor的诞生受益于Web Assembly和近些年.NET Core技术的发展Blazor使用的Razor语法则是在MVC时代就已经发布的标记语法Blazor的组件开发思想则早已在前端成为主流的开发模式……总而言之Blazor既是一个基于Web Assembly、走在技术前沿的Web UI框架也是一个借鉴和总结了以往成熟开发经验的框架。Blazor和前端三大框架的关系说到Blazor必然会有人拿它跟现有广泛应用的前端三大JS框架React/Vue/Angular对比我也阐述一下个人观点。首先Blazor在框架设计上并没有闭门造车。在使用Blazor的过程中可以充分感受到Blazor和当前主流前端技术的联系组件式开发的范式推荐以组件的形式作为页面基本的UI元素在html模板中部分C#关键词充当了类似“指令”的角色。例如if和ng-if, for和vue-for等等html/css/code(JS/C#)的分离和组合。Blazor里每个页面既可以拆分成MyPage.razorhtml模板文件,MyPage.razor.csC#代码文件和MyPage.razor.css样式文件三部分也可以将三者统一写到MyPage.razor文件里。依赖注入。有过Angular开发经验的开发者应该会对此深有体会。其次Blazor保留了C#和JS之间的互操作性。也就是说Blazor既理所当然地利用了.NET现有的生态也兼容更加繁荣的JS生态。这样开放的思路给了Blazor开源社区非常大的发展空间比如很多早先由原生JS编写的图表开源项目可以以相对较低的成本迁移到Blazor上来又比如可以使用Blazor封装三大框架已有的组件或者原生组件播放器等。因此Blazor和前端三大框架之间的确有相当一部分的功能其实可以互相取代。然而Blazor的目的不是为了取代三大框架从现状来看甚至连竞争的地位都谈不上。Blazor能吸引的最主要人群是.NET开发者它给了开发者完全以C#作为主要语言实现全栈开发的机会。尤其是前后端可以共享包含数据类型和逻辑模块的C#代码这一优势只有C#全栈开发者才能深切体会到。例如对于后端出身的C#开发者在前后端分离的环境下以往更偏爱设计模式上与后端更相近的Angular如今Blazor已逐渐成熟可以“横刀夺爱”了。如上所说Blazor并不能让三大框架的绝大多数JS开发者产生兴趣更无法与当下繁荣的JS生态竞争。另外在IE及其他一些老旧版本的浏览器仍未被完全淘汰的当下为了保证页面的普适和兼容Blazor自然不会被大部分人看重。但作为基于Web Assembly的前端框架它依然还是特别的wasm的普及和发展一定会利及Blazor使其在未来有更大的发展空间。这里举一个即将实现的例子由于wasm可以在非Web环境下运行那么Blazor将来也可以用于开发运行在非Web环境下的UI程序这在官方的计划中已经提及——Blazor Web Assembly MAUI。Blazor会是另一个Silverlight吗这可能是一部分人最关心的问题。微软曾经发布了不少“愿景很好”的技术栈但最终有一部分随着时代走向了沉寂。如今稚嫩的Blazor是否能走出一条康庄大道还是说会成为另一个Silverlight过些年之后就变成了历史如前言所说我恰是从这样的疑虑走出来的。现在我将个人的判断写在这里以供读者参考在可预期的未来Blazor将是微软主打的Web UI框架Blazor完全借鉴和遵循当下前端流行的设计模式和思想没有闭门造车Blazor开源社区的活跃度在逐步提高除了组件库之外还有越来越多的功能库Blazor的根基在于Web Assemblywasm将是未来浏览器的核心规范它更高效更安全更开放且更标准无版本特性可测试、向后兼容Blazor在性能、可靠和开发效率上是一流的框架。而近期在.NET 6到来后AOT和Hot Reload将进一步提升Blazor程序的运行性能和开发体验鉴于前后端分离的流行程度以及wasm的发展空间我个人的结论是Blazor不会成为另一个Silverlight。相反地它更可能成为.NET生态在前端开发领域的大本营。为什么要用Blazor做后台首先要明确这个问题主要针对的是.NET技术栈的公司或个人。从技术选择的角度来说我认为前后端分离自然地隔离了逻辑和表现对日后的维护更加友好。以前对.NET技术栈的公司来说前后端分离需要开发者掌握C#和JS同时数据类型和逻辑模块经常会出现两种语言上的重复这些对自用的后台来说都是不必要的成本现在使用Blazor已经解决了这个问题。而且公司内部的后台通常不需要兼容老旧浏览器恰恰避开了wasm的业务弱项反倒为其更好的性能表现提供了舞台。从设计需求的角度来说我个人总结了后台系统页面的特点基于Blazor开源组件项目可以天然地满足简洁。页面不过分追求华丽以清晰的布局为重一致。所有页面呈现的UI风格应当一致效率。尽可能复用组件和代码搭建页面实现快速迭代平衡。既易于使用又尽可能防止敏感数据误操作及时。有较好的页面加载速度对等待操作有清楚及时的反馈总而言之我的结论就是Blazor应当是.NET公司开发或重写内部后台系统的首选框架结语当然个人肤浅之见难免会有读者质疑。在接下来的系列文章里我将逐步介绍Blazor组件、Ant-Design-Blazor开源组件以及做一个demo项目的过程、心得和一些重要细节。希望这个系列能够让更多的.NET开发者丰富对Blazor的认识降低学习Blazor的门槛让有类似需求的开发者们能够打消疑虑增加应用Blazor的信心融入Blazor的开源社区和发展事业祝事业顺利让我们下一篇文章再会
