三步让你在共享主机(比如Bluehost)的web服务提速50%?Gzip css/js !

作者:半瓶墨水   链接:http://www.2maomao.com/blog/bluehost-gzip-css-js/

由于Ajax的兴起,现在的web服务多数对css和javascript有很强的依赖,网页上的脚本多达几百K。
尤其是使用了比较肥大的ajax框架的网站,这些脚本和css文件在几乎所有网页上都会被使用,严重拖慢了网站的整体速度。

解决方法很简单,将你的文件传递方式搞成gzip即可,一个50K的脚本gzip压缩以后只需要传递15K左右,压缩率高达70%
如果你的网站大量使用了js和css,使用这种方法提速50%非常有可能!

怎么搞呢?参见这篇文章:[转贴] 配置IIS和Apache的HTTP压缩-Gzip (IIS 6.0配置Gzip Apache配置Gzip

但是,但是,但是,如果你是共享主机呢?像Bluehost这样的,怎么办?
别着急,后面介绍的三步曲非常简单,并且完全不用动以前写的代码,不会有人和的冲突问题!

先说说我面临的问题
————————————————————
近几天在学jQuery,使用以后应该会对代码发芽网(fayaa.com/code )的体验有所提升
原来由于js不熟悉导致的一些问题应该也可以避免了

但是,jQuery毕竟体积不小,min版也有54.5k,比代码发芽网的首页还大。
发芽网定位于小而精的产品,所有这样的大小肥了一点儿。
在jQuery网站上看到可以使用gzip压缩,但是实际上Shared host可能不直接提供gzip,比如Bluehost就没有。
上面那个链接中也提到一个简单的php脚本,但是在我看来还是有些复杂。

今天终于搜到一篇文章提到Bluehost上面如何搞定Gzip css/js,根据文章上的方法成功的解决了Bluehost上的css/js文件压缩的问题。

下面贴一下如何三步搞定Bluehost上gzip传输css/js,实现网站提速:
————————————————————
这里用css文件做例子,javascript(.js)文件照葫芦画瓢。
一般情况下css文件都存在一个单独的目录下,比如说是styles目录,进入这个目录
1. 建一个文件命名为.htaccess(包括那个点儿),里面写:

AddHandler application/x-httpd-php .css

2. 再建立一个文件命名为gzip-css.php,内容为:

<?php
ob_start ('ob_gzhandler');
header('Content-type: text/css; charset: UTF-8');
header('Cache-Control: must-revalidate');
 
header('Expires: '.gmdate('D, d M Y H:i:s',time() + 2629743) . ' GMT');
?>

3. 再建立一个文件php.ini,里面内容为:

[PHP]

; Automatically add files before any PHP document.
auto_prepend_file = gzip-css.php

好啦,万事大吉了,对于css文件来说,所有这个目录及其子目录下的css文件都已经自动gzip了!

下一步就是重复上面的步骤,注意
* 在第一步把.css改为.js
* 在第二步文件名为get-js.php,并把text/css改为application/javascript
* 在第三步把get-css.php改为get-js.php

搞定了!就是这么简单!你完全不用动以前写的代码!

最后,如果你不相信,用curl或者firebug里面的”Net”小工具查查原本54K的jQuery现在有多大:
http://www.fayaa.com/static/scripts/jquery-1.2.6.min.js

好吧,我直接说答案好了,17K!,超过70%的提速!
怎么样,赶紧试试吧!

15 条评论 发表在“三步让你在共享主机(比如Bluehost)的web服务提速50%?Gzip css/js !”上

  1. cssrain说道:

    php? 呵呵。。
    不会。

  2. 半瓶墨水说道:

    @cssrain 呵呵不需要会,只要按着要求操作就行,我也不大懂php
    这里的方法是用让服务器处理css/js文件时候按照php处理,这样就可以加上gzip压缩了

  3. cssrain说道:

    暂时不会弄, 现在宽带还行,暂时不考虑 压缩js。

  4. 半瓶墨水说道:

    @cssrain 嗯,有速度限制的时候再考虑优化也可以。
    不过优化网页不光是考虑服务器带宽,也同时影响了别人打开你的网站的速度。

  5. Xiangee说道:

    1.2.6的压缩版只有26kb啊 地址:http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.2.6.pack.js

  6. 半瓶墨水说道:

    @Xiangjee
    压缩版并不推荐使用,理由在这里:http://docs.jquery.com/Downloading_jQuery
    “The minified version, while having a larger file size than the packed version, is generally the best version to use on production deployments. The packed version requires non-trivial client-side processing time to uncompress the code. ”

  7. Xiangee说道:

    @半瓶墨水
    谢谢给出解释,我才下full学习测试,还有看细节呢。

  8. 秋风说道:

    楼主
    麻烦告诉一下你的apache 怎么怎么配置gzip的
    谢谢了

  9. 半瓶墨水说道:

    @秋风 我没有配置它,是虚拟空间服务商(Bluehost)默认的配置

  10. bluehost-cn说道:

    可以交换个友情连接吗?
    bluehost使用经验技巧方面的站
    http://www.bluehost-cn.com

  11. firstloook说道:

    收藏备用,谢谢了

  12. Bluehost说道:

    我就是用Bluehost主机的。这个,还真的得学一学~~

  13. 茶叶说道:

    做好这3个文件,然后放在主机哪里呢?

  14. 茶叶说道:

    关于这个bluehost主机加速 方案,我不是很懂,你能帮我指导一下怎么配置文件,然后具体放在主机那个文件夹里面吗。我的网站是用wordpress做的,我的QQ是289308694,急切你的指导 :p
    谢谢

  15. […]     今天上传了一个jqeury文件,是1.7.2的压缩文件,有92.6kB,然后把他传到服务器上面去,结果一请求发现貌似没有压缩,请求的还是92.6K,查了下貌似bulehost没有对JS,CSS文件进行gzip压缩,在网上搜索了一下,发现一篇文章还不错,传送门,试了下,成功,操作后文件的大小是33.2K,GZIP的压缩能力一向是杠杠的。这个方法貌似是将静态资源当作php文件来处理压缩的。我的博客访问量很小,其实用处也不大,就当是学习了。 分享&收藏 This entry was posted in 杂谈 and tagged bluehost, CSS, gzip, js, 压缩 by choizhang. Bookmark the permalink. […]

留下回复