Re: [csswg-drafts] [css-view-transitions-2] how do we decide whether to use layered capture? (#11078)

From the [explainer](https://github.com/WICG/view-transitions/blob/main/nested-explainer.md#backwards-compatibility--opting-inout):

## Is layered always better?
In short, no. Layered works best for animations that superimpose the two states on top of each other and animate them as if they were one morphing element. For other animations, like slide animations (see the header in [this demo](https://live-transitions.pages.dev/), layered capture doesn't make sense and might look odd. Having the two layers as content often makes more sense in that case.

In addition, when the two states are very different, layered animation might result in discrete animations (e.g. between a circle and a square clip-path), which would feel less smooth than crossfade.

## Backwards compatibility & opting in/out
Backwards compatibility analysis using the HTTP archive and trying some sites with the new mode shows that very few pages would be affected by this, as the vast majority relies on the default transition. However, any slide transition would feel a bit broken (like the demo above). That's because the :`:view-transition-group` pseudo-element now has reach animations that weren't there before, and customizations that rely on changing its keyframes or its descendant keyframes would create a very different effect than before.

There are 3 ways to go about this:

1. Have only layered capture. Authors can achieve flat capture by creating a container and making their current participating element into "content" which would still be flattened.
2. Add a new pseudo-element that animates the effects and box decorations, and leave the ::view-transition-group as is. This would also simplify things for people who want to play only with geometry and not with the effects. This won't solve all backwards compatibility issues, but it would solve most of them and would make a clean separation between animating geometry and animating properties.
3. Expose a property that opts in or out to this new behavior.

-- 
GitHub Notification of comment by noamr
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/11078#issuecomment-2446630719 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 30 October 2024 11:08:00 UTC