[csswg-drafts] [resize-observer] ResizeObserver is too slow to be useful but required to be correct (#9560)

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

== [resize-observer] ResizeObserver is too slow to be useful but required to be correct ==
AFAICT, ResizeObserver is specifically designed to be slow to respond. So, if you use it to, for example, resize a canvas animation, you end up with situations like this


https://github.com/w3c/csswg-drafts/assets/234804/1023d046-ee35-4249-8019-9b3ebdae7b69


Above the page is using `ResizeObserver` events to adjust the size of the canvas. notice the image gets stretched and distorted because the frequency of events from `ResizeObserver` is too slow to keep up with the size of the canvas.


Compare to this animation which looking up the size to make the canvas via `element.clientWidth` and `element.clientHeight`


https://github.com/w3c/csswg-drafts/assets/234804/e5047428-bea9-47fc-8be5-d3fb2906c39f

This one does respond in time to update the canvas as the page resizes

The problem is, only `ResizeObserver` returns correct sizes via `devicePixelContentBoxSize` so if you want a pixel perfect display you're stuck with the first behavior instead of the second. That seems undesirable.

You could workaround the issue by some complicated solution where you first use some non-correct means like `clientWidth` and `clientHeight` or `getBoundingClientRect` and then try to update your incorrect guess with the correct data from `ResizeObserver` and `devicePixelContentBoxSize` but the fact that you'd have to jump through these hoops seems to suggest maybe the spec needs a revisit?



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


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

Received on Monday, 6 November 2023 06:27:57 UTC