为什么要做组件库?

本文探讨了为什么要在前端开发中建立组件库,指出传统开发方式的效率和维护问题。组件化通过将复杂系统分解为独立、可维护的部分,类似于电脑硬件的模块化设计。组件化提高了前端的可维护性和复用性,简化了页面构建。文章还介绍了组件开发的原则,并提供了一个十等分栅格系统的编码实战例子,同时讨论了如何在多组件页面中避免CSS污染的问题,建议使用BEM命名方法。
摘要由CSDN通过智能技术生成

背景介绍

什么是组件?

组件
它的核心意义在于代码复用。功能相对单一或者独立,在整个系统的代码层次上位于最底层,被其他代码所依赖。
模块
它的核心意义在于分离职责。它的关注点在于功能划分。 例如: 视频通话、语音通话等功能就可以被分为不同的模块

为什么要做组件库

传统开发方式效率低以及维护成本高的主要原因在于很多时候是将一个系统做成了整块应用,而且往往随着业务的增长或者变更,系统的复杂度会呈现指数级的增长,经常出现的情况就是一个小小的改动或者一个小功能的增加可能会引起整体逻辑的修改,造成牵一发而动全身。

针对此弊端,其实业界早就有了一些探索,我们希望一个大且复杂的场景能够被分解成几个小的部分,这些小的部分彼此之间互不干扰,可以单独开发,单独维护,而且他们之间可以随意的进行组合。就拿电脑主机来说,一台整机包括CPU,主板,内存,硬盘等等,而这些部件其实都是由不同的公司进行生产的,他们彼此之间根据一套标准分别生产,最后组装在一起。当某个部件出现问题时,不需要将整台主机都进行维修,只需要将坏的部件拿下来,维修之后再将其组合上就可以了。这种化繁为简的思想在后端开发中的体现是微服务,而在前端开发中的体现就是组件化。

组件化的意义

  1. 为前端提供了很好的分治策略,可以实现独立维护,可维护性强
  2. 组件具有独立性,组件之间可以自由组合
  3. 页面只不过是组件的容器,负责组合组件即可形成功能完整的界面

组件开发的原则

标准性
任何一个组件都应该遵守一套标准,可以使得不同区域的开发人员据此标准开发出一套标准统一的组件。
组合性
组件之前应该是可以组合的。我们知道前端页面的展示都是一些HTML DOM的组合,而组件在最终形态上也可以理解为一个个的HTML片段。那么组成一个完整的界面展示,肯定是要依赖不同组件之间的组合,嵌套以及通信。
重用性
任何一个组件应该都是一个可以独立的个体,可以使其应用在不同的场景中。
可维护性
任何一个组件
  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值