JavaScriptでプログレスバー

http://www.geocities.jp/ajiyoshi_blog/komekami2/

全くもって本質的ではないが、練習としてプログレスバーを出してみた。プログレスバーの実装はJavaScript & DHTMLクックブック―Webエキスパート必携テクニック集の丸パクリ。試すには、Yahoo!のソースとか、ノード数が1000以上ありそうなソースをつっこんでみると、プログレスバーで進捗状況がわかる。

最初にDOMノード数を数えて、処理中のノード/全ノード数を表示してるだけである。ただ、本には詳しく書いてなかったのだが、DHTMLで見栄えを変えてもJavaScriptが制御を返すまでは描画されないため、ちょっと構造を変えた。元々は再帰でDOMツリーをイテレートしていたのだが、再帰だと一旦制御を返して続きからまた始めるのが難しい。そこで、現在見ているノードを示すポインタをグローバル名前空間に置いておいて、処理を行うごとにsetTimeout()で一旦制御を戻してから自分を呼び出す構成にした。(まあ、本質的には再帰だけど。)本当に毎回setTimeout()で戻すと処理時間が偉いことになるので、100ノードほどまとめて処理してから戻してるけど。