gzip 压缩 css,js 等文件

前几天写了一篇合并css和js文件,加快浏览速度的文章,感觉上速度确实有点提高,而最后把速度仍然比较慢归因于国外服务器数据传输的速度慢 !后来在Storyday那里看到一篇wordpress提速的文章,压缩css文件和js来提速。其实很早看关于wp优化的文章的时候就看到过对css和js进行压缩来提速,但是一直都不以为然。因为我想css和js文件经过合并,然后使用CSS TweakShrinksafe分别压缩css和js文件,就可以把两者的总大小缩减至16K+3K,再使用Gzip压缩意义不大。现在发现我彻底错了!

我合并了css和js文件,只是减少了HTTP Requests。因为每个HTTP Requests都有一定的延时,所以较少HTTP Requests数量自然可以缩短一定的访问时间。但是需要下载的首页代码的大小也是一个重要的因素。使用Web Page Analyzer查看了下本站首页,其实html代码仅仅9K,而css和js一起却将近20K,也就是说其实大部分的时间都在下载css和js文件,而且它们是在head里载入的,下载完成之前,只能看到空白页,这样影响的访问速度非常明显!所以对css和js文件进行压缩是非常有必要的!

尝试使用wordpress提速这篇文章里提供的Gzip压缩css和js文件的代码,但是发现这样会导致整个style.css不起作用!也不知道为什么?以前在我的blog里使用Storyday的cos-html-cache插件里读取cookies代码也会出现一些问题!难道是RPWM?

现在使用阅微堂提供的Gzip压缩代码如下:

  1. <?php
  2.     $file="all.js";
  3.     header("Expires:".gmdate("D, d M Y H:i:s", time()+15360000)."GMT");
  4.     header("Cache-Control: max-age=315360000");
  5.     $mtime = filemtime($file);
  6.     $gmt_mtime = gmdate('D, d M Y H:i:s', $mtime) . ' GMT';
  7.     header("Last-Modified:" . $gmt_mtime);
  8.     $ext = array_pop(explode('.', $file));
  9.     switch ($ext){
  10.     case 'css':
  11.      header("Content-type: text/css");
  12.      break;
  13.     case 'js' :
  14.      header("Content-type: text/javascript");
  15.      break;
  16.     case 'gif':
  17.      header("Content-type: image/gif");
  18.      break;
  19.     case 'jpg':
  20.      header("Content-type: image/jpeg");
  21.      break;
  22.     case 'png':
  23.      header("Content-type: image/png");
  24.      break;
  25.     default:
  26.      header("Content-type: text/plain");
  27.     }
  28.     if(extension_loaded('zlib')){ob_start('ob_gzhandler');}
  29.     echo implode('', file($file));
  30.     if(extension_loaded('zlib')){
  31.     ob_end_flush();
  32.     }
  33. ?>

上面代码的将本站20K左右的css和js代码压缩到了6k以下,而且它不仅压缩代码,还要求浏览器端Cache这个文件,这样不用每次浏览都下载这些文件。如果你没有进行css和js合并(强烈建议合并)的话,那么在echo处添加多个css或者js文件即可。

现在的访问速度真正有了一个质的飞跃,首页的访问时间至少提高了4s。

 
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值