jQuery现在已经是Web开发者比较依赖的一个库.甚至在很多公司内部也把jQuery当成了一个基本库来使用.
但随着移动端的流行使用庞大的jQuery去支撑移动端的开发显得有些重量级了,于是就出现了一个轻量级兼容库Zepto.js.
Zepto是作为为了支持移动端的浏览器而开发的一个和jQuery API极度相似的一个库, 如果你会用jquery,那么你也会用zepto,这样就大大降低团队协作的成本,不用改变开发习惯也能迅速的进行移动端开发.
Zepto设计的目的是提供jquery的类似的APIs,但并不是100%覆盖jquery为目的。zepto设计的目的是有一个5-10k的通用库、下载并执行快、有一个熟悉通用的API,所以你能把你主要的精力放到应用开发上。
具体到我们的项目,由于各种原因,开始时并没有使用Zepto而是使用了Jquery。这轮性能优化打算换成Zepto,毕竟size查了10倍啊。但是简单的把js引入替换成zeptp显然是不行的。由于用了lazyload等插件,依赖了jQuery的$.Defered, 还用了css3的一些selector,因此还有需要引入Zepto的一些扩展模块,Zepto默认提供的压缩文件只包含几个默认模块,可以通过命令自定义打包其它模块,也可以通过http://github.e-sites.nl/zeptobuilder/进行在线自定义打包和压缩。
兼容Zepto的lazyload插件可以用这个https://github.com/jieyou/lazyload
Zepto modules
Zepto modules are individual files in the “src/“ directory.
module | default | description |
---|---|---|
zepto | ✔ | Core module; contains most methods |
event | ✔ | Event handling via on() & off() |
ajax | ✔ | XMLHttpRequest and JSONP functionality |
form | ✔ | Serialize & submit web forms |
ie | ✔ | Support for Internet Explorer 10+ on the desktop and Windows Phone 8 |
detect | Provides $.os and $.browser information | |
fx | The animate() method | |
fx_methods | Animated show , hide , toggle ,and fade*() methods. | |
assets | Experimental support for cleaning up iOS memory after removing image elements from the DOM. | |
data | A full-blown data() method, capable of storing arbitraryobjects in memory. | |
deferred | Provides $.Deferred promises API.Depends on the “callbacks” module. | |
callbacks | Provides $.Callbacks for use in “deferred” module. | |
selector | Experimental jQuery CSS extensions support for functionality such as $(‘div:first’) andel.is(‘:visible’) . | |
touch | Fires tap– and swipe–related events on touch devices. This works with both touch (iOS, Android) and pointer events (Windows Phone). | |
gesture | Fires pinch gesture events on touch devices | |
stack | Provides andSelf & end() chaining methods | |
ios3 | String.prototype.trim and Array.prototype.reduce methods (if they are missing) for compatibility with iOS 3.x. |