玩转网站速度提升:让你的网站飙升访问速度

2023-11-24 理论教育版权反馈

【摘要】：网站的访问速度问题已经直接影响到了网站的流量，而网站的访问量几乎与网站的利益直接挂钩，因此网站的速度问题成为企业及站长十分关注的问题。下面就如何提高网站访问速度提出一些建议，希望对大家有所帮助。用户连接网站服务器的速度影响响应的快慢。

据Websense调查公司称多达70％的上网者表示不愿意在页面读取上超过8秒钟，超过70％的人会因为“慢悠悠的网页下载速度”而放弃在线浏览和购物行为。网站的访问速度问题已经直接影响到了网站的流量，而网站的访问量几乎与网站的利益直接挂钩，因此网站的速度问题成为企业及站长十分关注的问题。下面就如何提高网站访问速度提出一些建议，希望对大家有所帮助。

我们浏览网页实际上是将虚拟主机中的网页内容下载到本地硬盘，再用浏览器解释查看。下载网页的快慢在显示速度上占了很大比重，所以，网页本身所占的空间越小，那么浏览速度就会越快。这就要求在做网页的时候遵循一切从简的原则，如：不要使用太大的Flash动画、图片等资源。干净、简洁的页面会给人一种思路明朗的感觉。

众所周知，ASP、PHP、JSP等程序实现了网页信息的动态交互，运行起来的确非常方便，因为它们的数据交互性好，能很方便地存取、更改数据库的内容，使网站“动”起来，如：论坛、留言板等。但是这类程序必须先由服务器执行处理后，生成HTML页面，然后再“送”往客户端浏览，这就不得不耗费一定的服务器资源。如果在虚拟主机上过多地使用这类程序，网页显示速度肯定会慢，所以没有必要，请尽量使用静态的HTML页面。

很多站长为了追求页面统一对齐，将整个页面的内容都塞进了一个Table（表格）里，然后再由单元格td来划分各个“块”的布局，这种网站的显示速度是绝对慢的。因为Table要等里面所有的内容都加载完毕后才显示出来的，如果某些内容无法访问，就会拖延整个页面的访问速度。正确的做法是：将内容分割到几个具有相同格局的Table中去，不要全都塞到一个Table里。

在ASP、ASPX、PHP等程序设计时应该注意，如果要在静态的HTML页面里嵌入动态的数据，而这些动态的数据是由ASP、PHP等程序来提供的话，会使用以下的语句引用，这样的话，每次有一个人访问你的网站，服务器就要执行并处理一次tongji.asp文件，从数据库抽取相应的数据，再输出给网页显示，如果有几万个人同时访问，就要执行几万次，后果就可想而知。建议在这些程序中将数据动态生成到一个1.js文件中去，然后在首页通过<SCRIPT src="http://www.XXX.com/1.js"></SCRIPT>这样的代码来引用该1.js文件。这样，数据显示的任务就交给客户端的浏览器去做，不会耗费服务器的资源，显示速度自然就很快。

如果你要在网站上插入一些广告代码，又不想让这些广告网站影响速度的话，那么，使用iframe最合适不过了。方法是：将这些广告代码放到一个独立的页面去，然后在首页用如下的代码将该页面嵌入即可，这样就不会因为广告页面的延迟而拖了整个首页的显示，代码如下：

其中http://www.***.com是被引用文件的路径。

在网页里放置计数器可以统计网站的访问流量，为站长和广告商家提供访问依据。但是，不管功能有多强大的网站统计系统，都会有出故障的时候。如果直接把统计代码放到页面内容的前面，或者放在一个Table或者div标签里，那么在计数器不能访问的时候，你的页面上那个Table或者div就会产生几十秒钟的延迟，导致页面很长时间才能访问。所以，要提高网站的速度，就要讲究统计代码放置的位置，正确的方法是：把统计代码放到页面的最下面，并且不要和页面内容同在一个Table或者div标签里。可以在页面代码的最下方直接放置统计代码，或者在最下方单独做一个Table或者div来放置计数器。这样，在计数器不能访问的时候，你的网站速度也不会受到丝毫影响。

网站之间互相做链接可以增加网站的宣传效果，做LOGO图片链接更能准确地描述网站的主题和定位，宣传效果会大大地增强，但图片链接做得太多，必然会影响网页的显示速度。很多站长都喜欢直接引用友情网站上的图片URL，这样图片要先经过加载才能显示，各个友情网站的访问速度不一样，整个表格都要等图片都下载完了才能显示出来，这样大大降低了网页的速度。因此，做友情链接时应尽量做到：

（1）只做文字链接：做文字链接是不会延迟网页速度的。

（2）将所有链接放到一个独立的分页去，然后在首页链接上该页。

（3）如果友情链接一定要出现在首页，请将链接所在的整个Table放到页面的最下方，因为页面是由上到下逐行显示的，将其放到页面的最下方，不会延迟其他内容的显示。

（4）友情链接的LOGO图片先下载后再传到自己的网页空间，这样，速度由自己的网站空间决定而不受友情网站的影响。

下面介绍在提高网站访问速度过程中，用于解决具体问题的方法：

（1）减少HTTP请求数量。

80％的用户响应时间被花费在下载页面中的图片、样式表、脚本以及Flash这些组件。减少这些组件的数量就可以减少展示页面所需的请求数，而这是提高网页响应速度的关键。

（2）使用内容分布式网络。

用户连接网站服务器的速度影响响应的快慢。把你的网站布置在多台分布于不同地域的服务器上，会让用户觉得你的页面加载速度更快。

（3）给头部添加一个失效期或者Cache-Control。

