什么是前端组件化?
组件化并不是前端所特有的,一些其他的语言或者桌面程序等,都具有组件化的先例。确切的说,只要有UI层的展示,就必定有可以组件化的地方。简单来说,组件就是将一段UI样式和其对应的功能作为独立的整体去看待,无论这个整体放在哪里去使用,它都具有一样的功能和样式,从而实现复用,这种整体化的细想就是组件化。不难看出,组件化设计就是为了增加复用性,灵活性,提高系统设计,从而提高开发效率。
组件的分类
目前优秀的组件库对前端组件的理解是分层,根据不同的需求将组件分为不同的种类,这种分类是一种规范,而不是规定。我们可以将组件从小到大分为四类:
- 基础组件:基础组件是整个组件化开发中的最小组件单元,用于构建页面元素的的原子组件,这类组件通常用于取代 HTML 的原生组件,不仅可以实现基本功能,更重要的是可以支持各种样式定制、事件绑定和换肤等等,基础组件库里比较著名的是 AntDesign 和 ElementUI,这两个组件库可以说在整个前端行业都已经普及。也是现在前端组件化开发的利器。
- 业务组件:根据业务逻辑和数据逻辑,由基础组件构建出的一些复杂的、可重用的组件,主要用来实现业务逻辑和业务功能。这些组件都有很强的业务特征,并且需要通过基础组件进行组装,但是项目中又会频繁出现。
- 区块:整合业务组件,由业务组件构成。主要用来实现页面的局部功能,切割页面功能区域。使页面功能能够快速的复用实现。
- 模块:由区块构成的整个页面,用于快速构建整个页面。
前端组件化开发
目前前端的组件化开发基本都是基于框架来实现。框架的作者团队制定好的规范,而开发者只需要遵循相应的规范去实现自己的组件就可以了。这样保证了组件的通用性和统一性,有利于壮大框架的生态,也能够让更多的开发者受益于组件化开发的便利。大家把自己工作中积累的组件发布到npm上面供其他的开发者去使用,这是不仅提高了整个行业的效率,更体现了开源的精神。随着前端组件化的发展未来的前端开发的工作会越来越简单,开发效率会越来越高,一个项目的开发就像搭积木盖房子一样,找到相应的组件,放到正确的位置,连接正确的数据流,整个项目就做完了。现在的低代码平台的实现,就是依托于组装式应用的思想去实现的组件化的开发。