前端的发展

最新推荐文章于 2024-01-17 18:20:47 发布

Coder小鹿

最新推荐文章于 2024-01-17 18:20:47 发布

阅读量407

点赞数 1

分类专栏： javascript 文章标签： javascript css typescript

本文链接：https://blog.csdn.net/qq_46299172/article/details/107394493

版权

javascript 专栏收录该内容

34 篇文章 2 订阅

订阅专栏

前端的发展

今儿，来讲讲前端的发展吧，从以前人们口中的"切图仔"到现在的web前端工程师，这种称呼的改变，是这二十几年的前端的一直光速迭代发展带来的
1990年，HTML被发布，但是要是说前端的历史起点的话，应该是1994年，这一年网景推出了第一版Navigator，W3C的创建，CSS的诞生。
在当时，大多数的web网页是被用于技术交流的，Document(文档)因此而来，Document就是用标记语言和超链接写成的由文字和图片构成的HTML的页面，当然，没有样式，但是这并不妨碍用于学习交流。这时候，网页全部是静态的
当网页从学术机构流向大众时，这种Document的静态页面的局限性就暴露出来了
1、当时不能改变DOM，不能控制显示或者隐藏，所以说，任何变化，都会要求重新下载一个页面
2、所有网页都是静态的，而且计算任务只能在服务器实现，想想那个年代的网速带宽吧，所以经常会出现提交表单后，白屏，漫长的等待后，迎来的是跟刚才一样的界面，但是输入框边上多了一排红色小字: “用户名已被注册” ，用户体验完全炸裂

JS的由来

1995年网景工程师 Brendan Eich 花了10天时间设计了 JavaScript 语言。起初这种脚本语言叫做 Mocha，后改名 LiveScript，后来为了借助 Java 语言创造良好的营销效果最终改名为 JavaScript。当时的JavaScript被创作出来是为了完成一些简单的客户端计算任务(表单验证)，当时的JavsScript并不像现在，当时它是被厌烦的，因为当时的广告弹窗都是JavaScript实现的，可想而知，当时的网页环境。
之后，随着发展，也出现了很多服务端语言，PHP, Ruby, ASP.NET等等，这些动态语言，实现了与数据库的交互，生成动态页面。

后端渲染

然后来到了后端渲染后端路由的时代，早期的网站开发，整个HTML页面是由服务器来渲染的，然后返回给客户端展示，但是，一个网站，这么多页面服务器如何处理呢，一个页面有自己对应的URL,URL会发送到服务器，服务器会通过正则对该URL进行匹配，并且最后交给一个Controller进行处理，Controller，最终生成HTML或者数据，返回给前端，这就完成了一个IO操作，上面的这种操作就是后端路由，后端处理URL和页面之间的映射关系，但是后端路由很大的缺点，一种情况是整个页面的模块由后端人员来编写和维护，另一种情况就是前端人员开发页面时，需要混合php或者java来编写，而且通常情况下HTML代码和数据以及对应的逻辑会混在一起，编写和维护都是非常麻烦的，因此当时的前端程序员通常被叫做切图仔
接着，迎来了前端第一次质的飞跃，1999年MicroSoft推出了ActiveX，用于异步数据传输，接着各大浏览器厂商模仿实现了XMLHttpRequest, 这标识着Ajax的诞生，从此，前端从早期的后端渲染进入到了前后端分离的阶段，不过也是在发布6年后，随着通过ajax制作Gmail和Goole地图，Ajax才算正式火了起来。

前后端分离

随着ajax的出现，有了前后端分离的开发模式，后端只提供API(接口)来返回数据，前端通过Ajax获取数据，并且可以通过JavaScript操作DOM将数据渲染到页面上，这样做最大的优点就是前后端责任的清晰，后端专注于数据上，前端专注于交互和可视化上，并且当移动端出现后，后端不需要进行任何处理，依然使用之前的一套API即可，目前很多网站依然采用这种模式开发，后端只负责提供数据，不负责任何界面的内容。因此就有了前端渲染的概念，前端渲染: 浏览器中显示的网页中的大部分内容，都是由前端写的JavaScript代码在浏览器中执行，最终渲染出来的页面。

SPA

单页面富应用阶段（SPA）simple page webapplication，整个网站只有一个HTML页面，其实SPA最主要的特点就是在前后端分离的基础上加了一层前端路由，也就是前端来维护一套路由规则，前端路由：会首先在静态服务器把html css js静态资源全部下载下来，在点击其他页面时，生成一个新的URL，并不会再去静态服务器请求页面，而是通过js判断把相应的页面去显示，前端路由的核心是: 改变URL，但是页面不进行整体的刷新(通过改变hash)。

全端

当然，不得不提的还有一个，从前端走向全端，2009年，Node的发布，Node是一个基于V8引擎的服务端JavaScript运行环境，类似虚拟机，这也代表着JavaScript在服务端语言中可以占据一席之地了，Node可以说是前端的第二次飞跃了

App

现在也进入了移动时代，那么前端肯定也要争一争了，于是就有了Web APP，相对于Native APP，Web APP有太多的好处: 无需开发两套系统版本(IOS，Android)，无须安装，无须手动升级，无须审核，还降低成本，不过性能上，还是比不上Native APP，不过随着目前各种技术的出现: Hybrid, react native,还有腾讯的weex这些Web APP技术，相信性能方面会得到极大的优化，更何况现在还多出了个微信小程序。