发表于: 2019-09-25 23:10:31

1 890


今天完成的事

任务13

今天的收获

简单了解了下组件库。


为什么要做组件库?

有句话:前端摩尔定律:“每18个月,前端难度会增加一倍”。我并不完全认可这个数字的可靠性,但是这句话的本意我还是非常肯定的。是的,前端越来越简单了,但也越来越复杂了—简单到你可以用一个Github的starter搭建一个框架,集成所有的全家桶,涵盖单元测试和功能测试,包括部署以及发布,甚至你开发时使用的UI库都让你写不了几行css;可又复杂到如此多的框架和库层出不穷,你还没来得及学会官网的doc呢,就已经有新的替代品了,那就更别提静下心去学习其中的源码或推敲原理了,跟不上脚步强行搬砖自然略显疲惫。


一.什么是组件化

 组件化并不是前端所特有的,一些其他的语言或者桌面程序等,都具有组件化的先例。确切的说,只要有UI层的展示,就必定有可以组件化的地方。简单来说,组件就是将一段UI样式和其对应的功能作为独立的整体去看待,无论这个整体放在哪里去使用,它都具有一样的功能和样式,从而实现复用,这种整体化的细想就是组件化。不难看出,组件化设计就是为了增加复用性,灵活性,提高系统设计,从而提高开发效率。

组件化就好像我们的 PC 组装机一样,整个机器(应用)由不同的部件组成,例如显示器、主板、内存、显卡、硬盘等等。


二.组件化开发优势


1、每个组件对应一个工程目录,组件所需的各种资源都在这个目录下就近维护;(重点) 组件化的开发的最有价值的地方就是就近维护原则,每个开发者都将清楚的知道,自己所开发的维护的功能单元,其代码必然存在于对应的组件目录里,在那个目录下能找到有关这个功能单元的所有内部逻辑,什么样css样式,js啦,HTML页面结构啦,都在这个文件里,当需要修改的时候,直接去所对应的文件夹中找就好了!

2、由于组件具有独立性,因此组件与组件之间可以 自由组合;

3、页面只不过是组件的容器,负责组合组件形成功能完整的界面;

4、当不需要某个组件,或者想要替换组件时,可以整个目录删除/替换。

5、系统功能都被分支到独立的模块和组件中,开发者之间不会产生开发时序的依赖,大幅提升并行的开发效率,并且允许随时加入新成员认领组件开发或

一句话总结: 提高前端开发效率,降低WEB维护成本


三.组件化原则:

页面上每个独立的、可视/可交互区域视为一个组件;

每个组件对应一个工程目录,组件所需的各种资源都在这个目录下就近维护;

组件具有独立性,因此组件与组件之前可以自由组合;

页面只不过是组件的容器,负责组合组件行程功能完成的界面;

当不需要某个组件,可以替换或者删除;

组件化将页面视为一个容器,页面上各个独立部分例如:头部、导航、焦点图、侧边栏这些都视为组件,不同的页面根据内容的需要,去盛放相关组件就可以组成完成的页面。

模块化和组件化的好处就是复用。除了复用还有个好处就是分治,我们可以在不影响其他代码的情况下按需求修改某一独立的模块或是组件;



四.创建组件化的难度


打不过,完全打不过。创建组件库目前来说太难了,还是别人的成品好用。



明天的计划:

任务14页面1


返回列表 返回列表
评论

    分享到