( ゜▽゜)/こんばんわ!

IDEA*IDEAにjQuery高速化のTipsが載っていました!

普段書くときに気をつけることも多いですが
jQueryだけじゃなくて普段javascriptかくときに使えそうなこともいっぱいあるし知らないこともあったのでちょっとまとめてみます!

jQueryの高速化に関するまとめ

1:常に最新版を使うこと!
Googleから読めばマイナーバージョンアップくらいは
特に気にせず使えますが業務で使うとなると試験とかあるから大変?w

2:JSファイルをまとめること!
これはCode圧縮やgzipと組み合わせると良いですね!
あわせられるものはあわせましょう〜
前にうちでも取り上げたGoogle版YSlowともいえるPageSpeedを使うと
Combine external JavaScript
Combine external CSS
って項目でまとめたほうがいいJavascriptとかCSSを一覧で表示してくれるので便利です!

Google版 YSlow? Page Speedを試してみました!

3:eachよりもforを使うこと!
JavaScriptネイティブの命令の方が速いってことのようですので
each/forだけじゃなくても簡単に書けるものならネイティブの命令を使って書いたほうがよさそうです

4:ClassよりもIDを使うこと!
これは有名らしいんですがw。しらなかったぁ〜><
あんまり気にしたことなかったけど頭に入れておくと良いかもしれませんね!

5:セレクタに対象範囲
指定すること!
これって
p[class="foo"] {
     margin:0;
     padding:0;
}
とかの[]内の指定のことかな?
CSSセレクタはかなり便利なので一通りは覚えておくとかなり使えますw
~=とか^=とか$=とかとかとか・・・

6:キャッシュすべし!
なんども使う要素は変数に入れたりとか
気にして書くと結構違いますね!

7:DOM操作はなるべく避ける
「prepend()、append()、after()などは遅くなるからなるべく避けましょう」とのことです。まぁdocument.createElement()〜〜
よりもinnerHTMLで書いた方が速いとかも聞きますしね〜

8:concat()よりjoin()
全く知らなかった・・・・
文字列を連結するときはconcat()するより、配列に全部いれておいてjoin()した方が速いんですって〜!!!!
そうなの???仕組みが気になるw

どれも覚えておくとかなりいい感じがしますね!
あんまり固執する可読性が下がったり、だらだらしたコードになっちゃうかもですが
ポイントポイントで使っていければかなり有効かも・・w