低代码（三）低代码平台前端技术组件选型1.0(前端)-Toy模板网

这篇具有很好参考价值的文章主要介绍了低代码（三）低代码平台前端技术组件选型1.0(前端)。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

目前国内主流的低代码开发平台有：金蝶、用友、宜搭、云程、简道云、明道云、氚云、伙伴云、道一云、JEPaaS、华炎魔方、搭搭云、JeecgBoot 、RuoYi等。这些平台各有优劣势，定位也不同，用户可以根据自己需求选择。如果企业想自主可控，从零开发一个低代码平台，如何技术选型呢？

氢原平台是我带领团队花3年打造的低代码平台，所以该系列文档里面会大量出现该名字，不重复解释了。

流程引擎选型
市场上比较有名的开源流程引擎有osworkflow、jbpm、activiti、flowable、camunda。其中：Jbpm4、Activiti、Flowable、camunda四个框架同宗同源，祖先都是Jbpm4，氢原平台流畅引擎选型Flowable6.5
流程设计器器选型
对于低代码平台中的流程可视化，流程设计器是重要的支撑工具，目前市场上比较主流的流程设计器有bpmn-js、mxGraph、Activiti-Modeler、flowable-modeler、easy-flow、bpmn2-modeler插件等。氢原平台选型是bpmn-js+自行扩展。
低代码设计器选型
阿里的低代码设计器Low-Code Engine，百度低代码amis，国外的低代码Appsmith，这些设计器都是基于react技术实现，vue的开源而且优秀的设计器并不多，氢原低代码设计器选型是阿里low-code engine+自行扩展。注：（阿里low-code engine 加载比较慢，而且源码比较复杂，一般团队驾驭不了）
表单设计器选型
市场上有比较多的开源项目比如：form-generator 是基于Element UI表单设计器，vue-form-making基于 vue 和 element-ui 实现的可视化表单设计器，但相对于阿里设计器都有一定差距，就需要根据阿里设计器来进行扩展，但需要进行大量的改造才能做到企业级可用。
前端技术选型
vue采用vue2.0，vue3.0,vue2.0是一些历史债务，新开发的项目采用的vue3.0，react 采用 react18.1，微前端框架采用qiankun、MicroApp。qiankun和MicroApp都各有优劣，氢原平台分应用开发态和应用运行态，应用开发态用的MicroApp，原因是MicroApp的集成更加简单，WebComponent思想更能适合复杂应用的集成和复用。应用运行态采用的qiankun，原因是因为阿里设计器打造的应用采用qiankun性能更佳。
可视化图表选型
• echart 一个基于 JavaScript 的老牌开源可视化图表库
• D3.js 一个数据驱动的可视化库, 可以不需要其他任何框架独立运行在现代浏览器中，它结合强大的可视化组件来驱动 DOM 操作
• antv 包含一套完整的可视化组件体系
• Chart.js 基于 HTML5 的简单易用的 JavaScript 图表库
• metrics-graphics 建立在D3之上的可视化库, 针对可视化和布置时间序列数据进行了优化
• C3.js 通过包装构造整个图表所需的代码，使生成基于D3的图表变得容易
氢原平台因为要考虑各类业务场景，采用echart+d3+antv的方式来实现可视化开发。
前端ui框架选型
Vue2.0控件库选型ivew**（历史项目）**，vue3.0控件库选型为ant Design，react控件库选型ant Design, Ant Design 作为一门设计语言面世，经历过多年的迭代和积累，它对 UI 的设计思想已经成为一套事实标准，受到众多前端开发者及企业的追捧和喜爱。
less css管理工具
Less 是一门 CSS 预处理语言，它扩展了 CSS 语言，增加了变量、Mixin、函数等特性，使 CSS 更易维护和扩展。Less 可以运行在 Node 或浏览器端。