[csswg-drafts] [css-view-transitions-2] Ignore offscreen elements from participating in transitions (#8282)

khushalsagar has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-view-transitions-2] Ignore offscreen elements from participating in transitions ==
Currently if an element has a non-none computed value for `view-transition-name`, it participates in the transition irrespective of whether it is in the visible viewport. This means the element will be rendered, which has significant computational and memory overhead, even if it is never seen by the user. If the developer wants to avoid this overhead, they have to keep track of the visibility of each element and only add `view-transition-name` to the onscreen ones.

The proposal to make this case easier is as follows:

- Add a new CSS property view-transition-offscreen which customizes the behavior for named elements based on their position in the snapshot viewport.
- The property has 2 values: auto and absent. auto indicates that the UA should render the element irrespective of its viewport position (as-if its onscreen). Would be nice to allow flexibility to the UA to optimize out such elements in case the transition is on memory constrained devices. That's why "should" instead of "must".
- absent indicates that if the element's ink overflow rectangle does not intersect the snapshot viewport, the element does not participate in the transition (as-if its view-transition-name's computed value was none).
- The computation for the element's viewport position for the decision above can be done [here](https://drafts.csswg.org/css-view-transitions-1/#perform-pending-transition-operations-algorithm:~:text=associated%20document.-,For%20each%20element%20of%20every%20Element%20and%20pseudo%2Delement%20connected%20to%20document%2C%20in%20paint%20order%3A,-The%20link%20for) for old elements. And [here](https://drafts.csswg.org/css-view-transitions-1/#perform-pending-transition-operations-algorithm:~:text=for%20transition.-,Update%20pseudo%2Delement%20styles%20for%20transition.,-Note%3A%20The) for new elements. The subtlety is that for new elements we do it before resolving the ready promise so script can observe the final pseudo DOM structure.

See prior discussion on this [here](https://github.com/WICG/view-transitions/issues/84).

Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8282 using your GitHub account


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

Received on Thursday, 5 January 2023 20:22:09 UTC