(精)可视化搭建
可视化搭建平台最终是为了解决什么问题？
成为一款工业软件，涵盖流程、标准、组件、工具等全链路，解决特定业务的生产问题。
一些待确认的问题
可视化搭建的上限在哪里？
为什么ToC的可视化搭建很难成功？
如何推广？
可以参考华为推广IPD的经验。
2000年我进入华为的时候，耳边就满是IPD的名词，从新员工培训到管理干部会议还有华为公司的各项内部宣传材料，几乎都可以看到这个字眼。那个时候，各个产品的研发从组织架构上已经基本形成了PDT的雏形，各种计划，文档，研发活动也是套IPD里的模式。但是这个时期，IPD在华为公司内还只是个概念，可以毫不夸张地说，除了华为公司成立的IPD项目组（和IBM配合，制定符合华为公司情况的IPD具体流程以及相关模版）里的人，几乎没有人能说清楚IPD到底是怎么回事。那个时候研发流程用的是所谓的IPD1.0，但是IPD的实际效用完全没有发挥出来。大家只是在研发活动的称谓以及重要文档的输出上是按照PDT1.0流程规定照葫芦画瓢。而IPD的核心组决策，IPMT的审议监控等关键措施并没有施行，只是在两个产品线上作试点，摸索实际推行IPD的经验和问题。这个过程持续到了2001年，从2001年开始，华为公司规定，公司内30%的产品线必须严格按照IPD2.0流程运作，其他产品线继续以葫芦画瓢按照这个流程走。到了2002年，华为公司规定，到2002年底，所有产品线必须完全按照PDT2.0的流程运作。此时，支撑PDT流程的相关人事制度，财务制度，以及绩效考核制度等都已建立起来。更关键的是，这个时候，华为公司从高层领导到基层产品研发管理者都对PDT的思想和流程有了比较清晰深入的认识，因此已经具备全面推行PDT的客观条件。我所在的四条产品线既有早起模仿PDT模式运作的，也有正式按照PDT模式运作的。
PDT模式的意义
我个人认为PDT模式的意义有以下几点：
a. 有效整合产品研发相关环节的资源，形成统一团队。
b. 建立严格的产品研发审议监控机制，避免盲目立项，盲目开发。
c. 打通了产品线上个环节，形成产品研发过程中的消息传递通道和机制，形成产品需求以及问题的高效反馈和跟踪机制。
d. 真正形成了市场驱动，产品效益考核的机制。
e. 使得公司能够准确把握成本投入与效益产出。
策略
找公司里面的四个组的组长聊
基金：最具前景的业务
F10：最合适可视化搭建
结果页：失败经验最多
营销平台：前端可视化搭建积累最多
了解外面的四个知道
找个具体业务做试点
满足我们自身的需求
智能短视频
前端中台
一些想法
2021.02.10
tailwind的按需获取、原子化拼接理念
slot实现个性化需求，80%可视化搭建，20%slot实现个性化需求
mixin实现数据共享和性能优化
Facebook的CSS原子化重构案例
刚需需求：把底层暴露出去(继承&重写override：数据是整合，页面是覆盖；Vue API中的覆盖原则)
参考飞冰的模式
物料库是核心
工具库至少能给我们自己用
如果来了紧急需求，我们至少可以自己上，快速搭建搞起来，然后弄几个成功案例，大家自然就会来找我们了。
智能短视频踩过的坑
数据结构的定义耦合度太高
应该采用类似vis.js这种模式，将数据结构，特别是组件部分，做扁平化展开，类似这样：
1 | |
参考资料
Draw.io：
https://github.com/jgraph/drawio
前端 DSL 实践指南：
https://zhuanlan.zhihu.com/p/107947462
可视化拖拽组件库一些技术要点原理分析：
https://juejin.cn/post/6908502083075325959
Vue + Koa从零打造一个H5页面可视化编辑器——Quark-h5：
https://juejin.cn/post/6844903992426758152
美团的移动端UI一致性解决方案：
https://mp.weixin.qq.com/s/oq7ylltdRIdJuSlL7EIiNA
知乎的可视化编辑器的帖子：
https://www.zhihu.com/question/390956688
钉钉的宜搭：
https://zhuanlan.zhihu.com/p/340655660
浙工大一位同学写的Demo：
https://github.com/cqm1994617/page-builder
开源实现-(H5编辑器)H5-Dooring：
https://github.com/MrXujiang/h5-Dooring
(H5编辑器)H5-Dooring是一款功能强大，开源免费的H5可视化页面配置解决方案，致力于提供一套简单方便、专业可靠、无限可能的H5落地页最佳实践。技术栈以react为主， 后台采用nodejs开发.
(精)le5le拓扑可视化组件：
https://github.com/le5le-com/topology/blob/master/README.CN.md
http://topology.le5le.com/workspace?id=5d4d72616025d7704b113242
很不错的帮助文档：https://www.yuque.com/alsmile/topology/uxccq6
开发文档(程序结构说明)：https://le5le-com.github.io/topology/
这个可以用来做方案设计、架构设计等等，可以做规范化、标准化；还可以作为新人培养的辅助工具。
思维导图组件：
https://github.com/ssshooter/mind-elixir-core
数字绘-在线开源的绘图工具：
基于React的开源流程图：
https://github.com/wbkd/react-flow
编程猫：
vue+fabric的开源可视化搭建：
GitHub - nihaojob/vue-fabric-editor: 基于fabric.js和Vue的图片编辑器，可自定义字体、素材、设计模板。
携程 Foxpage 前端低代码框架：
https://zhuanlan.zhihu.com/p/577509706
(精)低代码大屏搭建go-view(Vue3 + TypeScript4 + Vite2 + NaiveUI + ECharts5 + Axios + Pinia2 + PlopJS)：
https://gitee.com/dromara/go-view
(精)满帮的马良(公司的LowCode平台就是基于这个做的)：
https://github.com/ymm-tech/gods-pen
RxEditor：
GitHub - codebdy/rxdrag: Design anything based on HTML, 可视化编辑， 设计一切基于HMTL的东西，模块化设计