组件化 可视化 性能优化 Reason
一、组件和抽象
(1)组件是一种编程抽象,目的是复用
(2)通用型组件、业务型组件
(3)《程序员修炼之道》、DRY原则(dont`t repeat yourself)、《重构》改善已有代码设计、
(4)三次原则
二、组件库设计原则
《敏捷软件开发》原则、模式与实践
1.内聚性 粒度
2.耦合性 稳定
( 高内聚低耦合)
粒度
1.共同复用原则 SRP单一职责原则
2.公用封闭原则(一个组件不应该包含多个引起它变化的原因)
一个组件不应该引用另一组件?
依赖的弊端
1.耦合=》高维护成本+不稳定性
2.代码的可维护性大于复用性
稳定
1.稳定依赖原则
X、Y、Z=》A
H=》B
M、N=《C
稳定性:A>B>C
2.稳定抽象原则
三、父子组件如何依赖?
1.子组件的初始化和调用由父组件容器负责
2.约定大于配置原则
四、设计禁区
越界操作
副作用
侵入性
环形依赖
属性繁多
五、设计规范先行
1.统一视觉样式:色彩、布局、字体、图标
统一交互动效:时长缓动、移动路径、形变编排
(参考网站:Material Design)
2.样式分离:需求:主题定制、样式差异化
3.辅助平台/工具:脚手架、文档、示例、迭代
六、组件库工程化最佳实践
多包管理工具:Lerna 多包管理工具
优点:一键安装依赖、自动更新依赖、独立版本管理、非Npm包
组件管理方案:
测试方案:
(1)Karma驱动、Mocha测试框架、chai断言库、Sinon mock、Istanbul覆盖率
(2)Jest一站式测试方案
文档方案:docsify
七、总结展望
组件库还是要有的
合理的设计
周围生态很重要
造好轮子
八、实时案例展示
https://github.com/QingWei-Li/vuep.run