Web技术整理

标签: web 技术 | 发表时间:2011-10-29 13:35 | 作者:Peter.Y Gabriel
出处:http://www.cnblogs.com/

Web技术整理

  Web技术或许是将来最为热门的技术之一。这里略作一些总结,以及对各种Web技术作一些概要性介绍。(以下内容建立在我的粗略理解之上,欢迎指正)

  推荐个学习Web技术比较好的网站,介绍的比较全面。W3School

标记语言

  页面的展示使用超文本标记语言(HTML)来表示。这是一种标签语言,本身不具有执行能力,只是结构化页面内容。早期的HTML版本并不严格,许多浏览器厂商支持混乱。因而存在许多兼容性问题。

XHTML是扩展超文本标记语言,只是在HTML基础上严格了语法要求,并稍稍扩展了一些特性而成。其与HTMLv4.01相对应。

  早期HTML负责页面展示的全部内容,包括结构和字体格式等等。这使得页面表现与内容相耦合,于是CSS解决了这一问题。通过CSS样式表,可以定义页面各元素、属性或是更细粒度的样式,使用相当灵活。这样页面显示与内容就分离了。

  前面提到的都是静态页面必须的。下面来说说动态页面(DHTML)。简单说来,就是指含有脚本的一些页面(这些脚本在浏览器中执行,可以完成一些操作,使页面的展示能力进一步加强)。常用的脚本语言有JavaScript、VBScript等。有个问题是,脚本语言如何来显示页面?看下面

脚本语言

  脚本语言用于辅助页面的展示,以及提供一些变化性的内容(相对于纯粹静态的HTML而言)。脚本语言是一类嵌入式的语言,它的特点是,嵌入在其它语言中间,辅助使用。不像C/C++/Java等这些编程语言,不可互相混合在一起放在单个文件中。根据执行情况划分,分为客户端脚本和服务端脚本两种。

  客户端

  客户端脚本语言典型的有JavaScriptVBScript、JScript,Lua等。目前比较热门的是JavaScript语言。JavaScript语言虽然名称中包含java,但其实与Java没有一点关系,当初取这个名字也只是为了吸引更多眼球。实际上它的正式名称是ECMAScript,目前遵循的标准是ECMA-262。 JavaScript这种语言支持过程式、对象式编程,并且包含了丰富的自定义对象。另外,它还支持DOM对象和Browser对象,具体解释请看下文。有了这些,脚本语言的能力被极大的强化了。最近几年出现的AJAX技术,也是基于这样的框架结构才能得以实现。 客户端脚本语言的特点就是在客户端加载执行,但是其执行时机随浏览器不同而不同,也随不同特性的脚本而不同。使用时需额外注意。

  JavaScript的库有不少,应用比较多的有JQueryJSON。JQuery是个标签库,提供了方便的DOM对象实例查询等功能。JSON是一种轻量级的数据表示格式,说白了就是把对象实例字符串化和反串化。这样就可以在AJAX中由服务器端返回对象类型的数据。(AJAX本身仅支持返回字串或是整个XML文件这两种类型的数据)

  服务端

  服务端脚本语言典型的有ASPJSPPHP、Lua。个人认为目前PHP比较热门(有见于热门的LAMP架构,即Linux+Apache+MySQL+PHP)。服务端脚本可以在服务端解释执行,进行生成客户所需要的页面,返回给客户端。在生成过程中,可以填充一些客户要求的数据,再辅助以HTML的标签进行展示,从而让页面可以动态变化。我们所说的动态网页通常就是指这种了。

  AJAX

  把它放在这个分支中未必正确,不过无所谓了。我要说的是AJAX是一种使用JavaScript实现客户端、服务端异步通信的技术。它依赖于以下几项技术的支撑:一是有力的脚本语言,JavaScript;二是可动态改变的页面结构,DOM;三是服务端事件响应机制(脚本中原来包含的是客户端的事件。通过XMLHttpRequest对象来支持发送请求并通过事件触发响应)。于是,我们就可以做到通过XMLHttpRequest发出请求,然后通过异步的事件响应函数内,依据服务端返回的结果,通过DOM来修改页面(这不需要刷新,因为对浏览器来说仍然是同一个页面)。

  一点题外话,AJAX的出现是必然的。因为在此之前客户端脚本已经具有了修改页面的能力,但是基本无法做到依据服务端的要求而产生变化。所以,需要有服务端的脚本,在服务端替客户生成好相应的页面,并返回给客户端。而这种交互方式,基本上就是客户端提交表单(即GET方法或POST方法),服务端处理并返回结果页面。一个明显的问题就是带宽费,设想一个仅需很小改动的页面,但是数据在服务端。若接GET、POST的方式,必须生成完整的页面。而如果使用AJAX方式,客户端发出的是AJAX请求(通过XMLHttpRequest对象发出),服务端虽然也需要调用相应的脚本处理,但返回的可以只是所需要的数据即可,客户端会自行处理,修改页面放入数据。这样就大大节省了带宽,也提高的页面的响应速率。

