you were right!

it took me some time to test all cases manually and migrated them to playwright - but it behaves exactly as you described
github.com/jantimon/rea...

I also ran the playwright tests with react-compiler and the results were quite impressive

You can clearly see that the modal backdrop is cut off

Here is Apple.⁠com struggling with these viewport bugs:

here `isPending` is NOT RENDERED and does NOT force the suspense boundary into its fallback

but in the second example the state is NOT RENDERED and DOES force suspense boundary into its fallback

both the isPending and the count state changed - but only one forces suspense boundary fallbacks

😵‍💫

here is a useDeferredValue example and unit test

it shows that useDeferredValue has no effect at all and causes the Suspense barrier to render its fallback

for me this does not match the documentation which says "useDeferredValue is a React Hook that lets you defer updating a part of the UI"

Here is something else what confuses me and where I also don't know what I don't know

This is a component inside memo and I don't understand why its render function is called 30+ times in this example

stackblitz.com/edit/vitejs-...

Are there any docs which explain this behaviour?

Now that I invested more time I feel it is fine

My problem was that I didn't know what I didn't know and where to start when Suspense caused CLS

For example the docs say "non-blocking Transition update" - does that mean there are blocking Transition updates too?

Maybe I was just confused by AI 😄

what does soon mean?

we would love to use it but it feels like an abandoned feature

do you think it might become stable by 2025 or 2026?

maybe I can give you an idea of what I would have in mind - it's rather a css-in-js postprocessor that extracts css from your tsx

so you can keep writing ordinary css

it only imports the css - so you could still configure your bundler to split or combine the css as you wish

simple example

here you can see the difference for a small project

there it is ~400ms extra compilation time

I am working on a css-in-js lib which supports the styled-component syntax which compiles in rust (full HMR 27ms) and has no runtime

would that help with your pain points?

I believe that's not a problem
e.g. useState gives access to the prev value and allows to merge states (example)

this is possible in every framework and probably also for web components

my question is rather about hydration order and bundle splitting - could a context be downloader after a child?

oh cool - that's interesting it looks faster than I expected

a while ago I built a performance test because of real world performance issues we saw for android budget phones

and you can see that for a large dom setting a css variable causes a slow INP

next-yak-benchmark.vercel.app/styled

oh wow the team around cartes.app migrated their entire next.js app from styled-components to next-yak

@devongovett.bsky.social postcss allows global CSS keyframe animations in CSS-Modules

Could we please add the same for Lightning CSS?

github.com/parcel-bundl...

🔥 just released next-yak 4.0
(our 🦀 rust based 💅 styled-components to css compiler)

with a neat performance improvements thanks to React 19

To help fixing the CSS order issues in next.js and webpack I am currently analysing why the order is not the same as in parcel and vite:

github.com/webpack/webp...

If you have any insights about this topic please let me know