closure compiler代码优化,网页打开速度优化之jquery代码优化压缩
最近感觉网站打开速度变慢了,所有就想着压缩一下jquery脚本,以前也是把网页里面的图片延迟加载了,效果不是很理想,由于使用“lazyload.js”对图片懒加载,需要替换真实图片地址,对搜索引擎抓取不利,所有使用了《Qazy.js延迟加载懒加载图片》,Qazy是一个图像延迟加载程序,与库无关(没有jQuery)。Qazy移除负面SEO影响。这就是它有别于其他懒惰加载器的原因。
<body> <img src="lazy-loading.jpg" data-qazy="true"> <br> <img src="offline-web-apps.jpg" data-qazy="true"> <br> <img src="random-color.jpg" data-qazy="true"> <br> <img src="revel-scroll.jpg" data-qazy="true"> <br> <img src="wordpress-fields-metaboxes.jpg" data-qazy="true"> </body>
Qazy应用的代码示例:不需要jquery库,只需要引用一个5K的JS即可,非常方便。
github地址:https://github.com/narayanprusty/Qazy
网页加速之jquery代码压缩
首先想了解jquery使用什么压缩的, 网上找了半天,说法不一样,后来还是在jquery官网的最频繁问题中找到了答案,但这已经是绕了一大圈之后的事情了。
(a)根据我看到的一些信息,jquery压缩最早是用 Dean Edwards' Packer 进行压缩的,大概是在jquery1.3版本吧(我在一本jquery的书上看到的。)。这个东西出来的比较早,作者好像也是头 大牛,目前是3.0版本,好像是在线版本,我自己把代码去他网站上压缩,无法使用,会出错误。
(b)后面jquery换成yuicompressor 进行压缩,具体哪个版本不太清楚,有篇文章的作者说:他去jquery的svn中找了一下,发现有yuicompressor的文件,然后他特意用jQuery.js试了一下,处理过的文件和jQuery.min.js一模一样。原帖地址。
(c) 偶滴神啊,最后我在jquery官网找到了这么一段话。How do I compress my code?
内容如下:
Generally the best way to do it is to use the Google Closure Compiler (used by jQuery) or YUI compressor. jQuery provides a pre-minified version of jQuery for your convenience.
Packing JavaScript using Dean Edwards' Packer (specifically using the base64 encode) is not recommended, as the client-side decoding has significant overhead that outweighs the file-size benefits.
大致意思是说:jquery用的是google的开源js压缩工具,Google Closure Compiler和YUI compressor 是目前最佳的js压缩方式。 Dean Edwards‘ packer 是不推荐使用的!!
Closure Compiler Service地址: https://closure-compiler.appspot.com/home
优化前:
var x=5*11; alert(x*Math.random());
优化后:
优化时进行直接量计算,得到:
var x=55; alert(x*Math.random());
高级模式下,甚至直接消除没有显式导出的变量 x:
alert(55*Math.random());
点击链接加入群聊三群:751529538
点击链接加入群聊二群:376877156
点击链接加入群聊【路由器交流群:622891808已满】
本站附件分享,如果附件失效,可以去找找看
饿了么红包