减少页面加载时间的方法。（加载时间指感知的时间或者实际加载时间）

绝地灬酷狼 2022-07-18 05:45 223阅读 0赞

*     **1. 尽量减少页面中重复的HTTP请求数量**  
    比较直接的理解就是要减少调用其他页面、文件的数量。我们在使用css格式控制的时候，经常会采用background载入很多图形文件，而每个background的图像都会产生1次HTTP请求，一般我们为了让页面生动活泼会大量使用background来加载背景图，要改善这个状况，可以采用css的1个有用的background-position属 性来加载背景图，我们将需要频繁加载的多个图片合成为1个单独的图片，需要加载时可以采用：background:url(....) no-repeat x-offset y-offset;的形式加载即可将这部分图片加载的HTTP请求缩减为1个。  
    **2. 服务器开启gzip压缩**  
    即将需要传输的内容压缩后传输到客户端再解压，这样在网络上传输的 数据量就会大幅减小。通常在服务器上的Apache、Nginx可以直接开启这个设置，也可以从代码角度直接设置传输文件头，增加gzip的设置，也可以从 负载均衡设备直接设置。不过需要留意的是，这个设置会略微增加服务器的负担。建议服务器性能不是很好的网站，要慎重考虑。  
    **3. css样式的定义放置在文件头部  
    4. Javascript脚本放在文件末尾**  
    我们都知道网页文件的载人是从上到下的加载的，而有很多Javascript脚本执行效率比较低下，或者在网页前面都不需要执行的，如果将这些脚本放置到页面比较靠前的位置，很可能会导致网站内容载入速度下降甚至无\*\*常加载，所以一般将这些脚本放置在网页文件末尾，一定要放 置在前面的脚本要改用所谓的“后载入”方式加载，在主体网页加载完成后再加载，防止其影响到主体网页的加载速度。  
    **5. 压缩Javascript、CSS代码**  
    一般js、css文件中存在大量的空格、换行、注释，这些利于阅读，如果能够压缩掉，将会很有利于网络传输。这方面的工具也有很多，可以在百度里搜索一下关键字“css代码压缩”，或者“js代码压缩”将会发现有很多网站都提供这样的功能，当然了你也可以自己写程序来做这个工作，如果你会的话。就拿我们这个网站来说吧。刚开始上传这个网站的时候，我的很多Css代码都没有压缩，后面发现了这个问题，我就上网找了相关的网站的压缩代码的功能，最后就把很多CSS文件都压缩了。这个压缩比率还是比较高的，一般都有50%左右。由此可见，这个代码压缩对于网页的加载还是很有用的。  
    **6. Ajax采用缓存调用**  
    Ajax调用都采用缓存调用方式，一般采用附加特征参数方式实现，注意其中的<script src=”xxx.js?\{VERHASH\}”，\{VERHASH\}就是特征参数，这个参数不变化就使用缓存文件，如果发生变化则重新下载新文件或更新信息。  
    **7. 尽可能减少DCOM元素**  
    这个很好理解，就是尽可能减少网页中各种<>元素数量，例如<table>的冗余很严重，而我们完全可以用<div>取代之。  
    **8. 使用多域名负载网页内的多个文件、图片**
 *  **9. 使用CDN**
 *  **10. 在服务器端配置control-cache  last-modify-date**  
    
 *  **11.在服务器配置Entity-Tag     if-none-match**