[B! DOM] actywaveのブックマーク

JavaScriptでのDOM操作は重いのかという話とForced Synchronous Layoutについて - id:anatooのブログ

2015年にもなるのにJavaScriptでのDOM操作のパフォーマンスについて書く。ウェブページにインタラクションを持たせたい時に、JavaScriptでDOM操作を行うことがよくある。このDOM操作のパフォーマンスについて、よく聞く意見を大別すると次の2つがある。 JavaScriptによるDOM操作は重たいレンダリングが重いだけで、DOM操作そのものはそれほど重たくない JavaScriptでオブジェクトのプロパティを操作したりする単体の処理は通常1ミリ秒もかからないが、DOM操作をするとレンダリングが完了するまでに数十ミリ秒程度かかったりする場合がある。1番目のDOM操作が重たいと言っている人は経験則的にそう言っていることが多い。レンダリングの仕組みを知っている人は2番目の意見を言うが、重箱の隅をつつくような話をするとこれも必ずしも正しいわけではない。DOM操作するコードによっ

actywave 2015/10/15

リンク

美しいWebサイトはDOM構造も奇麗なはず！·DomTree MOONGIFT

DomTreeはWebサイトのDOM構造をツリー化してくれるビジュアル化ソフトウェアです。奇麗なHTMLはソースを見てもやはり奇麗に記述されているものです。さらにDOMの構成において奇麗にできているかどうか可視化してくれるソフトウェアがDomTreeです。 Googleです。73エレメントで作られています。 MOONGIFT。294とのことです。すごく…密です。 Yahoo! Japan。CenterやTableタグを使っているあたりはやはりサポートするブラウザの多様性ゆえでしょう。楽天。すごい数です。なんと957。 2003年当時のMOONGIFT。51だそうです。 2008年当時のデザインでは600近い数になっていました。拡大表示もできます。必ずしも奇麗なDOMツリーになっていることが奇麗なデザインにつながる訳ではないと思いますが、空タグや無理矢理ハックしてデザインを整えたりし