課題3: SPA 再レンダリング + 無限スクロール

SPA の再レンダリングは innerHTML の作り直しで要素を新品に差し替えるため、外部が付けた aria-label は破棄される。 si.js（ブラウザ側）は MutationObserver で DOM の変化を検知し、未補正の要素にだけ属性を再適用することでベストエフォートに補正を残す。 無限スクロールに対しては IntersectionObserver で可視要素にゲートし、オフスクリーンを処理しないことで CPU を抑える。 本ページは observer なし（消える）、observer 再適用（残る）、可視ゲート補正 を並置して実測する。

A. 再レンダリングで aria-label 消失（observer なし）

🔴 再レンダリングで消える

1 回だけ setAttribute('aria-label', …) を付与。数量変更 → innerHTML 再生成で要素が新しくなり消える。

未操作

B. si.js 相当の observer 再適用（残る）

🟢 再レンダリング後も残る

MutationObserver(childList/subtree) + 80ms debounce。入口で isAlreadyFixed 早期 return。attributes は観測しない設計。

observer 起動待ち

C. 無限スクロール + IntersectionObserver ゲート

⚠️ 可視ゲートで一部対応

スクロールで alt なし img を append。sentinel を IO で監視し追加ロード。各 img は可視になった時だけ alt 補完（requestIdleCallback で分割）。

スクロールして読み込み

結論（このページの実測が示すこと）

実行中…