网站首页 > 博客文章 正文
?最近这张图火遍了前端圈子,引起无数前端工程师的哀嚎和吐槽,虽说作者随后就澄清了这只是一个网友的恶搞,但是从这个事情咱们还是能够看出确实有相当一大部分的前端工程师对那些常常更新的框架的深恶痛绝。
那到底什么是前端框架?它们有什么干什么的呢?不同框架之间又有些区别吗?
?
再弄明白框架前,我们可以花点时间重新回头捋一捋咱们前端的发展征程,去了解今天的前端究竟都是些什么。
前端开发技术简单来说,所指代的就是基于HTML,CSS,JavaScript这一套技术体系发展而来的业务技术。
而前端的技术发展历程大体上可以分成以下这样几个时代
蛮荒时代
上世纪90年代的前端主要工作就是在浏览器上展示一个文字和图片,以及提供一些注册表单。那时候的网站以浏览为准,使用最多的就是html的标签元素,css一般以元素的行内样式出现,零星的JavaScript大多也只起一个客户端验证、表单验证的作用。
?
进化时代
ajax的出现是前端的第一次大型进化,以Gmail为代表的一系列规模更大、效果更好的Web程序的出现,促使网页中的JavaScript比例越来越大。
?
代码量的上涨,促进了JavaScript库这个概念的出现,当时最出火起来的是prototype、moottools等库,这两个库都是基于面向对象的方式组织并整合了大量的业务代码,比如:枚举、数组、字符串、DOM、BOM、表单、Ajax等,这些整合好的方法库减小了前端工程师的开发难度。
这个时代最耀眼的明星就是jQuery,jQuery的重点放在了DOM操作上,极大的简化了页面元素操作的难度,链式调用的出现也减少前端工程师需要编写的代码量。
革命时代
flash的没落和H5技术的崛起,前端的业务内容短时间爆发了起来,在线游戏、在线应用、动态网站等新兴业务极大的拓展了前端的技术边界。
?
?
前端工程师们开始要考虑这样一些问题: 如何更好地模块化开发、业务数据如何组织、界面和业务数据之间通过何种方式进行交互。
在这种背景下,出现了一些前端 MVC、MVP、MVVM 框架,我们把这些框架统称为 MV*框架。这些框架的出现,都是为了解决上面这些问题,具体的实现思路各有不同,主流的有VUE,AngularJS,REACT等等
常见框架辨析
如果仔细的小伙伴可能会发现,在进化时代和革命时代出现的两个代表技术一个叫做库,而另一个叫做框架。那么库和框架之间的区别又是什么呢?
JavaScript 库:插到既有架构中,补充特定功能。
JavaScript 框架:提供一个架构(文件结构啊,等等),你必须遵守它,只要你遵守,那剩下的就全都是处理通用需求了。
换一句通俗点的话说,框架是给咱们制定了一个完整的规范,从DOM结构到程序结构皆设置好了;库就是事先定义了若干个方法库,给我们提供一些现成的功能函数去加快网页的开发速度。
那为毛说框架难学呢?
根据上面分析咱们就知道了一个框架的存在就是为了解决企业的业务开发问题的,而企业的需求和问题是不断的在优化和升级的,所以框架本身也在不断快速的进行升级,这就给广大前端工程师造成极大的学习困难。
?
那我们应该如何学习框架呢?
其实无论是是什么框架,采用的是哪种MV*模式,其内部的代码都是由原生的JavaScript、css等所构成的
?
React源码
?
Vue源码
框架的版本无论如何更迭,其内部的JavaScript的语法永远都是那些基本的JavaScript,正如咱们以前看过的武侠小说中所说道:“以不变应万变”。只要掌握框架的开发技术,每次新版本的框架一经更新,我们只需要阅读一遍改动的源码就可以轻而易举的掌握新框架的技术。
但是呢?点开过这些框架的源码人肯定有很多,但是能够坚持看完的确实寥寥无几,这并不是因为我们的毅力不够,而是因为这些框架的源码与我们常用的业务代码逻辑不甚相同,这个不同之处就在于设计模式。
?
设计模式指的是什么呢?
设计模式其实并不直接用来完成代码的编写,而是描述在各种不同情况下,要怎么解决问题的一种方案。像框架这类高级业务,它所需要考虑到的业务场景几乎涵盖了作为一门语言所需要实现的所有功能,这就必然要求他拥有足够柔性且高效的代码来应对众多的业务
猜你喜欢
- 2024-10-28 功能问题:如何解决跳同一路由组件时页面不变?
- 2024-10-28 Vue3.0来龙去脉更新历程(vue3最新版本)
- 2024-10-28 vue3移除了$on,$off ,$once(vue 移除list中的项)
- 2024-10-28 图解 Vue 异步更新原理(vuex异步)
- 2024-10-28 Vue 3.3.6 发布了,得益于WeakMap,它更快了
- 2024-10-28 新闻在线全栈开发实战(vue3+springboot)之五-数据库信息的更新
- 2024-10-28 vue引入element-ui后界面空白(vue引入elementui不起作用)
- 2024-10-28 VUE3前端开发入门系列教程三:VITE热更新配置及WSL填坑
- 2024-10-28 vue3使用vuex 集中式管理状态数据
- 2024-10-28 移动端跨端方案:4.页面更新机制#前端
你 发表评论:
欢迎- 最近发表
- 标签列表
-
- powershellfor (55)
- messagesource (56)
- aspose.pdf破解版 (56)
- promise.race (63)
- 2019cad序列号和密钥激活码 (62)
- window.performance (66)
- qt删除文件夹 (72)
- mysqlcaching_sha2_password (64)
- ubuntu升级gcc (58)
- nacos启动失败 (64)
- ssh-add (70)
- jwt漏洞 (58)
- macos14下载 (58)
- yarnnode (62)
- abstractqueuedsynchronizer (64)
- source~/.bashrc没有那个文件或目录 (65)
- springboot整合activiti工作流 (70)
- jmeter插件下载 (61)
- 抓包分析 (60)
- idea创建mavenweb项目 (65)
- vue回到顶部 (57)
- qcombobox样式表 (68)
- vue数组concat (56)
- tomcatundertow (58)
- pastemac (61)
本文暂时没有评论,来添加一个吧(●'◡'●)