模型

  DOM

   DOM,全称文档对象模型。前面说过,HTML是结构型的,XHTML更加严格,要求每个文件必须拥有唯一的根元素。这样看来,整个文件就可以表示成一棵元素树。文档对象模型,就是这种树型结构在内存中的表示。这是实时存储的结构,改变它就会改变页面的显示内容。它的使用也很简单,提供一些API用来定位子对象(即具体某个元素)以及遍历。

  Browser

  同DOM一样,是一组对象,只是其中的内容主要描述浏览器相关的信息,并支持动态修改。

协议

  要传输HTML文档,必须使用HTTP协议或者HTTPS协议。前者大家都熟悉,无状态的超文本传输协议;后者就是加了SSL,使得信息内容加密传输,现如今很多网站都使用HTTPS代替HTTP。

HTTP的无状态带来一些问题。最明显的就是用户访问网站明显看起来是个连续的且有状态的行为。在一些简单的展示或陈列性质的网站上,还是没问题的。但是只要涉及到用户登录之类的,就不行了。对于同一个页面,服务端无法知道,你下一次访问和这一次访问的区别;也无法知道,你和另一个人有什么区别。所以,如果要根据用户来区分显示内容的话,似乎不容易做到。于是Cookie就出现了。它有点像远程调用的Context,附带着请求传输,存储一些内容,服务端可以接收,也可以发送回客户。类似于带外数据。这样的隐含数据通道,就使的HTTP可以部分支持状态了(仍然是伪状态的,因为客户端还是可以通过成功仿造Cookie来伪造请求,骗过服务端)。

架构

  这部分简单说明一下现在流行的Web架构。到目前为止,LAMP仍然占据了超过50%的市场份额。开源、高可扩展性以及相当不俗的性能表现,是它的优点。 Web服务器方面,Apache对动态网页的支持很好,但是在性能上存在一些瓶颈。因此,现在许多网站(例如:新浪、QQ门户等)均使用Ngnix来作为它的前端静态页面的Web服务器,对于动态页面的请求再转发给后端的Apache服务器来处理,再使用Memcahed来缓存一些页面,以提高效率。

Nginx是一种轻量级的Web服务器,支持反向代理和简单的负载均衡。由俄罗斯人开发。其内部采用了epoll、kqueue等高性能I/O复用接口,使其性能表现十分卓越。

工具

  前端页面开发工具很多了,Dreamweaver之类的。调试&Profiling推荐Firebug和Chrome的开发者工具

作者: Peter.Y 发表于 2011-10-29 13:35 原文链接

评论: 0 查看评论 发表评论


最新新闻:
· 百思买即将销售32GB TouchPad,售价149美元(2011-10-29 16:58)
· 改变,从后乔布斯时代开始(2011-10-29 16:41)
· 说人话的乔布斯和苹果(2011-10-29 16:37)
· 微软曾尝试收购Netscape(2011-10-29 16:36)
· Android 设备糟糕的版本升级史(2011-10-29 16:28)

编辑推荐:博问,帮您解决IT难题

网站导航:博客园首页  我的园子  新闻  闪存  小组  博问  知识库

相关 [web 技术] 推荐:

Web技术整理

