减低页面加载时间的方法

摘自：  http://www.admin5.net/thread-5110744-1-1.html

 

1. 重复的HTTP请求数量应尽量减少

（1） 减少调用其他页面、文件的数量

 

（2）将需要频繁加载的多个图片合成为1个单独的图片，加载时采用：background:url(....) no-repeat x-offset y-offset的形式加载，图片加载的HTTP请求缩减为1个。即，css sprite  (http://baike.baidu.com/view/2173476.htm)

  不高于200KB的单张图片的所需载入时间基本是差不多的，所以无需顾忌这个问题。

利用CSS Sprites能很好地减少了网页的http请求，从而大大的提高了页面的性能，

CSS Sprites能减少图片的字节，曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。

Css Sprites 缺点：最痛苦的是在宽屏，高分辨率的屏幕下的自适应页面，你的图片如果不够宽，很容易出现背景断裂；

 

2. 服务器启用gzip压缩功能
将要传输的文件压缩后传输到客户端再解压，在网络传输 数据量会大幅减小。在服务器上的Apache、Nginx可直接启用，也可用代码直接设置传输文件头，增加gzip的设置，也可从 负载均衡设备直接设置。不过需要留意的是，这个设置会略微增加服务器的负担。服务器性能不是很好的网站，要慎重考虑。
3. 在文件头部放置css样式的定义
4. 文件末尾放Javascript脚本
网页文件的载入是从上到下加载的，很多Javascript脚本执行效率较低，或者在网页前面都不需要执行的，如果将这些脚本放置到页面比较靠前的位置，可能导致网站内容载入速度下降或加载不了，将这些脚本放置在网页文件末尾，一定要放 置在前面的脚本要改用所谓的“后载入”方式加载，在主体网页加载完成后再加载，防止其影响到主体网页的加载速度。
5. 压缩Javascript、CSS代码
一般js、css文件中存在大量的空格、换行、注释，这些利于阅读，如果能够压缩掉，将会很有利于网络传输。这方面的工具也有很多，可以在百度里搜索一下关键字“css代码压缩”，或者“js代码压缩”将会发现有很多网站都提供这样的功能，当然了你也可以自己写程序来做这个工作，如果你会的话。就拿我们这个网站来说吧。刚开始上传这个网站的时候，我的很多Css代码都没有压缩，后面发现了这个问题，我就上网找了相关的网站的压缩代码的功能，最后就把很多CSS文件都压缩了。这个压缩比率还是比较高的，一般都有百分五十左右。这个代码压缩对于网页的加载还是很有用的。
6. Ajax采用缓存调用
Ajax调用都采用缓存调用方式，一般采用附加特征参数方式实现，注意其中的<script src=”xxx.js?{VERHASH}”，
{VERHASH}就是特征参数，这个参数不变化就使用缓存文件，如果发生变化则重新下载新文件或更新信息。
7. 尽可能减少DCOM元素
尽可能减少网页中各种<>元素数量，例如<table>的冗余很严重，而我们完全可以用<div>取代之。