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文件的内容?

附译min目录下的README.txt

引用
该目录中的文件包含默认Minify设置,旨在简化整合您的网站。Minify将合并削减JavaScript或CSS文件,并进行HTTP压缩和缓存头。

推 荐 
建议修改config.php中设置$min_cachePath到一个PHP可写目录。这将提高性能。

GETTING STARTED 
最快的开始Minify的方法是使用Minify Builder应用程序的URI 
访问您的网站:http://example.com/min/builder/

压缩单个文件 
比方说,你要服务于这个文件: 
  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会自动通过重写机制找到它们。

合并多个文件到一个文件下载 
用','分隔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

在Html中使用MINIFY 
在(X)HTML文件,不要忘记将&替换为&

指定允许的目录 
默认情况下,Minify不会有任何DOCUMENT_ROOT范围内的*.css/*.js文件。如果你希望限制Minify存取某些目录,在config.php中设置 
$min_serveOptions ['minApp'] ['allowDirs']数组。例如:限制到/js和/themes/default目录,使用: 

  1. $min_serveOptions['minApp']['allowDirs'] = array('//js', '//themes/default');
 

"组":更快的性能和更好的网址 
为了获得最佳性能,编辑groupsConfig.php中的预指定文件组,下面是一个例子配置: 

  1. return array(
  2. 'js' => array('//js/Class.js', '//js/email.js')
  3. );
 
以上预指定js将结果是合并了如下文件: 
  http://example.com/js/Class.js 
  http://example.com/js/email.js 
现在,您可以如此简化URL: 
  http://example.com/min/?g=js 
  
组:指定document_root目录以外的文件 
在groupsConfig.php阵中,//是指向DOCUMENT_ROOT,但你也可以指定从系统的绝对目录路径或相对于document_root的相对目录: 
  1. return array(
  2. 'js' => array(
  3. '//js/file.js'            // file within DOC_ROOT
  4. ,'//../file.js'           // file in parent directory of DOC_ROOT
  5. ,'C:/Users/Steve/file.js' // file anywhere on filesystem
  6. )
  7. );
 
未来过期HTTP头 
Minify可以发送未来(一年)过期HTTP头。要启用该功能,您必须添加一个数字到URIs(例如/min/?g=js&1234 or /min/f=file.js&1234),每当源文件修改时改变该数字。如果你使用SVN/CVS,你可以考虑使用修订版号作为该数字。

如果使用"组"来合并压缩你的文件,可以使用工具函数Minify_groupUri()来得到一个“版本”的URI。例如:

  1. <?php
  2. // 之前确保min/lib目录设置到include_path
  3. // add /min/lib to your include_path first!
  4. require $_SERVER['DOCUMENT_ROOT'] . '/min/utils.php';
  5. $jsUri = Minify_groupUri('js');
  6. echo "<script type='text/javascript' src='{$jsUri}'></script>";
 

调试模式 
在调试模式下,Minify不压缩文件,而是发送合并后的带有行号的文件。要启用该模式,在config.php中设置为$min_allowDebugFlag为true,并增加"&debug=1" 到你的URIs. 
例如:/min/?f=script1.js,script2.js&debug=1

注:对于该模式,注释风格的字符串正则表达式可能会导致问题。

 
 

把min目录上传根目录,根目录打开http://example.com/min/

Note: Please set $min_cachePath in /min/config.php to improve performance.

设置/min/config.php文件  ,$min_cachePath 有3个选择。

//$min_cachePath = ‘c://WINDOWS//Temp’;
//$min_cachePath = ‘/tmp’;
//$min_cachePath = preg_replace(‘/^//d+;/’, ”, session_save_path());

选择第2个,去除//  .设置tmp属性777

在显示的界面中加入你想合并压缩的 js/css 路径,点击 ‘Update’ 之后会为你生成一个 url,如:http://localhost/min/b=googletesting/js& f=mootools.js,iAction.js,iAjax.js,global.js

css和JS分别合并,2个地址。如果需要组合的文件很多,url 就会变得很长,Minify 支持 group,可以将这些文件分组,这样 url 中只需指定 g=group名字 就可以了。

安装完毕后删除min/builder/index.php  文件。防止其他人登陆!后期如需编辑再次上传!

Minify把CSS和JS压缩和削减的更多相关文章

  1. mvc BundleConfig实现对Css、Js压缩打包加载

    Bundle不是.net Framework框架中的一员,使用Bundle首先要先添加引用,如下: nuget包管理--程序包管理控制台--Install-Package Microsoft.AspN ...

  2. Django 的css和js压缩插件:django_compressor

    今天尝试了django_conpressor,一个在django框架中压缩css和js的插件,灰常有用 我把它加载在我的base的HTML template中,原来未经压缩的css和js是: < ...

  3. 使用gulp进行css、js压缩

    var gulp = require('gulp'); var cleanCSS = require('gulp-clean-css'); var concatCss = require('gulp- ...

  4. gulp自动刷新和css、js压缩

    之前搭建过Grunt,但是用起来有点繁琐,后来有人跟我说gulp更多简单.所以今天又搭建一个gulp.在使用gulp前应该有nodeJs环境,安装完nodejs后,就可以开始gulp的搭建了. 先新建 ...

  5. grunt自定义任务——合并压缩css和js

    npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/to ...

  6. gulp之css,js压缩合并加密替换

    为了防止客户端的静态资源缓存,我们需要每次更新css或js的时候,通过md5或时间戳等方式重新命名静态资源.让客户端可以重新请求资源,而不是从缓存里取.然后html模板里的src也要做相应的修改.当然 ...

  7. 走近webpack(2)--css打包及压缩js

    前面的文章介绍了webpack的devServer以及多入口多出口文件的配置,咱们继续往下学. 在开始学习接下来的知识之前,我们先回顾一下,前文提到了webpack的简单配置方法,但是只详细说了下入口 ...

  8. webpack配置:css文件打包、JS压缩打包和HTML文件发布

    一.CSS文件打包 1.在src下新建css文件,在css文件下新建index.css文件,输入以下代码 body{ color:red; font-size:20px; } 2.css建立好后,需要 ...

  9. 26、ASP.NET MVC入门到精通——后台管理区域及分离、Js压缩、css、jquery扩展

    本系列目录:ASP.NET MVC4入门到精通系列目录汇总 有好一段时间没更新博文了,最近在忙两件事:1.看书,学习中...2.为公司年会节目做准备,由于许久没有练习双截棍了,难免生疏,所以现在临时抱 ...

随机推荐

  1. git常用命令符

    全局配置 $ git config --global user.name "姓名" 告诉git你是谁 $ git config --global user.email " ...

  2. Android 项目提交到svn需要忽略的文件和文件夹

  3. AC日记——[ZJOI2009]狼和羊的故事 bzoj 1412

    1412 思路: 最小割: 狼作为一个点集a,空领地作为点集b,羊作为点集c: s向a连边,c向t连边,a向b连边,b向b连边,b向c连边: 如何理解最小割? a,c之间割掉最少的路径(栅栏)使其没有 ...

  4. 【2019】问题记录一:后端获取URL参数的值内加号“+”变成空格“ ”

    问题:URL参数中加号“+”变成空格“ ” 一.现象     URL如:http://example.****.com/controller/action?param=rice+cook+panda ...

  5. 最新Webstrom, Idea 2019.1.3 的激活

    1.注册码激活 打开网址(IntelliJ IDEA 注册码),我们能看到下面的界面,直接点击获取激活码,将生成的激活码粘贴到WebStorm激活对话框中的Lisence Code输入框,点击OK即可 ...

  6. iOS 汉字转拼音 PinYin4Objc

    PinYin4Objc 是一个效率很高的汉字转拼音类库,支持简体和繁体中文.有以下特性:1.效率高,使用数据缓存,第一次初始化以后,拼音数据存入文件缓存和内存缓存,后面转换效率大大提高:2.支持自定义 ...

  7. IOS开发者账号的相关配置 - 接受邀请后的步骤

    说明: 1.本文主要针对企业账户, 并假定主账号已经申请到了. 2.账号类型分为3种:Agent(创建者),Admin(管理员)及Member(成员) 一. 1.申请子账号 使用Agent或Admin ...

  8. 修改Tomcat服务中的端口配置

    1.修改Tomcat服务中的端口配置: 分别修改安装目录下的conf子目录中的server.xml文件(注意:两个文件中对应的端口号要不一样),修改如下 : a. 修改Shutdown端口(默认为80 ...

  9. hdu 1541Stars

    题意:定义在某颗星星左下方的星星的个数表示该星星的水平,求出水平分别为为0...n-1的星星个数. 首先题目是按照y坐标升序输入的,设第第1,2...n个星星的横坐标依次为x1,x2,...xn.显然 ...

  10. EasyMvc入门教程-基本控件说明(11)菜单导航

    基本上,是个网站就会有菜单导航,目前流行的菜单是不是这样样子的? 似乎是bootstrap引领的风格,我们就用EasyMvc实现吧,上代码: @{ var data = new List<Men ...