1. 静态页面

在互联网最初开始的时候,Web网站的主要内容是静态的,由文字和图片组成,制作和表现形式也是以表格为主。当时的用户行为也非常简单,仅仅是浏览网页。

2. 多媒体阶段

随着技术的不断发展,音频、视频、Flash等多媒体技术诞生了。多媒体的加入使得网页变得更加生动形象,网页上的交互也给用户带来了更好的体验。

3. CGI阶段

渐渐的,多媒体已经不能满足人们的请求,于是CGI(Common Gateway Interface)应运而生。CGI定义了Web服务器与外部应用程序之间的通信接口标准,因此Web服务器可以通过CGI执行外部程序,让外部程序根据Web请求内容生成动态的内容。

在这个时候,各种编程语言如PHP/ASP/JSP也逐渐加入市场,基于这些语言可以实现更加模块化的、功能更强大的应用程序。

4. Ajax

在开始的时候,用户提交整个表单后才能获取结果,用户体验极差。于是Ajax(Asynchronous Javascript And XML)技术逐渐流行起来,它使得应用在不更新整个页面的前提下也可以获得或更新数据。这使得Web应用程序更为迅捷地回应用户动作,并避免了在网络上发送那些没有改变的信息。

5. MVC

随着Web应用开发越来越标准化,出现了MVC等思想。MVC是Model/View/Control的缩写,Model用于封装数据和数据处理方法,视图View是数据的HTML展现,控制器Controller负责响应请求,协调Model和View。

Model,View和Controller的分开,是一种典型的关注点分离的思想,使得代码复用性和组织性更好,Web应用的配置性和灵活性也越来越好。而数据访问也逐渐通过面向对象的方式来替代直接的SQL访问,出现了ORM(Object Relation Mapping)的概念。

除了MVC,类似的设计思想还有MVP,MVVM等。

6. RESTful

在CGI时期,前后端通常是没有做严格区分的,随着解耦和的需求不断增加,前后端的概念开始变得清晰。前端主要指网站前台部分,运行在PC端、移动端等浏览器上展现给用户浏览的网页,由HTML5、CSS3、JavaScript组成。后端主要指网站的逻辑部分,涉及数据的增删改查等。

此时,REST(Representation State Transformation)逐渐成为一种流行的Web架构风格。

REST鼓励基于URL来组织系统功能,充分利用HTTP本身的语义,而不是仅仅将HTTP作为一种远程数据传输协议。一般RESTful有以下的特征:

    • api.example.com

    • example.com/api/

    • 域名和主域名分开

    • api.example.com/v1

    • api.example.com/v2

    • 带有版本控制

    • GET /users 获取所有用户

    • GET /team/:team/users 获取某团队所有用户

    • POST /users 创建用户

    • PATCH/PUT /users 修改某个用户数据

    • DELETE /users 删除某个用户数据

    • 使用URL定位资源

    • GET 获取资源,单个或多个

    • POST 创建资源

    • PUT/PATCH 更新资源,客户端提供完整的资源数据 是

    • DELETE 删除资源

    • 用 HTTP 动词描述操作

    • 使用状态码提高返回数据的可读性

    • 正确使用状态码

  • 默认使用 JSON 作为数据响应格式

  • 有清晰的文档

1.1.7. 云服务

随着时间的发展,Web的架构越发复杂,负载均衡、数据库分表、异地容灾、缓存、CDN、消息队列等技术开始应用,增加了Web开发和运维的复杂度。同时云服务开始逐渐发展,部署环境容器化,各个功能拆成微服务或是Serverless的架构。

参考:

GitHub 的 Restful HTTP API 设计分解 <https://learnku.com/articles/24050>`_

