Minify 是用PHP5开发的应用,通过遵循一些Yahoo的优化规则来提高网站的性能。它会合并多个CSS或者JavaScript文件,移除一些不必要的空格和 注释,进行gzip压缩,并且会设置浏览器的缓存头。Minify 在设计上和Yahoo的 Combo Handler Service非常像,不过Minify可以合并任何你想要合并的JavaScript和CSS文件。
一般情况下,网站速度的瓶颈都在前端,而最关键的就是资源的加载速度,但是大多数浏览器都有单个域名并发请求数限制,所以如果一个页面中存在很多的 资源,比如CSS和JavaScript文件,那么明显会降低网站的加载速度,比较好处理方式就是把多个文件通过一个请求来访问,这样既不会影响之前的文 件维护,又会减少资源的清楚数量,Minify就是为之而生。下面是一些被Minify采用的 Yahoo! 优化准则:
2、Add an Expires or a Cache-Control Header
下面两幅图分别是启用Minify之前和启用Minify之后网站请求时间的一个对比,可以看出启用Minify之后,资源的加载时间从250ms减少到了125ms,总共节省了50%的时间。
特性:
合并多个CSS或JavaScript文件为一个文件,减少请求数量,并且进行minify处理
使用了多个开源的库,包括 JSMin.php ,Minify CSS,Minify HTML
服务端缓存(fils/APC/Memcache),可以避免不必要的重复处理
当浏览器存在资源的缓存,返回HTTP 304 Not Modified
多个文件合并时,自动生成URI
当开启服务端缓存的时候,在一般的服务器上Minify每秒可以处理几百个并发请求
根据请求头,开启Content-Encoding: gzip。在服务端缓存开启的情况下,Minify提供gzipped 文件速度比Apache’s mod_deflate模块要快
安装
下载最新的Minify,然后解压文件到”min” 文件夹
Copy “min” 文件夹到自己网站的DOCUMENT_ROOT下,如果想要Minify在子目录下工作,看这里
使用
假设网站域名是http://example.com,Minify安装在了虚拟主机的根目录下,那么访问http://example.com/min/,我们会看到一个“Minify URI Builder”,我们可以输入需要进行合并的文件URI,如下
点击Update之后,系统会自动生成一个合并后的URI:/min/?b=js&f=jquery-a.js,jquery- b.js,jquery-c.js。如果觉得URI太长,可以通过配置文件来指定group,编辑min目录下的groupsConfig.php文件, 加入以下内容:
return array( 'js' => array('//js/jquery-a.js', '//js/jquery-b.js', '//js/jquery-c.js'),//相对于DOCUMENT_ROOT ); |
之后就可以通过/min/?g=js来访问了
Minify在资源首次被请求的时候,会对多个文件进行合并,gzip,去除空格,注释等处理,然后会把处理的结果进行缓存,默认情况下是进行文件缓存,缓存的key以minify_开头,修改min/config.php文件,配置缓存文件存放的位置:
$min_cachePath = '/tmp';
除了通过文件进行缓存之外,Minify还支持Memcache缓存,修改min/index.php文件,加入以下代码:
require 'lib/Minify/Cache/Memcache.php'; $memcache = new Memcache; $memcache->connect('localhost', 11211); $min_cachePath = new Minify_Cache_Memcache($memcache); |
Minify支持两种debug方式,一种是通过firephp调试PHP错误,修改min/config.php文件,加入以下代码:
$min_errorLogger = true; |
另一种是通过在URL中加入flag进行错误调试,在min/config.php中加入
$min_allowDebugFlag = true; |
之后就能以http://example.com/min/f=jquery-a.js,jquery-b.js,jquery-c.js&debug=1方式进行调试了
参考:
http://code.google.com/p/minify/wiki/UserGuide
http://www.mrclay.org/2008/09/19/minify-21-on-mrclayorg/
相关推荐
一个为尖峰提供前沿性能优化的插件。 注意:该项目处于早期开发阶段,版本控制有些不同。 以获得更多详细信息。 安装 npm install spike-optimize -S 用法 目前,峰值优化提供了一个简单的界面,通过该界面,您...
并使用grunt来最小化文件和图像:投资组合页面优化: Google字体将阻止html dom和css cssom进程,使用了字体加载器以提高性能缩小并嵌入关键CSS以解决块渲染问题不在CRP上的异步脚本将提高CRP效率将非CRP脚本移到...
CJ Loader插件包含了 PHP Minify(一个php开源项目,用于合并和压缩 CSS和JS文件),让zencart网站中的经过它优化压缩后的CSS和JS文件,缓存在浏览者的浏览器中一定时间(我看了默认配置是一年)。 2.提升开发速度 CJ ...
新功能:延迟 JavaScript 执行-通过延迟 JavaScript 文件的加载直到用户交互(例如,滚动,单击)来提高性能 新功能:预加载链接-在用户单击链接之前预取页面,以提高感知的加载速度和用户体验) 增强功能:启用...
为您的站点的源代码提供各种优化选项(例如,最小化,缓存,代码重组),以帮助满足当今的Web性能标准。 ==说明== HTML Minifier是服务器端的源代码缩小器,重组器和缓存工具,可作为PHP类和WordPress插件使用。 ...
网站性能优化项目要运行此应用程序:1.下载该存储库或将其克隆到您的计算机。 2.在本地主机上打开文件。 通过以下方式将Index.html的PageSpeed得分优化为90以上:1.在的帮助下内嵌关键通过css。2.在的帮助下调整大小...
新的网站性能优化组合项目姓名:Fabio Alessandro Gatti 电子邮件: 对最终项目所做更改的文档对于 index.html 文件,这里是我所做的: -Minify html, css 和 js -Compress images -Inline css 并将 js 文件设置为 ...
为提高性能而进行的更新 网站的。 常规更改: 添加了package.json文件,以提供项目描述并确定开发依赖项。 添加了gulpfile.js文件以自动执行构建过程。 一种。 添加了gulp-uglify以减小javascript文件的大小。 b。...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 生成被最小化,并且文件名包括哈希值。 您的应用已准备好进行部署! 有关更多信息,请参见关于的部分。 yarn eject 注意:这是单向操作。 eject ...
该解决方案使您能够动态组合js和css文件来优化html页面。 这使您可以提高Google页面速度的性能。 该工具仅在实际站点上有效。 在当地的项目是行不通的! 安装 安装此扩展的首选方法是通过 。 无论运行 ...
描述 使用React构建的Web应用程序,用于查看和比较不同的... 它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 最小化构建,文件名包含哈希。 您的应用已准备好进行部署! 有关更多信息,请参见有关的
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 最小化构建,文件名包含哈希。 您的应用已准备好进行部署! 有关更多信息,请参见有关的部分。 yarn eject 注意:这是单向操作。 eject ,您将...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 生成被最小化,并且文件名包括哈希值。 您的应用已准备好进行部署! 有关更多信息,请参见关于的部分。npm run eject 注意:这是单向操作。 eject ,...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 生成被最小化,并且文件名包括哈希值。 您的应用已准备好进行部署! 有关更多信息,请参见关于的部分。 npm run eject 注意:这是单向操作。 ...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 生成被最小化,并且文件名包括哈希值。 您的应用已准备好进行部署! 有关更多信息,请参见关于的部分。yarn eject 注意:这是单向操作。 eject ,您...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 生成被最小化,并且文件名包括哈希值。 您的应用已准备好进行部署! 有关更多信息,请参见关于的部分。 npm run eject 注意:这是单向操作。 ...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 生成被最小化,并且文件名包括哈希值。 您的应用已准备好进行部署! 有关更多信息,请参见关于的部分。npm run eject 注意:这是单向操作。 eject ,...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 生成被最小化,并且文件名包括哈希值。 您的应用已准备好进行部署! 有关更多信息,请参见关于的部分。yarn eject 注意:这是单向操作。 eject ,您...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 最小化构建,文件名包含哈希。 您的应用已准备好进行部署! 有关更多信息,请参见有关的部分。 npm run eject 注意:这是单向操作。 eject ,您将...
它在生产模式下正确捆绑了React,并优化了构建以获得最佳性能。 生成被最小化,并且文件名包括哈希值。 您的应用已准备好进行部署! 有关更多信息,请参见关于的部分。npm run eject 注意:这是单向操作。 eject ,...