基于Vue中后台解决方案越来越多开源了,随着各大互联网企业的Vue UI框架开源和普及后,都又有新的中后台解决方案也开源,方便开发者使用了。下面来作一个主观和客观的对比一下,字节跳动Arco Pro,蚂蚁集团Ant Design Pro,腾讯集团TDesign Starter三大开源中后台解决方案。
一,从star受欢迎度:
蚂蚁集团Ant Design Pro占绝对优势,可能因为是出来早,体量大,后面二个出来比较晚。
二,从兼容Ract,Vue框架来看:
字节跳动Arco Pro,蚂蚁集团Ant Design Pro,腾讯集团TDesign Starter三大开源中后台都支持React和Vue
框架 | 支持React | 支持Vue | TypeScript |
---|---|---|---|
蚂蚁集团Ant Design Pro | 支持 | Vue2 | React +TypeScript/ Vue2 + JavaScript |
字节跳动Arco Pro | 支持 | Vue3 | React+TypeScript / Vue3 + TypeScript |
腾讯集团TDesign Starter | 支持 | Vue2/Vue3 | React+ JavaScript / Vue2 + JavaScript / Vue3 + TypeScript |
三,者的介绍和技术栈
Ant Design Pro
Ant Design Pro 是基于 Ant Design 和 umi 的封装的一整套企业级中后台前端/设计解决方案,致力于在设计规范和基础组件的基础上,继续向上构建,提炼出典型模板/业务组件/配套设计资源,进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验。随着『设计者』的不断反馈,我们将持续迭代,逐步沉淀和总结出更多设计模式和相应的代码实现,阐述中后台产品模板/组件/业务场景的最佳实践,也十分期待你的参与和共建。
特点:
TypeScript: 应用程序级 JavaScript 的语言
区块: 通过区块模板快速构建页面
优雅美观:基于 Ant Design 体系精心设计
常见设计模式:提炼自中后台应用的典型页面和场景
最新技术栈:使用 React/umi/dva/antd 等前端前沿技术开发
响应式:针对不同屏幕大小设计
主题:可配置的主题满足多样化的品牌诉求
国际化:内建业界通用的国际化方案
⚙️ 最佳实践:良好的工程实践助您持续产出高质量代码
Mock 数据:实用的本地数据调试方案
✅ UI 测试:自动化测试保障前端产品质量
Arco Design Pro
基于 Arco Design React/Vue 组件库的开箱即用的中后台前端解决方案。Admin 中后台管理页面,创新的多架构方案。
特点:
演示地址:https://www.uihtm.com/vue/18838.html
截图:
TDesign Starter
TDesign Vue Starter 是一个基于 tdesign-vue,使用 Vue2、Vite开发,可进行个性化主题配置,旨在提供项目开箱即用的、配置式的中后台项目。
演示:https://www.uihtm.com/vue/18820.html
截图:
四,使用难度及Bug对比
从上手安装和框架使用上来对比,Ant Design Pro是基于蚂蚁的umi框架来构建的有很多配置需要先学习umi,运行开发构建比较慢,组件太多,上手熟悉难度大。而TDesign Starter和Arco Design Pro都是vite要构建上手比较快,内部组件和框架比较清晰适应中小企业使用。Bug方面,TDesign Starter和Arco Design Pro都是后面出来,bug比较少,Ant Design Pro有小bug。
五,维护升级
Ant Design Pro,TDesign Starter,Arco Design Pro 三者升级更新都比较快,由大企业维护。
总结:个人从设计UI上来说比较喜欢字节跳动Arco Design Pro 比较小清新,在技术栈方面ts+vue3+vite也是主流框架,容易上手和长期维护。
最后附上github地址:
Arco Design Pro :https://github.com/arco-design/arco-design-pro-vue
Ant Design Pro(Vue):https://github.com/vueComponent/ant-design-vue-pro
TDesign Starter:https://github.com/Tencent/tdesign-vue-next-starter