膨大な数のエレメントを作成する

もうなんていうか、膨大な数のデータって本当に嫌いになりました。普通に表示するだけなら簡単なくせに、数が膨大になると今まで考えなかった方法でなんとかしなきゃいけなくて、、、AS3でもエレメントの生成には結構時間かかっちゃうし、あー!もーやだ!と思って、がりっとやっつけました。ここは一般受けしやすいようにJavaScriptで実装した。


で、できたのがこれ。
JavaScriptで膨大な数のエレメントを作成する


ユーザが見ている場所をとにかく一番最初に表示したいですよね。

  1. エレメントのデータを保持し、Domは作成しない
  2. 現在見ているビューの中心から近くに描画される順にデータをソート
  3. ソートしたデータをもとに描画
  4. ViewのonScrollイベントが発生したら、2からやり直し

ブラウザだと、一度作ってしまえばスクロール時にも問題にならないから、作ったエレメントはそのままにしておき、FlexのIDataRendererのようにインスタンスを使い回すような事はしていません。これで膨大な量のデータでも、結構使えるUIになるんじゃないかな


この考え方はもちろんAS3でも通用しますよね!?しかし、4時間もこれだけにかけてしまった。。。。寝なきゃダー