AntV和AntD之间的区别与联系

前言:最近在调研前端的一些框架,技术栈主要是用react,所以找到了2个十分相似解决方案,拿来对比一下(antd和antv都是基于react)

antd对比 antv

## antd ## antv
解决方案 企业级 UI 设计语言 数据可视化解决方案
提供一些常用的组件,button,bar,table等 提供图表,例如G6关系图,X6流程图等
官网 Ant Design - 一套企业级 UI 设计语言和 React 组件库 https://antv.antgroup.com/
衍生框架 antd pro(antd+umi) Ant Design Pro 是基于 Ant Design 和 umi 的封装的一整套企业级中后台前端/设计解决方案 图片来源:https://ant-design-charts.antgroup.com/manual/introduction

由于我的需求中有画流程图的需求,所以antV中的X6刚好可以画流程图,继续深入了解antV/X6框架,发现XFlow框架继续封装了X6,可以更加方便的画出流程图

XFlow框架基于antv/X6,XFlow专注于DAG、ER图和流程图

antv/Xflow antd antv/x6
版本 1.x和2.0 4.x和5.x 1.x和2.x
官网 XFlow - 图编辑应用 - XFlow https://github.com/antvis/XFlow 介绍 - Ant Design https://x6.antv.antgroup.com/ https://github.com/antvis/x6
用途 主要用于绘制ER图、DAG图和流程图 基本的UI和组件 X6 是基于 HTML 和 SVG 的图编辑引擎,提供低成本的定制能力和开箱即用的内置扩展,方便我们快速搭建 DAG 图、ER 图、流程图、血缘图等应用。
活跃度 1.0版本放弃了 2.0正在更新但是没有文档 跟新慢,活跃度低(9个issue) 长期更新,社区活跃度高(900+issue) 长期更新,社区活跃度高(200+issue)

版本兼容

Xflow2.0与antd5.x、react18.x都兼容(都是latest),但是没有文档和api,所以不知道怎么用

Xflow1.x可以适配于antd4.x、react17.x,能跑简单的demo,但是以后不维护了

Xflow1.x使用起来非常麻烦,而且有各种版本冲突,2.0目前官网没有文档

总结:解决方案有2点

  • 等xflow2.0更新文档

  • 学习antv/X6,直接用X6开发

相关推荐
小码哥_常2 小时前
一套自己部署的 IM,客户端是同一份 Flutter
前端·后端
蜗牛攻城狮4 小时前
微前端四大方案选型对比与最佳实践:qiankun、micro-app、wujie、Module Federation
前端·微前端·qiankun·前端架构·micro-app·wujie
她说可以呀6 小时前
Vue插槽
前端·javascript·vue.js
qq_448011166 小时前
Vue + Jinja2两套模版与法冲突造成undefinedError
前端·javascript·vue.js
aixingpan6 小时前
aixingpan.cn API开发文档:前端查询夏令时和时区接口指南
前端·php
2601_958352907 小时前
23.5×19mm 换掉一整条音频链?|A-68 集成了什么:ADC / DAC / 24.576MHz 时钟 / AEC / 波束降噪,主控仅需 6 根线
前端·音视频·ai降噪·回声消除·语音模块
志尊宝7 小时前
AI原生前端开发(039):AI辅助的Nuxt 4全栈开发
前端·vue.js·ai-native
FRing038 小时前
JavaScript入门到精通三十二(深拷贝、浅拷贝、递归函数)
开发语言·前端·javascript
excel8 小时前
双 Token 与前端使用 Crypto 公私钥鉴权换 Token,哪种方案更好?
前端·后端
外收内放9 小时前
Python基础语法练习题(73)
java·前端·python