持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第14天。
当一个应用开发的周期越长，功能越完善越复杂的时候，降低系统的复杂度就会变的重要了。
如果一个页面的逻辑过于复杂，那么我们会将其拆解为多个子页面、模板、组件等，其表现形式是基于组件（Component-Based）的架构，又称为前端组件化。
风格指南
风格指南只是一份索引——设计、组件的列表，是UI界面中所有元素的模块化集合，以及实现这些元素的代码片段，是一套设计的标准，根据这个风格指南可以设计出复合系统统一风格的页面和UI。
风格指南是一个包含了常用的UI组件的设计，如按钮、表单输入元素、导航菜单、模态框和图标，以及相应的一些设计规范。
该列表内容如下：
◎ 其展现形式，通常是以网站的形式来展现的。
◎ 设计人员通过风格指南来查找对应的设计准备及常见的UI样式。
◎ 开发人员从风格指南上直接复制风格的相关代码。
细分开来包括：
◎ 设计人员如何使用设计指南。
◎ 开发人员如何维护设计指南。
◎ 如何在项目中使用设计指南。
◎ 留白间距，诸如padding默认的是n*4px，即对应的4的倍数。
◎ 使用图片规范，不同位置图片的大小，一般采用什么格式的图片，等等。
◎ 常见问题的解决方式等。
模式库
模式库是一个面向开发者视角的组件库、代码集。
优点：
◎ 开发效率。只需要通过参数便可以复用先前编写的代码，而不需要重复写代码。
◎ 一致化。减少了重复编写样式和组件带来的不一致的问题。
◎ 可维护性。通过重用与抽象减少了重复代码的出现率，代码量的下降也进一步降低了系统维护难度。
设计系统
设计系统从本质上来看是规则、约束和原则的集合，其分别由设计和代码实现。
从名称上来看，更偏向于设计为主的体系。从开发人员的角度来看，它是一个尝试解决设计人员的交互一致性的系统。
从设计人员的角度来看，它是一个规则的合集。
