JavaScript

「createDocumentFragment」に関するメモまとめ

はじめに

配列に値をたくさん入れて、for文で回して、値をappendChildする時にcreateDocumentFragmentを使うと良いのを知ったので、忘備録としてメモしておく。

createDocumentFragmentの概要

以下のMDNを読むと理解できる。
https://developer.mozilla.org/ja/docs/Web/API/document/createDocumentFragment
以下は例が多くて、より分かりやすい。
https://uhyohyo.net/javascript/7_4.html

createDocumentFragmentの何が良いのか

ズバリ、createDocumentFragmentを使うことで処理速度が速くなることに尽きる。Internet Explorer 6 を含む全てのブラウザで利用可能なので使うべき。
以下のサイトで、処理速度の調査結果を記しているので違いが分かる。
https://johnresig.com/blog/dom-documentfragments/