[dev-overlay] Ignore animations on page load (#76834)
The current animation strategy for our Dev Tools surface does not work.
https://github.com/user-attachments/assets/a0ca5459-9d5a-4d90-af00-b071d43581e0
On page load, several animations can be observed:
- Width growth from `0` → `auto`
- Issue count translates and fades, along with the plural `s` suffix
- A subtle scale bounce effect plays
All these animations are state transitions, and thus we should ignore
them completely on page load or on high-frequency updates where
animating is undesirable, e.g. sometimes `issueCount` will receive
updates faster than the animation can run.
This PR implements checks to guard the animations from being executed on
page load, _and only_ during state transitions.
To review, it is worth checking out the
[/animation-test](https://github.com/vercel/next.js/blob/a6e6fe635b712020d4ea2d027040d838eb5941c6/test/development/app-dir/hydration-error-count/app/animation-test/page.tsx)
fixture I've set up in this PR.
After these changes, the experience is as follows—no animations on page
load, but only on subsequent low-frequency updates (count change, or
collapse of the surface):
https://github.com/user-attachments/assets/7b2d5e0d-64ec-4165-b5e2-85489bd00a2c
_Note: I am not using Storybook for a page load reference, the apps
under `test/development/app-dir/*` are more reliable._
