网站前端技术及其对网站性能影响研究.docVIP

网站前端技术及其对网站性能影响研究 　　摘要：随着互联网和电子商务的发展，人们对网站的要求越来越高，网站流量越来越大，页面组件也越来越多，这就使得网站响应速度变慢，为了提高网站的前端性能，本文首先对网站前端的相关开发技术进行分析，然后研究了网站前端开发技术对网站性能的影响，最后根据这些影响提出网站前端开发应遵循的技术规范。 　　关键词：网站前端 网站前端技术 网站前端性能 　　1 网站前端开发技术分析 　　1.1 HTML语言 　　HTML（Hypertext Markup Language）是指超文本标记语言，是制作网页必须使用的语言，也是构成网页文件的主要语言。HTML语言是一种标记语言，由一系列的标记组成，他通过标记来格式化各种页面元素，某个标记可以使他所标记的内容具有某种格式或特征，从而使得页面可以按照需要的格式呈现。 　　HTML网页文件需要在网页浏览器中打开，这种程序需要网页浏???器解释执行，各种网页浏览器都可以完美的支持HTML语言，所以用HTML语言制作的网页可以供使用各种浏览器的用户浏览。 　　1.2 CSS样式表 　　随着Internet应用越来越普及，对Internet程序的要求越来越高，而Internet程序一般都是做成网站形式，所以就对网站制作技术有了更高的要求，CSS就是为了弥补HTML 的不足而出现的。CSS（Cascading Style Sheet）是指层叠样式表，他不是一种语言，由一系列的属性组成，他通过属性来格式化各种页面元素，某些属性可以使他所作用的内容具有某些格式或特征，从而使得页面可以按照需要的格式呈现。 　　在网页中嵌入CSS代码有三种方法：①直接在需要使用CSS样式的标记中添加CSS代码。②在STYLE标记中添加CSS代码。③在外部样式表文件中添加CSS代码。 　　1.3 客户端脚本语言 　　HTML和CSS都是进行页面布局的技术，他们只能对页面进行格式化，要想使页面具有动态效果、能够与用户交互，就需要在页面上编写程序，这就促使了客户端脚本语言的出现。客户端脚本语言是编写嵌入到网页中的一段一段独立程序的编程语言。客户端脚本语言有JavaScript和VBScript两种，目前常用的客户端脚本语言是由Netscape公司开发的JavaScript。通过在网页上嵌入由JavaScript编写的程序，可以使得页面内容或格式根据设置的条件或用户的操作发生变化，从而实现页面的动态效果。 　　在网页中嵌入客户端脚本有三种方法：①直接在需要使用脚本的标记中添加脚本。②在SCRIPT标记中添加脚本。③在外部脚本文件中添加脚本。 　　2 网站前端开发技术对网站性能的影响 　　2.1 HTML语言对网站性能的影响 　　2.1.1 HTML文档大小 　　用HTML语言编写的网页保存起来是一个以“html”为扩展名的文本文件，一般把它称作HTML文档。该文件会占用一定的存储空间，当用户请求该文件时，该文件需要被从服务器端下载到客户端，这就需要占用网络带宽，下载过程需要一定的时间。在相同网速下，HTML文档越小，下载所需要的时间就越短，用户的等待时间就越短，网站前端性能就越好。 　　2.1.2 网页图片的数量 　　为了美观，网页上都需要使用图片，图片是通过HTML语言的“IMG”标记插入的，但是图片文件本身并不在HTML文档中，而是一个单独的图片文件，通过“IMG”标记调用到页面上。因此，当用户请求一个HTML文档时，HTML文档本身和网页上调用的图片文件是被分别下载到客户端的，每一个单独文件的下载都需要一个HTTP请求，每一个HTTP请求连接的建立都需要时间。所以，一个页面上图片越多，所需要的HTTP请求数量就越多，下载所需要的额外时间越长。 　　2.1.3 网页图片缓存 　　HTML文档中调用的图片可以被浏览器缓存到客户端，当用户再次请求同一个HTML文档时，这些被缓存的图片就不需要再次下载，从而减少HTTP请求的数量，同时减少HTTP响应的大小，进而减少用户的等待时间，提高网站前端的性能。 　　2.2 CSS样式表对网站性能的影响 　　2.2.1 样式表的数量 　　一般在一个HTML文档中可以加载多个样式表文件，类似于HTML文档中引用的图片，当用户请求一个HTML文档时，HTML文档和样式表文件被分别下载到客户端，每一个文件的下载都需要一个HTTP请求，每一个HTTP请求连接的建立都需要时间。所以，一个HTML文档中样式表越少，所需要的HTTP请求数量就越少，下载所需要的额外时间越短。 　　2.2.2 样式表缓存 　　HTML文档中加载的样式表文件可以被浏览器缓存到客户端，当用户再次请求同一个HTML文档时，这些被缓存的样式表文件就不需要再次下载，从而减少HTTP请求的数量，同时减少HTTP