盘点2023年国内大厂的前端组件库,opentiny好用吗,能否一战

本文盘点2023年国内大厂如华为、腾讯、阿里和字节跳动的前端组件库,包括OpenTiny、DevUI、TDesign、Ant Design、Element UI、Arco和semi design。各组件库的技术栈、平台支持和特点进行了分析,助你选择合适的UI解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

盘点2023年国内大厂的前端组件库,opentiny好用吗,能否一战

前言

一转眼已经是2023年了,作为前端开发工程师,我们一起盘点一下各个大厂使用的前端UI组件库吧。

华为云

OpenTiny

OpenTiny是华为云云岭团队最新开源的前端品牌,提供跨端、跨框架、跨版本的UI组件库、开箱即用的管理系统模板和覆盖前端开发全流程的CLI工具,帮助开发者高效搭建Web应用。

可以看到 opentiny 提供了 TinyVue 和 TinyNG 两套UI组件库,分别对应了 Vue 和 Angular 两套技术栈,属于华为云出品的企业级设计体系,如果有用过华为云的小伙伴应该会比较熟悉,它的控制台页面就是使用的这套设计体系的组件库搭建的。

Vue 想必大家都很熟悉,不过国内的 Angular 技术栈的组件库确实很少见。

DevUI

DevUI是华为云DevUI团队出品的一套组件库系列,属于比较早开源的一批组件库,主打Angular技术栈的UI组件库,通过开源建设也形成了Vue和React技术栈的组件库。

DevUI适用于企业级中后台项目,设计风格和OpenTiny比较相似,应该都是出自同一套规范。

腾讯

TDesign

TDesign是腾讯出品的企业级设计体系,支持Vue和React技术栈,同时还支持微信小程序和QQ小程序,也算是腾讯系的一大特色。

阿里

Ant Design

蚂蚁大名鼎鼎的Antd,应该是很多React初学者和开发者一定用过的一套组件库,有着丰富的组件、完善的文档和演示,可以通过其组件的设计学到很多React编码思想。

通过社区合作,Antd也推出了Vue版本和Angular版本,也是国内除了华为外少有的Angular组件库。

Antd的设计风格保持了简洁、清新的风格,在5.0版本之后更是获得更加灵活地定制能力,API设计也更加简洁,总之是一款非常值得使用的组件库。

Element UI

来自饿了么团队提供的一套 Vue 组件库,属于我学Vue的启蒙 UI 组件库了,在饿了么被阿里收购后,也算作阿里的一套组件库了,在Vue领域内也是一个影响力十分深远的UI组件库,仔细阅读其API,发现竟然和Antd有异曲同工之妙。

如果你的项目是基于Vue,不妨考虑一下Element UI。

字节

Arco

字节的中后台UI组件库,基本是字节自己的业务投在用,设计风格很现代,API很友好。整体体验下来React技术栈的组件库更完善一点,Vue次之。也是款很不错的前端UI组件库,有兴趣可以尝试一下。

semi design

抖音前端团队推出的基于React技术栈的组件库,非常年轻化的设计,整个组件库显得生动活泼。组件文档丰富且细致,提供了设计文档和用法的说明,组件的demo还提供了可实时编辑代码的能力。该组件库在抖音和字节内部也被用在了很多项目上。

总结

目前各大厂的组件库都趋于完善,常用的组件、国际化、图标、主题配置等能力都基本具备,更多的差异点在于各自组件库与自身业务的结合,例如华为云的组件库更多侧重于Angular技术栈,因为其内部众多云服务的页面使用了Angular技术栈开发,而腾讯的组件库提供了微信小程序和QQ小程序的版本,阿里和字节更是在技术上不断地深入探索,并且有着自己鲜明的特点。了解和使用大厂的组件库,一方面可以简化我们的开发工作,另一方面也能学到组件的API设计思想,从而在未来的业务代码开放中培养一个更好的设计思维。

PS: 本文只是简单盘点了一下当前各大厂的前端组件库,如果有遗漏欢迎在评论区补充。

联系我们

如果有对 OpenTiny 的开源项目感兴趣,欢迎添加小助手微信:opentiny-official,拉你进群,一起交流前端技术,一起玩开源。

OpenTiny 官网:https://opentiny.design/

OpenTiny 代码仓库:https://github.com/opentiny/

Vue 组件库:https://github.com/opentiny/tiny-vue(欢迎 Star 🌟)

Angular 组件库:https://github.com/opentiny/ng(欢迎 Star 🌟)

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值