JavaScript冗長回避、性能改善の常套手段 - 初心者向け

2010/04/28 08:21

プログラミングにおける冗長回避、性能改善において力を発揮するコーディング手法を以下に記載します。

オブジェクト指向のコンパイル言語プログラムを書く人にとっては、性能面も踏まえ、作法として当たり前の事なのですが、

JavaScriptはウェブデザインと言う分野においてデザイナ/プログラマーの垣根なく使われる言語なので、コーディング作法や性能まで考えてプログラミングされていることが少ない気がします。

処理が短く簡易であるから良いものの、性能が全く出ていないであろうソースを沢山みます。

document.getElementById("id").~
document.getElementById("id").~
document.getElementById("id").~

なんて書いてプロパティセットしていくのはあまりに冗長ですし、毎回DOMでアクセスする分性能がでません。

var e = document.getElementById("id");
e.~
e.~

とすることを推奨します。

これによって、DOMでのアクセスは最初の1回のみになります。更にeとかくだけでよいのでコーディングの冗長さも断然減りますしね。

 

そして、document.getElementByIdなんて何度も使うことになると思います。こういった場合は、あらゆる有名なフレームワークでも実装されていますが、

var $ = function(id) {
    return document.getElementById(id);
}

なんていうオブジェクトを共通ライブラリで用意しておけば、

var e = $(id);
e.~
e.~

と書くことができます。

document.getElementById("id").~
document.getElementById("id").~
document.getElementById("id").~

var e = $(id);
e.~
e.~

になりました。如何でしょうか?

コメントを書く




biuquote
  • コメント
  • プレビュー
Loading