ハイパフォーマンスJavaScript 1章〜6章

ハイパフォーマンスJavaScript

ハイパフォーマンスJavaScript

初めてのJavaScriptはちょっと置いて、先にこちらを。初めてのJavaScriptより薄かったし、パフォーマンスを気にする事があったから先に読みたかったのですよ。

for文にある初期化部の変数のスコープ

他の言語みたいにfor文に閉じてるのだとばかり思っていたら、関数内のスコープだとか。

function a() {
  for (var i = 10; false;) { }
  alert(i);  // 10
}

てかパフォーマンスと関係ないことをこの本で知るってどうなの……

innerHTML v.s. createElement(), etc.

innerHTMLとcreateElement()などを使った場合とどちらが速いか。
新しめのWebKit以外はinnerHTMLの方が速いみたい。

for文の最適化

だいたい見かけるfor文の書き方は(最近はあんまり見ないかな?)

for (var i = 0; i < items.length; i++) {
  // code
}

で、パフォーマンスを気にする人たち(なのかな?)が書くのは

for (var i = 0, len = items.length; i < len; i++) {
  // code
}

こんな感じ。ちなみに自分もこれ。
で、これよりも速い

for (var i = items.length; i--;) {
  // code
}

なんて書き方があるそうで。
まあ前からアクセスしても後ろからアクセスしても関係ないときとか、あとは配列に追加するときとか。
配列に追加するのは今までpush()を使ってたところはunshift()使えば同じになるかな。
でもこの書き方でないとものすごく遅い、ってわけじゃなかったら今まで通りに書くかなあ……

メモ化

メモ化って聞いたことあるけど、実際どういうことなのかわからなかったんですが、百聞は一見にしかずというか。

function getHoge() {
  if (getHoge.memoize) {
    return getHoge.memoize;
  }
  var a = heavyMethod();
  getHoge.memoize = a;
  return a;
}

こんな感じ……でいいのかな。
既に実行された結果を残しておいて、再度呼ばれた場合はそれを返すってことかな。
関数名.memoizeってのがギョッとするけど、まあJavaScriptらしいというか。

IE7以前の長い文字列連結

配列に追加していって最後にjoin()しましょう。
他のブラウザは+=で連結して大丈夫。


他に高速な正規表現の書き方などなど、なかなか面白い本です。
これはちゃんと最後まで読めそう。