美文网首页
前端历史

前端历史

作者: JLong | 来源:发表于2020-04-20 10:18 被阅读0次

前端开发模式的演进,我觉得主要有四个阶段。。

1、基于模板渲染的动态页面

2、基于 AJAX 的前后端分离

3、基于 Node.js 的前端工程化

4、基于 Node.js 的全栈开发

基于模板渲染的动态页面

在早起的互联网时代,我们的网页很简单,就是一些静态或动态的页面,主要目的是用来做信息的展示和传播。这个时候开发一个网页也很easy,主要就是通过 JSP、PHP 等技术写一些动态模板,然后通过 Web Server(nginx,apache) 将模板解析成一个个 HTML 文件,浏览器只负责渲染这些 HTML 文件。这个阶段还没有前后端的分工,通常是后端工程师顺便写了前端页面。

JSP: Java Server Page: Java服务端页面,在html页面中编写Java代码的页面

WebServer:网站服务器或web服务器

基于 AJAX 的前后端分离

2005 年 AJAX 技术的正式提出,翻开了 Web 开发的新篇章。基于 AJAX,我们可以把 Web 分为前端和后端,前端负责界面和交互,后端负责业务逻辑的处理。前后端通过接口进行数据交互。我们也不再需要在各个后端语言里面写着难以维护的 HTML。网页的复杂度也由后端的 Web Server 转向了浏览器端的 JavaScript。也正因如此,开始有了前端这个职位。

基于 Node.js 的前端工程化

2009年 Node.js 的出现,对于前端来说,也是一个历史性的时刻。随着 Node.js 一同出现的还有 CommonJS 规范和 npm 包管理机制。随后也出现了 Grunt、Gulp、Webpack 等一系列基于 Node.js 的前端开发构建工具。

在 2013 年前后,前端三大框架 React.js/Angular/Vue.js 相继发布第一个版本。我们可以从以往基于一个个页面的开发,变为基于一个个组件进行开发。开发完成后使用 webpack 等工具进行打包构建,并通过基于 Node.js 实现的命令行工具将构建结果发布上线。前端开发开始变得规范化、标准化、工程化。

基于 Node.js 的全栈开发

Node.js 对前端的重要意义还有,以往只能运行在浏览器中的 js 也可以运行在服务器上,前端可以用自己最熟悉的语言来写服务端的代码。于是前端开始使用 Node.js 做全栈开发,开始由前端向全栈的方向转变。这是前端主动突破自己的边界。

另一方面,前端在发展,后端也在发展。也差不多在 Node.js 诞生那个时代,后端普遍开始由巨石应用模式向微服务架构转变。这也就导致以往的前后端分工出现了分歧。随着微服务架构的兴起,后端的接口渐渐变得原子性,微服务的接口也不再直接面向页面,前端的调用变得复杂了。于是 BFF(Backend For Frontend)架构出现了,在微服务和前端中间,加了一个 BFF 层,由 BFF 对接口进行聚合、裁剪后,再输出给前端。而 BFF 这层不是后端本质工作,且和前端的关系最大,所以前端自然而然选择了 Node.js 来实现。这也是当前 Node.js 在服务端较为广泛的应用的原因。

巨石应用:大部分web工程是将所有的功能模块(service  side)打包到一起并放在一个web容器中运行,很多企业的Java应用程序打包为war包

微服务架构:微服务架构是一种架构理念,是指将功能分解到离散的各个服务当中,从而降低系统的耦合性,并提供更加灵活的服务支持。把一个大型的单体应用程序和服务拆分为数个或数十个的微小型服务,它可扩展单个组件而不是整个的应用程序堆栈,从而满足服务等级协议。

下一代前端开发模式

说完了这几个阶段,可以看到,每一次前端开发模式的变化,都因某个变革性的技术而起。先是 AJAX,而后是 Node.js。那么下一个变革性的技术是什么?不言而喻,个人觉得就是 Serverless。

未来趋势:Serverless!!!

详细自查资料

相关文章

  • 前端历史

    前端开发模式的演进,我觉得主要有四个阶段。。 1、基于模板渲染的动态页面 2、基于 AJAX 的前后端分离 3、基...

  • 【转】阮一峰:前端开发的历史和趋势

    原文地址:前端开发的历史和趋势作者:阮一峰 前端开发的历史和趋势 什么是前端 前端:针对浏览器的开发,代码在浏览器...

  • 前端发展历史

    1.js操作html 利用原生的javascript (js包括ECMAscript BOM DOM)的DOM操作...

  • 前端历史了解

    之前做移动端开发,最近开始接手部分前端工作,一上来就是使用react框架来做。虽然之前对前端知识有所了解,但也仅仅...

  • NodeJS--01

    前端框架的发展历史 一篇文章了解前端框架演变前端框架的发展现状与趋势The best of JavaScript,...

  • 对前端开发的理解

    2021.03.18我将从历史,契机和未来发展三个方面谈谈我对前端的理解。历史:2011年前,前端都是后端代码的附...

  • Vue.js学习系列(1)什么是Vue.js

    什么是Vue.js? 前端开发的历史 什么是“前端”? 简单来说,我们从浏览器里面打开的页面就是所谓的“前端”,因...

  • 你必须要知道的前端那些事儿---入门级必读

    “ 作为一个入门级的前端小白,前端的发展历史,是你必须要了解的。因为这可以让你更好的理解前端、理解整个前端的行业状...

  • 前端开发的历史

    什么是前端? 前端代码在浏览器运行,后端代码在服务器运行。 前后端不分时代 互联网发展的早期,前后端开发是一体的,...

  • 前端打包方案历史

网友评论

      本文标题:前端历史

      本文链接:https://www.haomeiwen.com/subject/seolihtx.html