组件化笔记

只要有UI层的展示，就必定有可以组件化的地方(VB, WPF)

组件就是
将一段UI样式和其对应的功能作为独立的整体去看待，
无论这个整体放在哪里去使用，
它都具有一样的功能和样式，
从而实现复用，这种整体化的细想就是组件化。

增加复用性，灵活性，提高系统设计，从而提高开发效率。

MVVM是Model-View-ViewModel的简写。

1 模型(Model)
模型是指代表真实状态内容的领域模型（面向对象），或指代表内容的数据访问层（以数据为中心）。
2 视图(View)
就像在MVC和MVP模式中一样，视图是用户在屏幕上看到的结构、布局和外观（UI）。
3 视图模型(ViewModel)
视图模型是暴露公共属性和命令的视图的抽象。MVVM没有MVC模式的控制器，也没有MVP模式的presenter，有的是一个绑定器。在视图模型中，绑定器在视图和数据绑定器之间进行通信。
4 绑定器
声明性数据和命令绑定隐含在MVVM模式中。绑定器使开发人员免于被迫编写样板式逻辑来同步视图模型和视图。

MVVM问题

1.执行效率，
只要数据改变，它下面所有监测数据上绑定的UI一般都会去更新，效率很低，
如果你操作频繁，很可能调了几十万遍（有可能层次太深或者监测了太多的数据变化）。
2.由于MVVM一般需要严格的ViewModel的作用域，
因此大部分情况不支持多次绑定，或者只允许绑定一个根节点做为顶层DOM渲染，
这就给组件化带来了困难（不能独立的去绑定部分UI）。

React (单向数据流管理设计的先驱)
React+Redux是将MVC做到了极致（action->request, reducer->controller）

Vue
既吸取了React的数据流管理方式 (rxjs)
也实现了MVVM的双向绑定和数据监控（这应该是Vue的核心了）
=> 比较灵活的，可以按需扩展 => 渐进式框架

设计稿，拆分布局
一层一层布局拆分下去

抽取
复用[完全相同，外观相似(多种形态)，功能相似(输入,输出)]
抽象，DOM结构、数据分解、交互(传入,传出) 、规范正确的名字、可配置参数、统一风格(色调,交互风格)
功能点技术实现选型

编码，自动化测试用例

统一规范化的文档说明框架
编写api文档
编写demo用例
在线可实现预览
在线可实现编码

制定版本计划
版本更新说明

发布
提供下载
便于集成开发

组件化 笔记