从前端框架发展史聊聊为什么要学Vue 3？.pdfVIP

01 | 宏观视角：从前端框架发展史聊聊为什 么要学Vue 3？ 大圣 2021-10-18 00:00 1.0x 讲述：大圣 大小：15.16M 时长：16:33 你好，我是大圣。 今天，我们来聊一聊前端框架的发展历史。在熟悉这段历史之后，相信你 能把握到 Vue 在前端框架中的地位。这样，你就会对 Vue 有一个更精准 的定位，从而能够知道我们为什么要选择 Vue 框架，以及 Vue 的优势和 它的真正价值在哪里。 同时，前端框架的发展历史可能也会让你感触很多。因为每一个上网的 人，或多或少都会感觉到前端网页在这些年发生了很多的变化，这是一种 切身的、直观的体会。我们都能感觉到网页在设计模式、渲染等等地方的 变化，而这种种变化的背后，其实都可以放到前端框架的演变历史中来解 释。 石器时代 谈前端框架发展史之前，我们先来简单回顾一下前端的发展历史吧。 1990 年，第一个 Web 浏览器诞生了。这是前端这个技术的起点，代表 这一年它出生了。后面的时间里，前端圈有很多里程碑事件。 1994 年，网景公司发布第一个商业浏览器 Navigator。 1995 年，网景工程师 Brendan Eich 用 10 天时间设计了 JavaScript， 同年微软发布了 IE 浏览器，进而掀起了浏览器大战。 2002 年，IE 在浏览器大战中赢得胜利，IE6 占有率超过 96% 。 而前端的发展历史，又非常直观地显示在你看到的前端网页的演变历史 中。整个 90 年代，受限于网速，网页都是静态页，显示非常单一，前端的 工作大部分都只是让美工来切切图和写写 HTML+CSS。也因此，在 90 年 代，前端还处在一种萌发期的状态，前端工程师这一工种也没有明确出 现。 再后来，后端越来越复杂，开始分层。就像在小公司里，大家啥都干，但 公司规模大了之后，就要分部门，职责明确，代码也从揉在一起发展到 Model，View 和 Controller，分别负责不同的功能。 这就是后端 MVC 模式的盛行，让我们可以在模板里写上要展现的数据。 以前的代码都是所有内容写在一起，现在就会用 Model 负责数据。 后端渲染页面之前，会把数据库的数据显示在前端。这个时候，除了写前 端代码必备的 HTML、CSS 和简单的 JavaScript 动效，我们也开始用到了 JSP 和 Smarty，我们会写出如下这种代码： 复制代码 1 2 3 4 5 6 7 8 9 10 上述代码写出来的页面，就可以直接显示后端数据库里的数据了，这也就 是所谓的动态网页。动态页面使得前端本身的丰富程度大大提升。这一下 子迎来了整个互联网开发的繁荣时期，但这种模式下的任何数据更新，都 需要刷新整个页面，并且在带宽不足的年代，这样做会耗费不少加载网页 的时间。 所以这个时代的网页主要还是以显示数据和简单的特效为主，比如当时众 多的门户网站，也都没有太多的用户交互，主要就是显示后端存储的新 闻。 直到 2004 年，Google 发布了 Gmail，用户可以在不刷新页面的情况下 进行复杂的交互，之后，Ajax 逐渐成为网页开发的技术标准，也不断地被 应用于各种网站。Ajax 这个技术让我们可以异步的获取数据并且刷新页 面，从此前端不再受限于后端的模板，这也宣告了 Web2.0 时代正式到 来。至此，前端工程师也正式作为一个独立工种出现。 铁器时代 在 Gmail 诞生后，虽然依然有浏览器的混战和兼容性问题，比如绑定事件 不同的浏览器就要写不同的代码，但大家意识到前端也可以做出复杂应 用。而 jQuery 的出现迅速风靡全球，一个 $ 走天下，学会 jQuery 就等同 于学会了前端，算是前端车同轴的时代。在这之后，前端的具体开发不再 被 JavaScript 的兼容性问题所困扰。 那个时候 jQuery+Bootstrap 一把梭，成为了前端开发领域的主流技术， 前端代码内嵌在后端的项目中，写完直接发布，通篇都是如下的代码： 复制代码 1