Post

Did you know it's called the View Transition API (and not the View Transitions API [plural])? Now MDN knows too (github.com/mdn/content/...) so there's no reason to keep using the wrong name. Learn about this and other misconceptions in this post: developer.chrome.com/blog/view-tr...

Is it possible for multiple elements to share a single snapshot? In lists, having 50 separate snapshots doing the same animation seems far heavier than using one shared snapshot for all. Doing grouping using DOM requires reflow :(

Not sure if I understand the question correctly, but if you set the view transition name on the list and do not have view transition names on the list elements, there will only be one snapshot for the whole list.

Yes, but if you insert/remove an item into it and want others to animate, doing that for each item separately is very unoptimized. In this simple card demo style recalc on each frame grows from 0.2ms for 5 items to 3ms for 75 items view-transitions.chrome.dev/cards/spa/

This is inherent to animating X elements. The same invalidation/recalc happens when trying to achieve the same effect with non-VT animations.

Yep, and the usual optimization is to wrap element groups into a div, animate it instead, and then remove that wrapper. VT snapshot logic could be a great alternative to wrapping/unwrapping process, but sadly, it isn’t :(