jQueryの .text() が遅かった - ﾘｱﾙｲﾝﾀｰﾈｯﾂｴﾝｼﾞﾆｬ-ｳｪｯﾌﾞﾛｸﾞ
DOM要素内の文字列を変更する処理にjQueryの .html() を使用しているコードを見て、「ムププｗ .text() のほうが速いからｗ」とか煽ってたら、実は .html() のほうが速かったという悲しい事件が起きた。 結論から言うと、jQuery 1.xの場合はIE6, 7, 8サポートのために .text() が遅く、 jQuery 2.xの場合は .text() のほうが速い。 DOMなら textContent が速いよ jQueryの前にまず、素のDOMを使ったコードでは、 Element.innerHTML プロパティに文字列を代入するパターンをよく見かける。 innerHTML は el.innerHTML = '<p>チャーハン</p>'; のようにすれば勝手にP要素を作ってくれるので大変便利ではあるが、HTML文字列を含まない文字列についてもパース処理が実行されるの
最近のDOMの取得について整理してみた
自分は普段からJavascriptを書く機会が多いのですが、Webサイト構築ではDOMを扱うことがほとんどです。 最近はjQueryなどのライブラリを利用する方が多いのではないでしょうか。 今回はDOMを取得する際のパフォーマンスに着眼して、今一度整理してみたいと思います。 とりあえずテストしてみた JSPerfで要素を取得するメソッドをそれぞれ追加しました。 basic DOM selector test | JSPerf そして、自分の所持している PC , SP の各ブラウザからRUNボタンをポチポチ押します。 テスト項目 テスト項目は以下の通りです。 ピュアなJSでの取得とjQueryでの取得を選択しています。 getElementById getElementsByTagName getElementsByClassName querySelector querySelector
ネイティブのgetElementsByClassNameはすごく速い - 素人がプログラミングを勉強していたブログ
Firefox2でgetElementsByClassNameを使えるように適当に作ったスクリプトと、Firefox3のネイティブのメソッドの速度の差がすごくてびっくりした。 作ったスクリプトは HTMLElement.prototype._getElementsByClassName=function(className){ var r=this.getElementsByTagName('*'); className.split(/\s/).forEach( function(i){ r=Array.filter(r,function(j)j.className.match('(?:^|\\s)'+i+'(?:\\s|$)')); }); return r; } document._getElementsByClassName=function(className)document.d
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
