Performance issue due to focus state in Safari

Not so much of an issue that needs fixing but it might be useful to mention in the docs:

While implementing a11y-dialog in a website I ran into a strange issue due to Safari’s user agent stylesheet. This is a fullscreen dialog, the dialog content spans the whole screen. As soon as the dialog opens focus is set on the dialog container. Safari applies user agent styles for the focus which then hinder the performance. For instance resizing the browser becomes very choppy. Also when you’ve applied animations to the dialog these don’t run and skip to the end immediately as Safari is struggling. The solution I’ve used to resolve this is to set .container:focus { outline: none}.

[iksi]

Unfortunately I haven’t had the time to adjust the demo, I’m fine with closing the issue. Thanks for your time in any case 🙏🏻

[iksi]

I’ll update the example with some animation (this is when I first noticed the issues with Safari) as it might demonstrate the issue a bit clearer.