给头部添加far future失效期，可以增加浏览器缓存的组件数量并重复用于随后的页面浏览而不需要通过用户的网络发送哪怕一个字节。

（4）Gzip压缩组件。

压缩文件会减少HTTP响应的大小从而减少响应的时间。

（5）把样式表放在前面。

把样式表挪到文档的头部可以让页面的加载显得更快。因为把样式表放在头部可以让页面逐步呈现。

（6）把脚本放在最后。

脚本可能会堵塞并发的下载。通常的建议是使用延迟脚本。如果一个脚本可以被延迟，那么它也可以被放在页面的底部。这会让你的页面加载得更快。

（7）不使用CSS表达式。

CSS表达式的问题是它比大多数人期望的执行次数更频繁。

（8）使用外部的JavaScript和CSS。

在实际应用中使用外部的文件往往产生更快的页面，因为浏览器会缓存JavaScript和CSS文件。

（9）减少DNS的查询。

减少不同域名的数量可能减少页面并行的下载数量。

（10）缩小JavaScript和CSS。

缩小是指从代码中删除不必要的字母，减少文件体积从而提高加载速度。

（11）避免重定向。

重定向降低了用户体验。在用户和HTML文档之间插入的重定向延误了页面的呈现和组件下载，因为它们都不可能在获得HTML文档之前开始。

（12）移除重复的脚本。

在同一个页面中包含两个相同的脚本文件降低了性能。当脚本被重复包含时，由于增加了不必要的HTTP请求和JavaScript的执行，影响了性能。

（13）设定ETags。

ETag的问题是它们往往在网站的一个服务器中被设为唯一的，当浏览器从一个服务器得到了组件并在稍后试图到另一个服务器验证时，ETag会不匹配，而这在使用多个服务器来处理请求的网站中是很常见的。

（14）让Ajax可以缓存。(www.chuimin.cn)

Ajax的好处之一是它能给用户提供瞬间的响应，因为它从服务端异步请求数据。为了提高性能，优化Ajax响应很重要。提高Ajax性能最重要的方式是使响应缓存。

（15）更早地刷新缓冲区。

当用户请求一个页面，服务端会花费200至500毫秒的时间组合HTML页面。

（16）在Ajax请求中使用GET方法。

（17）后加载组件。

当你确保页面工作正常时，通过延后加载的那些更花哨的脚本比如拖放和动画，可以来增强你的页面。

（18）预先加载组件。

预先加载组件让你可以利用浏览器的空闲时间来加载之后需要的组件（比如图片，样式表和脚本）。这样当用户浏览下一个页面的时候，大部分组件都已经在缓存里了而页面会加载得更快。

（19）减小DOM元素的数量。

复杂的页面意味着更多的字节需要被下载。你在页面中添加一个事件，让它在500或者5000个DOM元素中循环，它们的效率是不同的。

（20）分域部署部件。

将部件分割能使你获得最大的并行下载效率。但你同时需要注意不使用多于2~4个域名，以避免DNS查询导致的问题。

（21）减少Iframe的数量。

Iframes能够使HTML文档被插入进父级文档中。

（22）避免404错误。

一个获得没用的404响应的HTTP请求对于宝贵的HTTP请求资源来说是完全不必要的，而且这样还会减慢用户的体验。

（23）减少Cookie的大小。

有多种理由让我们应用HTTP Cookie，比如身份验证，或者个性化设置。Cookie中的信息在服务端和浏览器间被放在HTTP头中交换。尽量减少Cookie的体积对减少用户获得响应的时间十分重要。

（24）为部件使用没有Cookie的域名。

当浏览器请求一个静态图片并一同发送Cookie时，服务器并不需要这些Cookie。这样只是毫无益处地创建了多余的网络流量。应当保证静态的部件在请求时没有携带Cookie，所以需要把你的静态部件放在另一个子域名下。

（25）减少DOM的读取。

利用Javascript读取DOM元素很慢，所以为了获得响应更快的页面，你应该：

•缓存被读取的元素引用。

•脱机更新节点，然后把它们加回到树结构中。

•避免利用Javascript定位布局。

（26）开发灵巧的事件处理程序。

如果有太多的事件处理逻辑部署在DOM树的不同元素上，它们的频繁执行会拖慢页面的响应速度。

（27）选择<link>而不是@。

前面提到把CSS应当放在最顶端来提供预显。在IE中，放在页面底部的@import和<link>效果是一样的，所以最好不要用它。

（28）不使用过滤器。

IE专有的AlphaImageLoader过滤器是为了解决半透明真色PNG图片在IE7之前的版本中显示的问题。这个过滤器会在图片下载时堵塞住展示。而且它会消耗内存并影响每个元素而不仅仅是每张图片，所以这个过滤器的问题很多。

（29）优化图片。

（30）优化CSS精灵。

横向布局Sprite中的图片往往比纵向布局会减少文件大小。

（31）不要在HTML中缩放图片。

不要使用大小超过需要的图片，即使你能够在HTML中设置它的属性。

（32）使用小的可缓存的Favicon.ico。

Favicon.icon是放在服务器根目录的一个图片，它麻烦却不得不处理，因为即使你不关心，浏览器依然会请求这张图片，所以最好不要提供一个404的错误。而且由于它是在同一服务器下的，Cookie也会随着每次请求一并发送。这张图片同样干扰下载队列，比如在IE中，当你在onload事件中请求额外的组件时，Favicon会在这些额外组件之前下载。

（33）保证组件大小小于25K。

（34）把组件打包进多部分文档中。

玩转网站速度提升:让你的网站飙升访问速度

相关推荐