`
wbj0110
  • 浏览: 1598540 次
  • 性别: Icon_minigender_1
  • 来自: 上海
文章分类
社区版块
存档分类
最新评论

为加速网站访问速度,使用PHP和GZip压缩网站JS/CSS文件

    博客分类:
  • php
阅读更多

一些泛WEB 2.0网站为了追求用户体验,可能会大量使用CSS和JS文件。这就导致在服务器带宽一定的情况下,多用户并发访问速度变慢。如何加快网页响应速度?解决办法之一就是:依照Yahoo性能优化小组提出的N条性能优化建议对前端程序进行优化和重构,关于此文的讨论很多,在这里不再赘述。

这篇文章主要分享一下我个人在实际项目中,对于使用PHP对JS和CSS进行压缩的经验,在这里假设服务器仅支持GZIP压缩,不支持.htaccess(符合很多站长的租用的虚拟主机实际情况)。

首先说说对CSS和JS文件进行性能优化的几个小技巧:

将多个CSS/JS文档合并成一个文件,以减少HTTP请求

对合并后的文件进行文档压缩,比如分别使用js compressor和CSS compress

如果使用到一些主流的JavaScript框架,比如JQuery, Mootools或者YUI,强烈推荐直接使用Google AJAX Library以外部链接的形式导入基库。

最后,就是本文所提到的,使用GZIP在服务器端对JS/CSS文档进行压缩。

这里提到的方法对系统来说是无侵入式的,也就是说不管你的程序是新编写的,还是已经上线了很久,均适用。

先看我对图标吾爱进行优化的实例截图(YSlow):

使用PHP/GZIP压缩JS/CSS文档

在这个例子中,我分别对服务器输出的HTML文档、JS文档和CSS文档使用了GZIP压缩,可以看到压缩效果非常明显,文件体积减小了70%以上。页面加载速度明显加快。

实际上,用PHP使用GZIP压缩非常简单,其核心是使用ob_gzhandler,不过需要注意的一点是,并不是所有浏览器都支持GZIP传送到客户端的数据,所以要进行一定的容错处理。

下面是使用PHP通过GZIP压缩CSS的实例。

在存放CSS的文件夹中新建一个style.php文件,在此文件中加入以下代码:

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

if(extension_loaded('zlib')){//检查服务器是否开启了zlib拓展
ob_start('ob_gzhandler');
}
header ("content-type: text/css; charset: gb2312");//注意修改到你的编码
header ("cache-control: must-revalidate");
$offset = 60 * 60 * 24;//css文件的距离现在的过期时间,这里设置为一天
$expire = "expires: " . gmdate ("D, d M Y H:i:s", time() + $offset) . " GMT";
header ($expire);
ob_start("compress");
function compress($buffer) {//去除文件中的注释
$buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);
return $buffer;
}
 
//包含你的全部css文档
include('global.css');
include('layout.css');
 
if(extension_loaded('zlib')){
ob_end_flush();//输出buffer中的内容,即压缩后的css文件
}
?>

 

如果你处理的是JavaScript文件,你需要将上面代码中的第5行的Content-type修改成以下:

header ("content-type:application/x-javascript; charset: gb2312");

同样需要注意的是文件的编码,这里我用的是gb2312,如果你采用的是UTF-8或其他编码,修改成对应的即可。

修改完成之后,在原引入CSS和JS文件的地方,将.css后缀/.js后缀的文件更换成这个style.php文件即可,如:

script type="text/javascript" src="http://www.icon52.net/scripts/autoSuggest.js.php?v=121

由于上面代码中使用到了HTTP的Expires(过期)属性用于在客户端缓存CSS/JS代码,所以,如果过期时间设置的太长(比如2020 年),当你在服务器端修改了JS/CSS代码时,客户端可能不会立即生效。解决办法是:在php文件后面添加一个随机参数,如上面例子中的v=121,当下次修改了文件时,记得相应修改此随机参数即可。

 

原文链接:http://www.chinaz.com/web/2009/0830/89217.shtml

分享到:
评论

相关推荐

    网站镜像克隆程序PHP源码

    4、外加Gzip压缩,访问速度提升效果杆杆滴。 5、内外链转换功能,网址是否加密,由你决定。 6、强大的正则替换,替换过滤、伪原创、换广告、近义词。 7、支持各种编码。 8、以本地文件优先,JS、CSS、图片等都可以...

    IIS的Gzip压缩图文教程

    在现代互联网环境中,网站的访问速度至关重要。它不仅影响用户体验,还与搜索引擎排名息息相关。众多因素共同决定了网站的加载速度,其中包括应用程序的响应时间、网络带宽、服务器硬件性能、网络传输延迟以及服务器...

    教你如何在自己的vps中实现GZIP网页压缩.pdf

    在SEO(搜索引擎优化)领域,启用GZIP压缩有助于提升用户体验,因为用户可以更快地访问和浏览网页,这也有利于网站在搜索引擎中的排名。 GZIP工作原理是通过识别和压缩重复的字符串,将HTML、CSS、JavaScript等文件...

    面试题缓存策略的选择篇.pdf

    通过模板引擎和PHP的ob系列函数(`ob_start`、`ob_get_content`、`ob_clean`、`ob_end_flush`)可以将动态脚本的输出重定向到静态HTML文件,从而提高访问速度和降低服务器压力。 综上所述,选择合适的缓存策略和...

    PHP+.htaccess实现全站静态HTML文件GZIP压缩传输(一)

    标题中的“PHP+.htaccess实现全站静态HTML文件GZIP压缩传输(一)”是指通过PHP脚本配合Apache服务器的.htaccess配置文件,实现网站所有静态HTML文件的GZIP压缩,从而减少网络传输的数据量,提高页面加载速度并节省...

    php压缩多个CSS为一个css的代码并缓存

    在PHP中,将多个CSS文件压缩成一个文件并进行缓存是一种常见的性能优化技术,它有助于减少HTTP请求的数量,加快页面加载速度,并节省带宽。下面我们将详细解释这个过程以及提供的代码片段。 首先,让我们看看这段...

    Windows2003服务器安装及设置教程之十八IIS优化篇.doc

    启用Gzip压缩是一项关键的优化策略,它能够通过压缩HTML、JavaScript、CSS等静态文件以及asp、aspx、php、jsp等动态文件,减少网络传输的数据量,从而加快客户端浏览器的访问速度。以下为启用Gzip压缩的步骤: 1. ...

    wordpress 加速插件

    在WordPress网站管理中,速度和性能是至关重要的因素,它们直接影响到用户体验和...正确选择和配置加速插件,可以显著提升WordPress网站的加载速度,为用户提供更流畅的浏览体验,同时也有助于网站在搜索引擎中的排名。

    单域名PHP网站镜像克隆程序网站源码.zip

    5、外加Gzip压缩,访问速度提升效果杆杆滴。 6、内外链转换功能,网址加不加密?有些域名不想转换?都你说了算。 7、强大的正则替换,替换过滤?伪原创?换广告?近义词?这些都不是事。 8、支持各种编码,妈妈再也...

    PHP实例开发源码—QQ音乐一键加速 php版.zip

    2. **HTTP协议与请求优化**:QQ音乐的一键加速可能涉及到对HTTP请求的优化,例如减少HTTP请求数量、合并CSS和JavaScript文件、启用GZIP压缩、设置合适的缓存策略等。 3. **缓存机制**:使用PHP实现的缓存系统可以...

    php加速浏览器下载页面的时间

    - 优化Nginx或Apache配置,例如开启GZIP压缩,减少网络传输量。 - 使用HTTP/2协议,它支持多路复用,可以同时处理多个请求,减少延迟。 7. **内容分发网络(CDN)**:通过CDN服务,将静态资源如图片、CSS、...

    PHP实现保存网站用户密码到css文件(通用型)

    同时,文件中还提供了一个PHP实现文件压缩传输的技术细节,展示了如何通过PHP脚本实现更高效的文件传输策略,即利用gzip压缩技术对多个文件进行压缩,并通过特定的PHP脚本接口进行访问和传输。这种方法可以有效减少...

    LINUX服务器配置(下)

    ### LINUX服务器配置(下):使用mod_gzip对Apache进行Web压缩 在LINUX服务器配置的过程中,使用...通过以上步骤,你可以成功地在LINUX服务器上使用mod_gzip对Apache进行Web压缩,从而提高网站的访问速度和用户体验。

    wordpress页面压缩 加速网站访问的方法

    【WordPress页面压缩】是提高网站访问速度的有效策略之一。页面压缩通过减少HTML、CSS和JavaScript文件的大小,降低了网络传输的数据量,从而加快了页面加载时间。这不仅可以改善用户体验,还可以对SEO产生积极影响...

    PHP开启gzip页面压缩实例代码

    GZIP压缩技术是一种广泛使用的数据压缩算法,在互联网中传输数据时常用它来减小文件体积,从而加快文件在网络上的传输速度。这项技术尤其适用于静态资源的传输,比如HTML、CSS和JavaScript文件。通过减少传输数据量...

    设置tomcat启用gzip压缩的具体操作方法

    启用Tomcat的gzip压缩,需要修改`%TOMCAT_HOME%/conf/server.xml`配置文件中的`<Connector>`节点。具体步骤如下: 1. 打开压缩功能:在`<Connector>`节点中添加`compression="on"`,这表示开启gzip压缩。 2. 设置...

    Gzip压缩启用图文方法详细说明【IIS6.0、Apache】

    由于Gzip压缩能够有效地减小数据传输量,因此被广泛用于提升WEB应用程序的性能,尤其是高流量网站,经常利用Gzip压缩技术来提高用户访问速度。 使用Gzip压缩技术,通常可以将纯文本内容压缩到原大小的40%左右,这...

    php网站留言系统

    - 压缩和合并资源:使用Gzip压缩静态资源,合并CSS和JavaScript文件以减少HTTP请求。 6. **维护与扩展** - 日志记录:系统应记录操作日志,便于排查问题和追踪异常。 - 模块化设计:良好的代码结构有利于代码的...

    PHP新闻网站系统-php 开发

    - 压缩与合并:通过Gzip压缩HTML、CSS、JavaScript文件,合并CSS和JS,减少网络传输量。 - CDN服务:使用内容分发网络,将静态资源部署在全球节点,降低延迟,提高用户体验。 6. **安全性** - SQL注入防御:使用...

Global site tag (gtag.js) - Google Analytics