最軽量jQuery互換ライブラリ、Minified.jsを使ってみた
Webサービスを作る上で必ずと言っていいほどお世話になっていたjQuery。
今回、スマートフォン向けサ−ビスを作る上で、jQueryはちょっと重たいかなってことで、Minified.jsというライブラリを使ってみた。
Minified.jsは今年の7月にβ版がリリースされたばかりのjQuery互換のライブラリ。
jQuery互換の軽量ライブラリは他にもZepto.jsもあるが、Minified.jsは最軽量で容量は4KB。(jQuery 2.0.3は29KB、Zepto.js 1.0は9.7KB。いずれもgzip圧縮後。)
しかも、Zepto.jsよりもバグが少ない(らしい)。
使い方は、公式サイトからダウンロードして読み込み、
var MINI = require('minified'); var $ = MINI.$, $$ = MINI.$$, EE = MINI.EE;
って書いたらあとはjQueryのように
$(function() { });
の中に書いていく。
使っていて気づいたのが、
たぶん。
addClass()、removeClass()はそれぞれ、
.set('+hoge'); .set('-hoge');
って書くとか、jQueryから乗り換えると修正する箇所も多いと思う。
1番困ったのがDOMを追加するところで、
.after("<div class='hoge'>test</div>");
みたいなことができなくて、
.addAfter(EE('div', {'@class': 'hoge'}));
のような変わった記法を使わないといけない。
たぶん。(他の方法があったら教えて下さい!)
だいたいこんな感じ。
jQueryに依存してるライブラリ、フレームワークも多いのでそこらへんMinified.jsに変更して動くのかなとか思う。(たぶん多くの場合無理だと思う。)
スマホ向けサービスでパフォーマンスを気にする場合で、jQueryっぽい書き方がしたい場合は導入するのはアリなのかなと思う。
日本語ドキュメントほしい。。