めぐの JavaScript 日記

あーもんど

document.querySelector() をちょっとだけ高速化する

document.querySelector() は呼び出し毎にツリーを探索しているのか,多用するとちょっとだけ遅いです。といっても気になるレベルではないのですが。DOMツリーの構造が不変な場合,取得結果をキャシュしておけば次回以降は定数時間でノードを取得できる (かもしれません)。

取得結果をキャッシュする

コード

const $ = e => (($.cache ??= {})[e] ??= document.querySelector(e) ?? 0) || null;

10万回取得する

const x = Date.now();
for (let i = 0; i < 1e5; ++i) $("span");
Date.now() - x;  // サイトによって変わるが querySelector よりも速い


日記 (おまけ)

学食で雑談とかした