Web技术发展史
Web技术发展史
Web开发指的是⽹页系统开发,每次在浏览器中输⼊⽹址时,总会先输⼊www,这⾥其实是World Wide Web的简称,现在也简称Web,中⽂译为万维⽹。
Web设计初衷是⼀个静态信息资源发布媒介,通过超⽂本标记语⾔(HTML)描述信息资源,通过统⼀资源标识符(URI)定位信息资源,通过超⽂本转移协议(HTTP)请求信息资源。HTML、URL和HTTP三个规范构成了Web的核⼼体系结构,是⽀撑着Web运⾏的基⽯。
这样说太过专业化了,⽤简单的话说,打个⽐⽅:假设有100台计算机,这100台计算机可以分布在世界任何⼀个地⽅,⽆所谓。如果我想让这100台计算机相互通信,怎么办。那把这100台计算机⽤光纤相互连接起来吧,组成⼀个⽹路。
到这还不⾏,这只是硬件上连接起来了,通信是可以通信了,但计算机们都不知道对⽅发的消息是什么意思,⽽且寻址也是⼀个问题。这时就需要⼀个通信协议了,然后TCP/IP就诞⽣了。有了这个协议后,100台计算机算是真正可以发送消息了,⽽Web就是建⽴在这个基础上的。
再设想⼀下,现在1号计算机想获取99号计算机上磁盘上的⼀张图⽚,怎么办?这时URI就诞⽣了,URI作为统⼀资源标识符,专做这个事情。那么拿到资源后怎么展⽰就是HTML做的事情了,⽽计算机通信的协议就是通过HTTP协议了(HTTP协议是基于TCP协议的⼀个上层协议)。
因此,⼤家开发的Web应⽤本质上就是将服务器中的资源提供的互联⽹中,成为Web这个全球超⼤规模分布式系统中的⼀部分。下⾯我就来扒⼀扒Web开发经历过哪些阶段。
1. 静态⽹页时代
1994年,⽹景公司(Netscape)发布了Navigator浏览器0.9版。这是历史上第⼀个⽐较成熟的⽹络浏览器,轰动⼀时。但是,这个版本的浏览器只能⽤来浏览,不具备与访问者互动的能⼒。最初在浏览
器中主要展现的是静态⽂本或图像信息,即将⽹页的HTML代码编写好,然后将他放在服务器上通过浏览器访问这个静态的HTML⽂件。
这个时期的技术处于较为原始阶段,没有Javascript,没有CSS的年代,写出的HTML给⼈的感觉就是⼀些⽂字堆砌在⼀起,没有美感,也不存在动态交互。只有GIF图⽚第⼀次为HTML页⾯引⼊了动态元素。那时的⽹页⼤致长这个样⼦
明星动态图片大全此时的⽹景公司(Netscape)也苦于浏览器没有动态效果,因此急需⼀种脚本语⾔,后来⽹景公司开发出了⼀门新语⾔javascript,有了Javascript后⽤户就具备了与浏览器交互的能⼒。但是页⾯的画风太丑,⼀直被⼈们吐槽,因此⼤概在同时期⼜诞⽣了另⼀名语⾔CSS,专门负责定义HTML的标签样式。
1994年,W3C组织(World WideWeb Consortium)成⽴,CSS的创作成员全部成为了W3C的⼯作⼩组并且全⼒以赴负责研发CSS标准,层叠样式表的开发终于⾛上正轨,有越来越多的成员参与其中。Javascript与CSS两⼤前端语⾔诞⽣后,静态页⾯也可以像桌⾯应⽤程序那样美观和动态交互了,下⾯是苹果公司早期的主页
那时Web的⼯作原理也相对简单,就是浏览器请求服务器的静态HTML⽂件,然后服务器将静态⽂件返回给浏览器渲染成⽂本展⽰,其⼯作流程⼤致如下图
2. 动态内容CGI时代
随着业务发展,⼈们已经不仅仅满⾜于访问放在Web服务器上的静态⽂件,⽐如你想让访问者看到有多少其他访问者访问了这个⽹站,或者想让客户去填写这样⼀个表单,包含有姓名和邮件地址,要实现这样的功能,意味着客户端与服务端要进⾏数据交互,⽽且服务端还需要把⽤户数据永久的保存起来,这些功能是静态页⾯⽆法实现的。
于是1993年CGI(Common Gateway Interface)出现了,Web上的动态信息服务开始蓬勃兴起。CGI定义了Web服务器与外部应⽤程序之间的通信接⼝标准,因此Web服务器可以通过CGI执⾏外部程序,让外部程序根据Web请求内容⽣成动态的内容。
Perl因为跨操作系统和易于修改的特性成为CGI的主要编写语⾔。当然,CGI可以⽤任何⽀持标准输⼊输出和环境变量的语⾔编写,⽐如Shell脚本,C/C++语⾔,只要符合接⼝标准即可。
⽐如⽤C语⾔编写CGI程序,把希望返回的HTML内容通过printf输出就可以发送给Web服务器,进⽽返回给⽤户。CGI应⽤程序运⾏在浏览器可以请求的服务器系统上,此时Web开发的架构⼤致如下图
由于CGI执⾏时需要使⽤服务器CPU时间和内存。如果有成千上万的这种程序同时运⾏,会对服务器系统提出极⾼的要求。你要慎重考虑这个问题,以防⽌服务器系统崩溃。当时组织CGI/Perl这样的脚本代码太混乱了。
CGI伸缩性不是太好(经常是为每个请求分配⼀个新的进程),也不太安全(直接使⽤⽂件系统或者环境变量),同时也没提供⼀种结构化的⽅式去构造动态应⽤程序。如果⼀个CGI脚本可以在每台计算机上做同样的事情;编写脚本就会变的很容易。
不幸的是,CGI脚本依赖于服务器的操作系统,因此,对于⾮UNIX服务器来说,Prl(UNIX下编写脚本的⼀个常⽤⼯具)脚本毫⽆⽤处。这也是开发⼈员最痛苦的事情,这意味着同⼀个应⽤服务,需要根据不同的操作系统各⾃开发⼀套。所以,你必须定制安装你的CGI脚本。这也是后来基于 JVM 平台的语⾔流⾏的主要因素。
3. 模板引擎时代
(1)PHP/ASP时代
尽管CGI解决了⽹页动态数据的问题,但它的弊端也是越来越明显,依赖于操作系统,移植性差,HTML代码与服务端代码杂糅在⼀起不便于维护。为了处理更复杂的应⽤,⼈们在想能不能把HTML返
回中固定的部分存起来(我们称之为模版),把动态的部分标记出来, Web 请求处理的时候,程序先获取动态数据,再把模版读⼊进来,把动态数据填充进去,形成最终返回。
举个例⼦,你通过页⾯搜索框搜索⼀个关键词,请求到达Web服务器,后台从数据库或是⽂件⾥拿到数据,然后把这些数据填充到返回结果的HTML模版中,返回给浏览器。
但是这件事情⾃⼰来做显然太繁琐⽽且是重复劳动,于是1994年的时候,PHP诞⽣了,PHP可以把程序(动态内容)嵌⼊到HTML(模版)中去执⾏,不仅能更好的组织Web应⽤的内容,⽽且执⾏效率⽐CGI还更⾼。
之后96年出现的ASP上也都可以看成是⼀种⽀持某种脚本语⾔编程,ASP使⽤VB语⾔的模版引擎。更重要的是,模板引擎的出现使得HTML代码和服务端代码分离开来,使得开发流程更加规范,逻辑更加清晰。⽽CSS允许开发者⽤外联的样式表来取代难以维护的内嵌样式,⽽不需要逐个去修改HTML元素,这让HTML页⾯更加容易创建和维护。
此时,有了这些脚本语⾔,搭配上后端的数据库技术,Web更是开始⼤杀四⽅了,像电⼦商务这样的应⽤系统也可以通过Web技术来构建。Web已经从⼀个静态资源分享媒介真正变为了⼀个分布式的计算平台了。
反过来看,你也应该知道,不是只有当今这些流⾏脚本语⾔可以写Web应⽤,C语⾔⼀样可以做这件事情。通过C语⾔来获取数据和渲染Web页⾯的例⼦在追求极致访问速度的互联⽹公司是⾮常常见的,但是脚本语⾔在开发效率上更胜⼀筹。
(2)JSP/SERVLET时代
Servlet是⼀个优秀的Web技术规范,Servlet 看起来像是通常的 Java 程序。Servlet 导⼊特定的属于 Java Servlet API 的包。因为是对象字节码,可动态地从⽹络加载,可以说 Servlet 对 Server 就如同 Applet对 Client ⼀样,但是,由于 Servlet 运⾏于 Server 中,它们并不需要⼀个图形⽤户界⾯。从这个⾓度讲,Servlet 也被称为 FacelessObject。
由于前后端交互的问题,sun公司⼜发布了JSP,JSP全称是Java Server Pages,它和Servlet技术⼀样,都是sun公司定义的⼀种⽤于开发动态web资源的技术。JSP最⼤的特点在于,写jsp就像在写html,但它相⽐html⽽⾔,html只能为⽤户提供静态数据,⽽Jsp技术允许在页⾯中嵌套java代码,为⽤户提供动态数据。它的出现⼀改以前java开发⼈员需要在Servlet中⾃⼰将html代码 out.write 返回给前端的⼯作⽅式,⽽是直接在jsp中编写html代码,极⼤的⽅便了开发⼈员的使⽤。这时已经初见前端分离的雏形了。
jsp出现后,美⼯可以把页⾯原型图画好,再交给前端⼯程师按照原型图将静态页⾯写出来,待静态页
⾯写好后,再交给java开发⼯程师把html代码复制到jsp中,这时只需要把后端处理的值填到对应的jsp中即可。对于⼀个系统开发,⼈员可以明确分⼯,前端后端开发部分可以同时进⾏。这个时期后端架构图⼤致如下
4. JavaEE时代
Web开始⼴泛⽤于构建⼤型应⽤时,在分布式、安全性、事务性等⽅⾯的要求催⽣了J2EE(现在已更名为Java EE)平台在1999年的诞⽣,从那时开始为企业应⽤提供⽀撑平台的各种应⽤服务器也开始⼤⾏其道。Java Servlet、Java Server Pages (JSP)和Enterprise Java Bean (EJB )是Java EE中的核⼼
规范,Servlet和JSP是运⾏在服务器端的Web组件。
2000年随之⽽来的平台,其ASP构件化的Web开发⽅式以及Visual Stidio开发环境的强⼤⽀持,⼤⼤降低了开发企业应⽤的复杂度。ASP.Net第⼀次让程序员可以像拖拽组件来创建Windows Form程序那样来组件化地创建Web页⾯,Java平台后来出现的JSF也承袭了这⼀思想。两⼤平台在相互竞争和模仿中不断向前发展。
EJB运⾏在服务器端的业务组件,是⼀种分布式组件技术J2EE⾥,除了Servlet外另⼀个重量级的规范就是EJB。EJB设计的来源是Corba 技术,分布式对象技术在EJB规范中有完整的体现。
Rod在著作中对EJB规范粗重庞⼤难⽤提出各种质疑,尤其是针对其强制分布的要求。我的观念是分布式⽀持没有错,现在EJB规范中对于Local和Remote的划分定义是正确的。开发⼈员应该⼀开始就需要了解接⼝粒度的划分,本地和远程接⼝是不同的。
对于⼀般的⼩型应⽤,Servlet和EJB容器都在⼀个虚拟机中,本地接⼝是合理的,但对于⼤型企业应⽤和互联⽹级别应⽤,势必需要服务的远程划分和调⽤。所以早期的EJB,可以说⼀⽅⾯设计不完备,另⼀⽅⾯⼜过度设计。
但EJB⾃从3以后完全脱胎换⾻,成为设计良好的规范。⼤家有没有想过所谓企业应⽤和普通应⽤之间
最⼤的差别是什么?我认为是⽤户数量级别的差异,导致前端设计⽅式,软件体系,后台数据库,缓存技术应⽤,有不同的设计理念和⽅式。
⽤更技术化来说,就是可扩展性,⾼可⽤性,容灾能⼒以及数据的⼀致性。实际上这样的思维⽅式很好,因为企业应⽤追求的是稳定,所以在架构设计时⼀是要求效率,⼆是⾯向失败编程,即开发时⾸先不是想正常情况下应该怎么样,⽽是把所以有能异常的情况都考虑在⾥⾯,并为异常情况做好解决措施。从软件层⾯考虑,⼀个企业应⽤软件可能⽤户数并不太多,就企业中百来号⼈,但前后台的交互是长时间,多次会话交互的。
JSF技术其实是借鉴了微软ASP,它们继承了传统IDE快速开发的思路,希望通过拖拽连接可以快速开发⼀个应⽤。页⾯上的组件,对应后台服务器的业务组件,在得到服务器请求之后,组件需要做⼀系列动作来完成解析,校验,模型重建,业务⽅法调⽤,页⾯渲染等步骤,这些必然有个较长的过程。
复杂性,效率,和其他技术的融合,JSF技术从诞⽣起就被质疑不断,⽽且⾯对每个明星技术,都有些格格不⼊,⽐如Ajax出现了,⽽JSF 要求的Post⽅式还需要重刷页⾯。但JSF⼀直在改进,越来越科学完善。如今,配合CDI,JSF是企业应⽤开发的⾸选技术之⼀,⼤家可以研究⼀下Oracle的应⽤产品和ADF开发框架。
5. Web层框架百花齐放
后端技术逐渐规范稳定后,为了提⾼⼯作效率避免重复造轮⼦。Web技术的发展开始了⼀段框架横飞的年代,各种辅助Web开发的技术框架层出不穷。虽然脚本语⾔⼤⼤提⾼了应⽤开发效率,但是试想⼀个复杂的⼤型Web应⽤,涉及到的Web页⾯多种多样,同时还管理着⼤量的后台数据,因此我们需要在架构层⾯上解决维护性和扩展性等问题。
这个时候,MVC的概念被引⼊到Web开发中来了。2004年出现的Struts就是当时⾮常流⾏的Java Web开发的MVC框架。MVC早在1978年就作为Smalltalk的⼀种设计模式被提出来了,应⽤到Web应⽤上,
模型Model⽤于封装与业务逻辑相关的数据和数据处理⽅法,视图View是数据的HTML展现,控制器Controller负责响应请求,协调Model和View。Model,View和Controller的分开,是⼀种典型的关注点分离的思想,不仅使得代码复⽤性和组织性更好,使得Web应⽤的配置性和灵活性更好。这是Spring MVC的⽰意图,典型的MVC 架构。
MVC的架构不仅仅是后端代码分层结构,由于各个层次相互解耦,因此⽤户可以根据业务场景合理选择各个层次的框架。例如View层可以使⽤jsp,thymeleaf。Model层可以使⽤mybatis,hibernate。Controller层可以使⽤Spring,Struts等等。也正是MVC的架构,使得各式各样的框架层出不穷。
6. CSS,Jacascript
上⾯主要说了后端web技术的演变,随着后端技术的发展前端技术也在⽇新⽉异,如今前端⽹页开发与莽荒时代的静态⽹页相⽐,不仅有各种各样的UI框架,更是参考了后端技术,在前端也实现MVC的架构。下⾯就来看⼀看前端技术的演变。
⾸先就是CSS和JS的诞⽣。javacript的诞⽣还有⼀段故事,前⾯说到⽹景公司开发的浏览器只能展⽰静态页⾯,因此⽹景公司想在浏览器端嵌⼊⼀种语⾔或是脚本,使得⽤户可以和浏览器做⼀些动态交互,从⽽提升⽤户的体验。
当时⽹景公司有两个⽅案:⼀个是采⽤现有的语⾔,如Perl、Python、Tcl、Scheme等等,允许它们直接嵌⼊⽹页;另⼀个是发明⼀种全新的语⾔。⾼层对于两个⽅案⼀时难以决定,就在这时,发⽣了另外⼀件⼤事:1995年Sun公司将Oak语⾔改名为Java,正式向市场推出。