在我们团队的开发历程中,C# 和 .NET 框架一直是我们的主力语言,伴随我们走过了无数个项目。当微软推出 Blazor 这一革命性的框架时,我们对其充满了期待。Blazor 以其优良的架构和微软的强大背书,似乎预示着前端开发的新纪元。我们希望借助 Blazor 的优势,快速构建与后台服务配套的前端应用。然而,随着开发的深入,我们发现这条路并不如预期顺利,最终不得不放弃 Blazor,转而使用其他 Web 技术。本文将分享我们的经历,希望能为其他团队提供参考。

1. 初识 Blazor 全栈 UI:满怀期待

Blazor 的出现,让我们看到了使用 C# 进行前端开发的可能性。对于习惯了 .NET 环境的开发者来说,这无疑是个好消息。我们可以在不切换语言的情况下,编写前端代码,提升了开发效率和代码一致性。

Blazor 全栈 UI 的技术架构优势明显:

  1. 统一的开发体验:开发者可以使用相同的 C# 代码和 Razor 组件在 Blazor Server 和 Blazor WebAssembly 之间进行无缝切换,简化了多种应用类型的开发流程。
  2. 灵活的应用架构:Blazor Web App 可以根据具体需求灵活选择 Blazor Server 或 Blazor WebAssembly。
    • Blazor Server 通过 SignalR 技术提供服务端和客户端的实时数据传输,和较快的初始加载时间。
    • 而 Blazor WebAssembly 可以在浏览器中高效运行,允许用户离线使用,减少服务器负担,提高用户的交互体验。
    • 支持灵活地选择 Server 还是 WASM 进行渲染,可以针对整个应用程序、某个页面或控件设置渲染模式。
    • 可以将 Server 搭建为 Backend-for-Frontend,写后台接口访问数据库。WASM 搭建为 Frontend,编写布局和页面。达到前后端分离,前端的页面元素渲染和交互不再依赖后端,只有调用 API 获取数据需要后端。
  3. 增强的性能:.NET 8 中的 Blazor 具有更好的性能优化,包括更快的组件渲染和数据传输,提升了用户体验。通过加强导航(Enhanced Navigation)功能,使用户在交互和导航时感觉在浏览 SPA 网站。
  4. 利用渲染树构建组件:提供了 ChildContent、ChildFragment 来灵活地自定义控件元素的样式和行为,支持通过模板重写控件内部的元素。
  5. 用户身份和权限认证:利用 Identity 无缝便捷地集成用户验证和权限控制,支持对某个页面、控件、Controller,API 设置访问权限。WASM 应用缓存了属于客户端的数据,无需在服务端维护,例如用户身份信息、登录状态等等。
  6. 熟悉的开发工具:Visual Studio 和其他 IDE 对 Blazor Web App 的友好支持,提供更好的调试体验和开发效率。

2. 遭遇挑战:理想与现实的差距

然而,理想很丰满,现实却很骨感。在项目推进过程中,我们逐渐感受到 Blazor 的局限性。以下是我们遇到的一些主要问题:

  1. UI 组件库有限:相比于 React、Vue 等成熟框架,虽然 Blazor 社区在不断发展,但现有的 UI 组件库仍然相对较少。并且,面对某些复杂的前端效果,我们发现 Blazor 难以将不同组件库中的组件融合在一起使用,库之间很难做到样式和操作的统一,这严重影响了我们的开发效率。
  2. 前端效果难以实现:Blazor 在处理某些前端效果时显得力不从心。由于其运行机制的特殊性,一些在其他框架中轻松实现的动画、交互效果,在 Blazor 中却需要绕过各种限制,利用 JS 互操作来完成。这不仅降低了开发效率,也影响了用户体验。
  3. 社区支持不足:一个框架的生态环境对于其发展至关重要。我们发现,当遇到问题时,几乎无法在社区中找到解决方案。一些无法通过官方文档解决的疑问,StackOverflow 或 GitHub 上的相关帖子寥寥无几。这使得我们在排查和解决问题时陷入困境。

3. 展望未来:Blazor 的前景并不明朗

  1. 缺乏实际应用案例:尽管 Blazor 在技术上有许多优点并受到微软的支持,但目前为止,使用 Blazor 搭建网站的知名企业、公司或组织仍然相对稀少。这使得潜在用户对其稳定性和长期可维护性产生疑虑。
  2. 微软的转向:更让人担忧的是,微软似乎不再为 Blazor 投入足够的资源。近年来,微软的重心逐渐转移到人工智能(AI)领域,对 Blazor 的更新和支持力度明显下降。这让 Blazor 的未来充满了不确定性。

