Mutation Events
browser tricks 2000 deadThe first way to watch the page change fired an event for every node inserted or removed, and it was so slow it held the whole platform back.
In 2026: Dead, and only just. DOM Level 2 mutation events like DOMNodeInserted let a script react to the document editing itself, but firing synchronously on every change wrecked performance and blocked new browser features. Deprecated in 2011, replaced by MutationObserver, and finally removed in Chrome 127, Firefox 140 and Safari 26. The listener below is attached and, in 2026, never fires.
Where it came from: DOM Level 2 mutation events, W3C 2000. Deprecated 2011 for MutationObserver, removed from Chrome 127 in 2024. MDN ↗
<div id="host"><b>Watch this box.</b></div>
<p id="out">Listener attached. Waiting...</p>
<script language="JavaScript">
var host = document.getElementById("host");
var out = document.getElementById("out");
// The old way to observe the DOM: one event per change, fired synchronously.
host.addEventListener("DOMNodeInserted", function () {
out.innerHTML = "DOMNodeInserted fired! (You are in an old browser.)";
});
// Now mutate the box. In 2026 the handler above never runs.
host.appendChild(document.createTextNode(" Changed at " + Date.now() + "."));
setTimeout(function () {
if (out.innerHTML.indexOf("fired") === -1)
out.innerHTML = "The box changed and the event never fired. Removed in 2024.";
}, 300);
</script>