设为首页收藏本站

PHPIN.NET

 找回密码
 立即注册
查看: 1190|回复: 0

[其他] 使用Minify来压缩JS和CSS文件来提高网站性能

[复制链接]

374

主题

381

帖子

2558

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
2558
发表于 2014-3-19 19:26:30 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
Minify 是用PHP5开发的应用,通过遵循一些Yahoo的优化规则来提高网站的性能。它会合并多个CSS或者JavaScript文件,移除一些不必要的空格和注释,进行gzip压缩,并且会设置浏览器的缓存头。Minify 在设计上和Yahoo的 Combo Handler Service非常像,不过Minify可以合并任何你想要合并的JavaScript和CSS文件。

一般情况下,网站速度的瓶颈都在前端,而最关键的就是资源的加载速度,但是大多数浏览器都有单个域名并发请求数限制,所以如果一个页面中存在很多的资源,比如CSS和JavaScript文件,那么明显会降低网站的加载速度,比较好处理方式就是把多个文件通过一个请求来访问,这样既不会影响之前的文件维护,又会减少资源的清楚数量,Minify就是为之而生

Minify把CSS和JS压缩和削减(Minify:去掉空格回车符等),以及把多个CSS,JS文件整合到一个文件里。不要以为你的大带宽没有必要进行这类优化。使用它的理由更重要的是文件合并,而不是压缩,而是文件整合,这样可以减少浏览器端不断发出新的连接请求,就像FTP服务器一样,多个小文件和一个大文件耗时是不一样的。  

Minify是用PHP写的,项目地址 http://code.google.com/p/minify/

安装  
1. 下载最新的 Minify 然后解压缩到 minify 目录。  
2. 复制 "min" 目录到你的DOCUMENT_ROOT

基本用法:
假设你有 http://localhost/a.js,http://localhost/b.js 两个文件。那么现在,你可以使用 http://localhost/min/?f=a.js,b.js, 看看浏览器返回结果,是不是minify的两个js文件的内容?   

压缩单个文件:
比方说,你要服务于这个文件:  
http://example.com/wp-content/themes/default/default.css  
下面是“Minify网址”该文件:  
http://example.com/min/?f=wp-content/themes/default/default.css  


换句话说,“f”参数设置为从WEB根路径下的目标文件(不需要路径/)”。由于CSS文件可能包含相对URI,Minify会自动通过重写机制找到它们。
当然也可以写成如下方式:
http://example.com/min/?b=wp-content/themes/default&f=default.css  
合并多个文件到一个文件下载:
用 ',' 分隔 f 参数的每一个文件名。  
比如,有如下CSS文件:
http://example.com/scripts/jquery-1.2.6.js  
http://example.com/scripts/site.js  


您可以通过Minify结合起来:
http://example.com/min/?f=scripts/jquery-1.2.6.js,scripts/site.js  
简化基本路径:
如果你合并的文件共享同一父目录,你可以使用 b 参数设置的 f 参数的基本目录(同样不包括前导或者后缀/字符)。  
例如,以下两种写法效果相同:
http://example.com/min/?f=scripts/jquery-1.2.6.js,scripts/site.js,scripts/home.js  
http://example.com/min/?b=scripts&f=jquery-1.2.6.js,site.js,home.js  



如果觉得URI太长,可以通过配置文件来指定group,编辑min目录下的groupsConfig.php文件,加入以下内容:
  1. return array(
  2. 'js' => array('//js/jquery-a.js', '//js/jquery-b.js', '//js/jquery-c.js'),//相对于DOCUMENT_ROOT
  3. );
复制代码

之后就可以通过/min/?g=js来访问了

Minify在资源首次被请求的时候,会对多个文件进行合并,gzip,去除空格,注释等处理,然后会把处理的结果进行缓存,默认情况下是进行文件缓存,缓存的key以minify_开头,修改min/config.php文件,配置缓存文件存放的位置:

$min_cachePath = '/tmp';

除了通过文件进行缓存之外,Minify还支持Memcache缓存,修改min/index.php文件,加入以下代码:
  1. require 'lib/Minify/Cache/Memcache.php';
  2. $memcache = new Memcache;
  3. $memcache->connect('localhost', 11211);
  4. $min_cachePath = new Minify_Cache_Memcache($memcache);
复制代码


Minify支持两种debug方式,一种是通过firephp调试PHP错误,修改min/config.php文件,加入以下代码:
  1. $min_errorLogger = true;
复制代码


另一种是通过在URL中加入flag进行错误调试,在min/config.php中加入
  1. $min_allowDebugFlag = true;
复制代码


之后就能以http://example.com/min/f=jquery-a.js,jquery-b.js,jquery-c.js&debug=1方式进行调试了


项目地址:
google:http://code.google.com/p/minify/
github:https://github.com/mrclay/minify



您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|PHPIN.NET ( 冀ICP备00000001号 )|网站地图  

GMT+8, 2016-12-10 20:42

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表