前端:Web技术的演化史相关推荐

  1. 前端web 技术盘点

    尽管前端技术在无线领域受到了挫折,但这无法减缓其发展势头.在基础技术方面,规范和标准的发展.浏览器的快速演进为将来的Web应用打好了根基:随着网站规模的进一步变大,交互变得更复杂,大家更关注用新的开发 ...

  2. 百度前端Web技术学院

    学院介绍 这是一个什么样的学院 百度Web前端技术学院(Baidu Institute of Front-End Technology简称IFE)是一个由百度人力资源部校园招聘组.百度EFE团队联合出 ...

  3. html 表单自动数值,web前端学习技术之对HTML5 智能表单的理解

    原标题:web前端学习技术之对HTML5 智能表单的理解 Html5新增input的form属性,用于指向特定form表单的id,实现input无需放在form标签之中,即可通过表单进行提交. - t ...

  4. php包括web前端,web前端包括什么技术?

    再知道什么是web前端说这个之前,我们先了解web前端工程师是干什么的?本文将和大家讲述web前端包括什么技术,以及什么是web前端. Web前端开发工程师,主要职责是利用(X)HTML/CSS/Ja ...

  5. 用WEB技术栈开发NATIVE应用(二):WEEX 前端SDK原理详解

    摘要: WEEX依旧采取传统的web开发技术栈进行开发,同时app在终端的运行体验不输native app.其同时解决了开发效率.发版速度以及用户体验三个核心问题.那么WEEX是如何实现的?目前WEE ...

  6. web前端开发技术要求会什么

    对[web前端请添加链接描述](http://www.suzxms.com.cn/web/)多少有了解的人,都知道Web前端开发工程师是一项很特殊的工作,现今互联网时代,静态的网页制作已经无法满足企业 ...

  7. web前端开发技术现状与发展_Web前端开发的未来,将会有哪些发展方向?

    Web前端开发,这已经发展多年的技术从最早的萌芽状态,发展到了今天的枝繁叶茂,各种技术的层出不穷也让开发者们不断地成长壮大.从最早的简单学习就能轻松应付,到今天的需要系统学习才能入职.那么,未来这项技 ...

  8. 前端世界起争端,你是现代 Web 技术体系的坚定捍卫者吗?

    [CSDN 编者按]前段时间,Mapbox 工程师 Tom MacWright 的一篇对现代前端技术的"二次思考"文章吐槽了现代前端框架给当代前端带来的一些问题,在前端世界掀起了一 ...

  9. Web前端开发大系概览 (前端开发技术栈)

    前言 互联网建立50多年了,网站开发技术日新月异,但web前端始终离不开浏览器,最终还是HTML+JavaScript+CSS这3个核心,围绕这3个核心而开发出来大量技术框架/解决方案. 我从2000 ...

最新文章

  1. 微信小程序日期相减得出天数
  2. 基于OpenCV的条形码区域分割
  3. SAP PM 入门系列15 - IW41 维护订单确认
  4. printf不能直接输出string类型
  5. Dubbo监控平台安装
  6. Jacobian vector products(转载+翻译+代码+解读)
  7. javascript历史、作用、三大组成、javascript代码书写位置、注意事项、变量
  8. 漫步数学分析番外二(上)
  9. python入门必备知识总结
  10. 错误信息:org.springframework.beans.factory.NoSuchBeanDefinitionException: No qualifying bean of type
  11. 什么是群、什么是阿贝尔群(abel群、阿贝尔群也称为交换群或可交换群)、群论入门
  12. 甲骨文中国良心裁员:首批900人,赔偿N+6
  13. Day27~Day32
  14. Android Image Edit Lib. Android 图片编辑库,微信图片编辑库
  15. 二元一次在线计算机,(二元一次)方程组求解在线计算器_三贝计算网_23bei.com
  16. 科普文章-另一个视角解读计算机编码 修订版
  17. 镜头矫正 棋盘矫正_矫正强迫,而不是症状
  18. 如何实现移动端富文本编辑器功能
  19. 【渝粤教育】国家开放大学2019年春季 8简明现代汉语 参考试题
  20. 发那科机器人程序备份及导入

热门文章

  1. RAID冗余技术的介绍AND实现
  2. C# delegate与event,委托与事件
  3. numpy——stack
  4. mysql中sex设置男女_MYSQL常用命令(3)
  5. 百度时间显示_文章的发布时间对百度优化网站重要吗
  6. combox 增加请选择_本命佛怎么请?
  7. tp5更改入口文件到根目录的方法分享
  8. Spring Boot之HelloWorld
  9. sql server自动备份
  10. Fragment管理工具类