Home > php教程 > php手册 > PHP小技巧之JS和CSS优化工具Minify的使用方法

PHP小技巧之JS和CSS优化工具Minify的使用方法

WBOY
Release: 2016-06-13 09:34:54
Original
1460 people have browsed it

一、实现合并和压缩多个JS和CSS文件的代码

HTML:

复制代码 代码如下:




PHP:

复制代码 代码如下:


//输出JS
header ("Content-type:Application/x-javascript; Charset: utf-8");
if(isset($_GET)) {
 $files = explode(",", $_GET['get']);
 $str = '';
 foreach ($files as $key => $val){
  $str .= file_get_contents($_GET['path'].$val);
 }

 $str = str_replace("\t", "", $str); //清除空格
 $str = str_replace("\r\n", "", $str);
 $str = str_replace("\n", "", $str);

 // 删除单行注释
 $str = preg_replace("/\/\/\s*[a-zA-Z0-9_\x7f-\xff][a-zA-Z0-9_\x7f-\xff]*/", "", $str);
 // 删除多行注释
 $str = preg_replace("/\/\*[^\/]*\*\//s", "", $str);

 echo $str;
}

//输出CSS
header ("content-type:text/css; charset: utf-8");
if(isset($_GET)) {
 $files = explode(",", $_GET['get']);
 $fc = '';
 foreach ($files as $key => $val){
  $fc .= file_get_contents($_GET['path'].$val.".css");
 }
 $fc = str_replace("\t", "", $fc); //清除空格
 $fc = str_replace("\r\n", "", $fc);
 $fc = str_replace("\n", "", $fc);
 $fc = preg_replace("/\/\*[^\/]*\*\//s", "", $fc);
 echo $fc;
}

只是个简单原型,没有封装。另外,合并后的文件记得配合缓存

二、Minify的使用方法

1、从code.google.com/p/minify/下载最新版Minify并解压缩,将"min"文件夹连同里面的内容一起复制到DOCUMENT_ROOT目录下(即网站跟目录)。

可以修改文件夹名"min"

2、在"min/groupsConfig.php"里配置g参数

复制代码 代码如下:


return array(
  // 'js' => array('//js/file1.js', '//js/file2.js'),
  // 'css' => array('//css/file1.css', '//css/file2.css'),
);

3、在网页中按照如下方式引用就可以了:

后面的数字可以用更新日期来作标志,"min"和步骤1里的名称对应。

4、性能优化,请参考code.google.com/p/minify/wiki/CookBook

注意:

1、需要将httpd.conf里的rewrite_module模块开启

2、开发过程中,可以将调试模式开启,开发完毕后再将调试模式关闭,可以利用火狐浏览器的firebug来查看

复制代码 代码如下:


$min_allowDebugFlag = true

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template