4. 做出抉择:从 Blazor 回到 Vue

经过一段时间的开发,我们团队意识到,Blazor 可能并不适合我们未来的产品路线。尽管我们喜欢用 C# 开发,但在 Web 开发领域,其他技术栈在组件丰富性、社区支持和生态系统上显然更具优势。

综合以上因素,我们不得不做出艰难的决定:

  • 停止在新产品中使用 Blazor:为了项目的长期发展,我们决定在下一个产品中放弃使用 Blazor。
  • 重构现有产品的前端部分:对于已经使用 Blazor 的产品,我们计划在第二个版本中重构前端,改用更成熟的 Web 技术,如 Vue。

这一决策虽然艰难,但也是我们经过深思熟虑后的选择。

5. 反思与建议:Blazor 的适用场景

通过这次经历,我们发现选用 Blazor 可以从以下几点因素去考量:

  1. 团队规模:Blazor 更适合单兵作战的开发者,或 2 至 4 人的小团队。这些开发者通常具有较强的 C# 和 .NET 背景,能够快速上手,学习 Blazor 的负担相对其他非 .NET 背景的开发者要小很多,可以利用现有的 .NET 技能快速构建和部署小型项目。
  2. 应用类型:Blazor 非常适合用于构建功能相对简单的标准管理系统,比如内部管理工具,进行数据录入、生成报告、利用仪表盘和报表进行数据展示。这些应用通常不需要复杂的前端交互,且需求相对稳定,可以利用 Blazor 的组件化特性快速搭建。
  3. 产品演化:Blazor 更适合那些在开发初期对功能和用户界面需求有明确设定的产品。这种情况下,可以在产品发布后无需过多的担心产品后期的接手和维护问题。减少产品变更和迭代所带来的维护成本。

6. 结语

在这个快速发展的技术世界里,选择一个合适的开发框架至关重要。Blazor 的理念值得肯定,但在当前阶段,可能还不适合用于大型商业项目。我们的经验教训也提醒着其他团队,在技术选择上要更加谨慎和前瞻。

未来,我们仍会关注 Blazor 的发展,但在那之前,我们将选择更适合当前需求的技术方案。尽管我们与 Blazor 的旅程暂告一段落,但这段经历将成为我们继续探索和学习的宝贵财富。

Disclaimer 声明:本文由 AI 辅助完成撰写

