十年风雨路 · 一心铸精品

接一个官网 留一件精品 做一个项目 树一块样板

提高网站打开速度技巧就是减少HTTP请求

今天主要是讲的是减少http请求数量,提高网站访问速度的方法有:合并js/CSS文件,图片合并,其实访问网站的大部分时间就是浪费在过多的http请求,如果我们的网站文件减少了,就会大大的减少http请求数,从而提高我们网站的访问速度。今天我来为大家讲解第二个方法,让大家网站打

时间:2013年11月08日 点击量:

今天主要是讲的是减少http请求数量,提高网站访问速度的方法有:合并js/CSS文件,图片合并,其实访问网站的大部分时间就是浪费在过多的http请求,如果我们的网站文件减少了,就会大大的减少http请求数,从而提高我们网站的访问速度。

今天我来为大家讲解第二个方法,让大家网站打开速度提高,那就是减少http的请求,为什么减少http的请求就能够提高网站访问速度,首先我们来看看web的工作原理,首先我们输入一个域名:http://www.scgckj.com 让后按回车,这时候这个域名就和指向的服务器建立连接,让后浏览器就向服务器发http送请求信息,服务器收到用户请求信息后,服务器就会向浏览器端发送对应的信息,浏览器收到服务端发送过来的信息后,就断开连接释放连接;
     如果我们请求的网页中有很多的javascript,css,图片,这样会频繁的和服务器建立连接、释放连接,这样会极大的造成服务器资源的浪费,比如同意的网速,下载一个100K的css文件比下载两个50K的css文件要快,我们为了减少资源的浪费就要减少http的请求,下面我为大家一一讲解减少http请求的方法:

 

一、合并js/CSS文件:
         在Web项目的开发中,js,css文件会随着项目的开发变得越来越多,越来越大,这就给给性能方面带来一些问题,如,页面引入的的js,css越多的话,那么对就增加了http请求数,解决该问题的一个好的方法就是合并js,css文件。

         下面就简单介绍一个方法,十分简单.下面介绍以合并js文件为例
             (1)  G.js文件
               ~function(){
                     window.G={};
                                G.Method={
                                        add:function(){  alert(111);}
                                        ,sub:function(){  alert("减法");}
                                 };
              }();
        (2) T.js文件
              var T=(function(){
                     return {
                      t1:function(){alert("t1 method!")}
                             ,t2:function(){alert("t2方法!")}
                             ,sum:function(obj){return obj.x+obj.y;}
                      };
        }());
        上面列出了连个简单的js文件,下面就要写一个批处理文件来合并以上文件了
        (3) 合并js,css文件的批处理方法,文件名假设命名为 debug.bat
              copy  G.js+T.js  GT_bin.js   /b
               说明:
                   (1)  输入要合并的js文件,保存debug.bat文件,运行debug.bat即可.
                   (2)  就这么一行代码就搞定了,十分简单,GT_bin.js 为合并之后的文件名称 , /b是固定参数,文件合并之后,页面就只引用GT_bin.js就可以了,从而减少了js文件的引用,到达了减少http请求的次数,提高了网站的性能.
                  (3) 合并css文件方法也是如此。

二、图片合并
            使用CSS Sprites图片合并把网页里面的多张图片合成一张图片,这减少http的请求数量,从而提升网站打开速度,下面我来为大家讲解CSS Sprites使用方法:
            我们用CSS Sprites工具把网页上面几张小的背景图片整合到一张大图片上面,让后通过css样式获取图片的位置,在把图片显示在网页上面。
            来看一个CSS Sprites 图片:

            图片引

推荐案例

  • 成都森美啦园林绿化工程公

  • 四川尚恒科技有限公司

  • 成都九邦物流有限责任公司

  • 四川品睿餐饮管理有限公司

  • 美绘陶社陶艺手绘工作室-暖

  • 成都恩多施生物工程技术有

  • 汶川羌人土特产有限公司

  • 印刷设计公司网站No.3138

联系我们 / CONTACT US

  • 四川省成都市金牛区五福桥东路229号龙湖北城天街28栋903室
  • 服务热线:400-000-2367 028-86088588
  • 总机:028-62322623-0
  • 传真:028-62322623-823

扫码访问冠辰手机网站

版权所有 Copyright © 2002-2019 四川冠辰科技开发有限公司  www.scgckj.com 保留所有权利  蜀ICP备11012605号

地址:四川省成都市金牛区五福桥东路229号龙湖北城天街28栋903室

服务热线:400-000-2367 028-86088588 总机:028-62322623-0 传真:028-62322623-823