Skip to content We're live on Product Hunt today Upvote
install

diagnostic · one of 36 free, no counter

Mutations

What is this page rewriting after it has loaded?

A page that flickers, re-renders or loses a form value is doing something after load, and the browser has no surface that shows what. This is a running observer with a ledger behind it: which elements are being rewritten, how often, and by how much - with the busiest row as the scale, because a share of the total draws every quiet row as nothing.

Reach it Press + K on any tab and type mutations. Ctrl + K on Windows and Linux

A ledger of what the page rewrites in the DOM while you watch
reads DOM mutations, while it is running
writes nothing
sends nothing
records yes - a rerun discards the ledger
rate per second, guarded against a zero elapsed
bars against the busiest row, with a floor so a quiet one draws
plan free
section#about

What this actually is

On a flicker nobody can reproduce, on a page whose input keeps being reset, and on any site where a third-party script is suspected of rewriting content. Leave it running and use the page.

section#asked

Asked about this diagnostic

Why is there no Run again?

Because it is a running observer with a log behind it. Re-running would throw the log away, and the log is the reading.

It reports mutations on a page that looks static. Is that wrong?

Usually not. Analytics scripts, lazy-loading, font swapping and animation libraries all rewrite the DOM. The rate and the shares are how you tell background noise from a re-render loop.

Does it say which script did it?

No. A mutation record names what changed, not who changed it - the browser does not attribute them. What it gives you is the element, which is usually enough to find the owner.

Does watching slow the page down?

A MutationObserver is cheap, but a page doing thousands of mutations a second will feel the ledger. That page has a problem the ledger is there to show you.

how to use mutations

  1. Open Mutations and leave the observer running while the page settles.
  2. Read which elements are being rewritten, how often, and by how much.
  3. The busiest row sets the scale, so a sharp spike is visible against it.
  4. Take the element that keeps being rewritten to the script that owns it.