学习框架后的反思——为什么要使用框架？

“我报名了Goldstone Project Phase 1 Challenge——瓜分100,000奖池，这是我的第一篇文章， 点击查看活动详情 “

我学习前端有一段时间了。最近在网上看到一个让我反思很久的问题——为什么要使用前端框架？

发现刚学这个框架的时候并没有想太多，只是看中了它在行业中的应用。公司大部分开发页面基本都是使用框架开发的，大厂接受度最高的就是 反应 框架，所以当时也没多想，就开始看视频和文档，开始框架学习之路~

直到 反应 学完之后，我脑子里没有去想这个问题。貌似只是通过公司招聘才学会了满足市场需求的框架，但现在回过头来反省，发现这种思维方式不利于技术的进步。当我们学习一项技术时，我们应该回到源头，了解它为什么会出现？它解决了哪些问题？这不仅能帮助我们在这个领域继续深耕，还能说服自己接触更多的前沿技术

说到框架，它是一个第三方库，用来替代原来的三剑客进行开发，所以它的出现必须解决开发过程中的问题，或者在原生开发出现问题的背景下对项目进行优化。让我们看一下框架。它给我们带来了什么好处？真正解决了哪些问题？

组件化

组件化的思想就是在开发之前把我们的页面分成小模块，相应的逻辑也跟着组件一起划分。这种开发思路给我们带来了很多好处：

复用性强，适合单页应用SPA

说到组件化，就不得不提到可重用性。我们在浏览一些网站的时候会发现，比如掘金，它的header导航栏在多个页面中是一样的，也就是说这个header可以在多个页面中复用。封装成一个组件，那么复用是一件很简单的事情，你只需要在对应的地方引入这个组件，这样就减少了很多重复的逻辑代码

SPA最大的特点是用户的每一个动作都不会重新加载页面，而是动态变换当前页面的内容。但是，这个转换后的页面在很多情况下都有一些可重用的部分，例如页眉。综上所述，考虑到刚才提到的复用特性，你觉得使用框架是不是很适合单页应用呢？

利用项目维护和扩展

由于页面已经被拆分成组件，组件所在文件的代码量不会太大。如果项目的某个部分出现问题，只需要找到相应的组件即可找到问题，这对项目是有利的。维护。如果后续页面需要添加其他功能，只需要添加相应的组件，非常有利于项目的扩展

数据驱动的视图更新

任何研究过框架的人都知道，比如 反应 , Vue 这类框架有一个很大的特点，就是用数据来驱动视图更新。这样的框架设计有什么好处？

减少编写DOM操作的代码，加快开发速度

相信在学习前端的过程中，你一定用过native JS 开发项目，资深程序员可能用过 jQuery ，但是有一个不可避免的问题，遇到数据变化需要重新改。 用户界面 什么时候，即使 jQuery 操作 DOM 很方便，但还是需要在代码中频繁操作 DOM ，这导致在开发过程中花费了大量时间 DOM 元素之上

和喜欢 反应 这样的框架采用了数据驱动视图更新的思想， DOM 操作是由它在内部帮我们完成，这样我们的关注点就可以从整个组件的更新转变为对应数据的更新，我们只需要维护好用于下一页显示的数据即可实现复杂的页面。更新操作，显着加快项目开发速度

性能优化

像一些优秀的框架是内部集成的 差异 像这样的算法，通过引入虚拟 DOM 概念，当视图需要更新时，首先使用 差异 比较新旧虚拟的算法 DOM 发生的变化 DOM 元素可以重复使用，需要更新、删除或重构，然后精确操纵需要改变的现实 DOM , 这确实有效 DOM 次数会少很多，浏览器的回流和重绘压力也会降低，从而达到性能优化的目的

生态

图片 反应 对于这样一个流行的框架，社区有大量的活跃用户，每天都有人分享他们的问题和解决方案，甚至很多人为一些人写了一套开箱即用的第三方库常见的场景。即使我们在开发过程中遇到问题，也可以快速解决。当我们遇到常见的场景时，我们可以快速使用别人写的成熟的第三方库来完成需求。

总结

这次想了想，感觉自己对框架的理解变得更加透彻了一些。以前觉得这个东西别人做的，公司也有这样的需求，所以我会学习使用。但是随着我们自身经验的积累，发现“知己知彼”会更有利于我们在前端道路上的探索。毕竟很多前沿技术现在用不上，不代表以后也不会用。更新迭代如此之快，短时间内会有大量新技术取代旧技术。如果我们对每一项技术的学习都是靠外界驱动的，那么就很难真正走向高级之路了~

版权声明：本文为博主原创文章，遵循CC 4.0 BY-SA版权协议。转载请附上原文出处链接和本声明。

这篇文章的链接： https://homecpp.art/5709/7475/2128

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明

本文链接：https://www.qanswer.top/23492/52561000

标签：框架,DOM,更新,学习,组件,开发,反思,页面
来源： https://www.cnblogs.com/amboke/p/16675851.html