从入门到放弃,我们为何从 Blazor 回到 Vue的更多相关文章

  1. VUE从入门到放弃(项目全流程)————VUE

    VUE从入门到放弃(第一天)--整体流程 先想想一个项目,vue项目是从什么到什么,然后再什么的?那是什么呢? 搭建 ( vue-cli) 代码内容 运行 封装 成品 一.搭建(脚手架vue-cli) ...

  2. CYQ.Data 从入门到放弃ORM系列:开篇:自动化框架编程思维

    前言: 随着CYQ.Data 开始回归免费使用之后,发现用户的情绪越来越激动,为了保持这持续的激动性,让我有了开源的念头. 同时,由于框架经过这5-6年来的不断演进,以前发的早期教程已经太落后了,包括 ...

  3. [精品书单] C#/.NET 学习之路——从入门到放弃

    C#/.NET 学习之路--从入门到放弃 此系列只包含 C#/CLR 学习,不包含应用框架(ASP.NET , WPF , WCF 等)及架构设计学习书籍和资料. C# 入门 <C# 本质论&g ...

  4. OpenStack从入门到放弃

    OpenStack从入门到放弃 目录: 为何选择云计算/云计算之前遇到的问题 什么是云计算 云服务模式 云应用形式 传统应用与云感知应用 openstack及其相关组件介绍 flat/vlan/gre ...

  5. 绕过校园网的共享限制 win10搭建VPN服务器实现--从入门到放弃

    一.开篇立论= =.. 上次说到博主在电脑上搭建了代理服务器来绕过天翼客户端的共享限制,然而经过实际测试还不够完美,所以本着生命不息,折腾不止的精神,我又开始研究搭建vpn服务器= =... (上次的 ...

  6. 《区块链:从入门到放弃》之obc安装步骤

    obc安装步骤 朋友们可能会好奇,厨师不研究菜谱怎么改研究兵法了,哈哈,我原本是app出身,最近被安排去预研区块链和比特币技术,2个月下来,颇有斩获.期间得到IBM的CC同学指导我一步一步安装obc的 ...

  7. win10搭建代理服务器实现绕过校园网的共享限制--从入门到放弃

    博主所在学校特别坑爹,校园网被电信一家垄断了,而且最恶心的还是电信要求一条网线只能供一台电脑上网,不许接路由器共享网络= =- (还有电信2M价格是380+每年,20m是500每年,而且网速都很慢= ...

  8. WPF从入门到放弃系列第二章 XAML

    本文是作者学习WPF从入门到放弃过程中的一些总结,主要内容都是对学习过程中拜读的文章的整理归纳. 参考资料 XAML 概述 (WPF):https://msdn.microsoft.com/zh-cn ...

  9. Android -- 带你从源码角度领悟Dagger2入门到放弃

    1,以前的博客也写了两篇关于Dagger2,但是感觉自己使用的时候还是云里雾里的,更不谈各位来看博客的同学了,所以今天打算和大家再一次的入坑试试,最后一次了,保证最后一次了. 2,接入项目 在项目的G ...

  10. Android -- 带你从源码角度领悟Dagger2入门到放弃(二)

    1,接着我们上一篇继续介绍,在上一篇我们介绍了简单的@Inject和@Component的结合使用,现在我们继续以老师和学生的例子,我们知道学生上课的时候都会有书籍来辅助听课,先来看看我们之前的Stu ...

随机推荐

  1. 最短小精悍的js数组打乱顺序

          let number = [1, 45, 13, 17];       // 封装一个打乱数组的方法       function getarr(arr) {         return ...

  2. 恶补基础知识:Java 栈与队列详解

    @ 目录 前言 简介 栈 Java实现栈的示例代码: 栈的主要应用场景包括: 队列 Java实现队列的示例代码: LinkedList中的add方法和offer方法的区别 队列主要应用场景: 总结 前 ...

  3. spring声明事务失效问题

    问题:      在项目开发中遇到了一个spring事务失效的问题,检查配置文档,都没有问题,其他的类中的方法都能进行事务管理,而这个类中的方法却不行. 分析      查看代码发现三个问题: 原因1 ...

  4. freertos学习笔记(十)事件标志组

    事件标志组 相当于用户平时定义的Flag,事件标志,不过freertos支持将该标志组作为启动task的条件 概述 分为8位和24位的模式(通过设置宏来配置) 每一位有0和1两个状态 用法 用于平常程 ...

  5. Linux 磁盘分区和格式化

    分区 常用命令行工具: fdisk:适用于 MBR 分区表 gdisk:适用于 GPT 分区表 parted:适用于 MBR 和 GPT 分区表,功能更强大.它还有一个 GUI 版本,名为 gpart ...

  6. C 语言多文件编译

    C 语言中的多文件编程通常涉及将代码分散在几个不同的源文件(.c 文件)和头文件(.h 文件)中.这么做可以帮助你组织大型项目,提高代码的重用性,便于团队合作,分离接口和实现,以及加快编译时间.下面是 ...

  7. 【爬虫实战】——利用bs4和正则表达式,简单实现爬取数据

    前言 好久没有写博客了,由于一直比较忙,感觉快荒废了学习的步伐,最近由于需要利用爬虫爬取数据,总结一下,以便以后查阅. 目录 一.bs4的安装 二.bs4解析器 三.定位查找标签 四.转换格式 五.提 ...

  8. 理解async 和 await

    await 后面接的是promise,await语句下面(注意:不是await后面,而是await所在语句的下面,即下行以后)的代码就相当在promise.then()里面执行,有文章说 await后 ...

  9. JVM学习第二篇思考:一个Java代码是怎么运行起来的-下篇

    JVM学习第二篇思考:一个Java代码是怎么运行起来的-下篇 在上一篇<JVM学习第一篇思考:一个Java代码是怎么运行起来的-上篇>中咱们知道类一个Java类的生命周期需要经历以下七个阶 ...

  10. Java并非锁之独占非公平锁理解

    Java锁系列教程之独占式锁 在Java并发编程中,锁是一个很重要的对象.Java中锁有两种:隐式锁和显式锁.使用synchronized关键字的锁是隐式锁.因为锁的申请和释放都是由JVM来维护的,不 ...