![新ブラウザMicrosoft Edgeの実力はいかに? Web制作者が抑えておきたい各ブラウザを上回るHTML5描画性能 – ICS LAB](https://cdn-ak-scissors.b.st-hatena.com/image/square/7ad7d345c27f455843227bc1bda805f9cb8b0681/height=288;version=1;width=512/https%3A%2F%2Fics.media%2Fentry%2F8091%2Fimages%2Feyecatch.jpg)
これは VirtualDOM Advent Calendar 2014 に勝手に参加する記事です。 あたたかい春の昼下がりのこと、あるブラウザベンダの社内を不穏な噂が駆け巡った。 「React.js なるライブラリ、どうも仮想 DOM というやつのせいで速いらしいぞ」 もうリアルな DOM はお役御免、ブラウザも商売上がったりか・・・。雇用に不安を覚える人(私)がいる一方、 そのアイデアをとりこんでブラウザの DOM を速く出来ないかと考える人たちもいた。 仮想 DOM はなぜ速いのか。誰かのつてを辿って React.js チームにおいでいただき、速さの秘密をテックトークしてもらう。 イミュータブルなデータ構造による単純化、非同期適用による処理のバッチ化、差分アルゴリズムによる副作用の最小化… いくつかのアイデアはブラウザからはどうにもならないが、たとえば非同期化なんかは形は違えどブラウザ
document.elementFromPoint という便利な関数を知ったので、今作っている Chrome 用 Migemo ページ内検索で使ってみた。 これが困ったことに、ブラウザごとにかなり挙動が違うのだけど、本来の動作はこんな感じらしい。 待望の document.elementFromPoint が Firefox 3.0a8pre にて実装された。仕様は nsIDOMNSDocument.idl に詳しく書いてあるが、おおよそ以下の通りである。 HTML, XUL どちらの document に対しても使用可能 document の左上を (0, 0) とし、位置 (x, y) にある実際に見えている要素を取得する 同一の document 内に存在する要素のみ取得可能。例えばインナーフレーム内の document 内に存在する要素は取得できず、代わりに iframe 要素を返
As most web developers are aware, a significant amount of a script's running time may be spent performing DOM operations triggered by the script rather than executing the JS byte code itself. One such potentially costly operation is layout (aka reflow) -- the process of constructing a render tree from a DOM tree. The larger and more complex the DOM, the more expensive this operation may be. An imp
ついにWebKitからGoogle勢が分裂してBlinkという新しいフォークが出来てしまった。 折りしもmozillaがレンダリングエンジンをRustで作り直すという挑戦的なニュースも重なり、 新年度早々Web業界ウォッチャーには衝撃が走った。 さて、このBlinkのフォーク騒動だけど、理由は大きく2つあると思う。 一つは、性能や安全性向上のためのリアーキが現状のWebKitのtrunkでは難しいから。 二つは、WebKitのコミュニティ上でのApple勢とGoogle勢の信頼関係が崩れたため。 一つ目の性能に関する理由は明白。Blinkの公式サイトにもあるような、iframeのsandbox化、ネットワークコードの簡潔化、DOMをJSヒープに移動させることによるDOM操作の高速化などを、様々な移植層に適合した形で実現するのは技術的にも政治的にも非常に難しいためだ。 そういったドラスティッ
How browsers work Stay organized with collections Save and categorize content based on your preferences. Preface This comprehensive primer on the internal operations of WebKit and Gecko is the result of much research done by Israeli developer Tali Garsiel. Over a few years, she reviewed all the published data about browser internals and spent a lot of time reading web browser source code. She wrot
HTML5 の Web Worker やら GPU でハードウェア・アクセラレートされる IE9 のレンダリングなど、今年もブラウザの進化が激しくなりそうですネ。一方でフロント・エンド改善によるページ表示の高速化 Tips や Hack も百花繚乱、出尽くした感がありますが、やはり原理原則を知らないと 「どれが正しくて筋が良いか」 中々判断が効かないと思いませんか? そこで最も基本的な 「ページの読み込みから表示まで、ブラウザって何をどうやってるの?」 を理解していきたいなと思っています。 一番の厳密かつ王道は、ブラウザ間の違いを極力少なくするように注意深く書かれている HTML5 の仕様書 を理解だと思いますが、イキナリではハードルが高いので、まずは周辺を漁っています。そんな中から、ちょっと古いですが、2004年5月の記事 「Testing Page Load Speed」 を今回、翻訳
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く