- Gabriel - 博客园-首页原创精华区
  Web技术或许是将来最为热门的技术之一. 这里略作一些总结,以及对各种Web技术作一些概要性介绍. (以下内容建立在我的粗略理解之上,欢迎指正).   推荐个学习Web技术比较好的网站,介绍的比较全面.   页面的展示使用超文本标记语言(HTML)来表示. 这是一种标签语言,本身不具有执行能力,只是结构化页面内容.

当前最火的web开发技术

- - 博客园_新闻
2014 年 10 月 29 日,万维网联盟泪流满面地宣布,经过几乎 8 年的艰辛努力,HTML5 标准规范终于最终制定完成了,并已公开发布. HTML5 提供了一些新的元素和属性,例如 nav(网站导航块)和 footer. 这种标签将有利于搜索引擎的索引整理,同时更好的帮助小屏幕装置和视障人士使用,除此之外,还为其他浏览要素提供了新的功能,如 audio 和 video 标记.

论Web Service 相关技术(转)

- - 互联网 - ITeye博客
摘要:随着Internet和weh技术的迅速发展,传统的分布式计算技术已经不能 很好的适用于Web环境. 正是基于这种情况,Web Service技术应运而生. Web Service是一个新概念,它的系统架构、实现技术是现有应用的面向Internet的一个延伸. Web是为了程序到用户的交互,而Web Service是为程序到程序的交互作准备,web Service已成为IT产业近几年来探索的热点课题之一.

高并发web服务技术选型

- - 崔永键的博客
主要问题集中在单个GB级数据使用何种DFS的问题上,目前还没有得到可靠的结论. 采用:nginx或 lvs: https://github.com/alibaba/LVS. 实施自己的调度策略:学习配置lvs或改造lvs或自己重写. 调研下采用hdfs还是fastdfs还是其他的:Fastdfs,ZFS,Lustre,HadoopHDFS,GlusterFS.

2010 Web前端技术趋势及总结

- bluesnail - 博客园-首页原创精华区
经过这段时间国内(百度,淘宝,新浪)及国外(Facebook,Youtube,Yahoo)各大公司的集中自曝,我们可以从中总结出2010 Web前端技术的一些趋势. 总的来说,随着后端技术(存储,并发,分布式)的成熟,各大公司已经把重点从后端架构调整/建设转移至前端(TTI时间,快速发布,带宽利用率).

2011年 5 大 Web 前端技术展望

- King - cnBeta.COM
感谢鸟人网BirdUser的投递. 刚刚过去的2010年里,我们看到了 HTML5技术的崛起,以及 CSS3的日渐成熟,经历了 Rails 3.0 新版本的推出,以及全球范围内采用的@font-face selector 技术等等一些更多的新技术和新鲜事情. 2011年将会有什么web前端技术出现或者成熟.

7 项 Web 开发者需要了解的新技术

- TONY - 博客园新闻频道
  Web 开发者需要经常更新他们的知识,学习新的技术,如果他们还想继续在 Web 开发领域混并混得还不错的话. 下面将为你展示 7 项新的 Web 开发技术,作为一个 Web 开发人员,你需要了解、熟悉并学会的技术.   目前,大量智能手机设备的涌现,同时各种不同尺寸屏幕的设备,如平板电脑之类的出现,对 Web 开发带来了前所未有的挑战,如何让 Web 页面能适应各种尺寸的屏幕让很多 Web 开发人员相当的纠结.

五项Web技术:WebGL和SVG名列其中

- - 脚本爱好者
  Bruce Lowson 是 Opera 开放 web 标准的撰写人员之一,一些没有包含在 HTML5 之内的浏览器技术十分奇妙,包括 WebGL 和 SVG,作者希望通过本文与共同爱好者们分享.   别担心,咱们不去管那些啦,因为有些还远远没有完成呢,在浏览器中见到它们还要等一阵子. 然而,其它已经在浏览器中,或者距离您很近,或者马上就要出现.

(转帖) 新的技术产业:Web Performance Optimization

- - kernelchina
【Appleleaf:在很多领域,无论对于中间设备还是服务器,high performance都是最大的Kill App,我们这些C工程,练好本领还有的饭碗端】. 在 O'Reilly Velocity China 2010 大会上,业界最有影响里的 Web 性能技术专家 Steve Souders 宣告 Web Performance Optimization (WPO) 时代已经到来.