CODEWITHSUNDEEP
next.jsnext.js13fouc
Yeats
Yeats

Reputation: 2065

Flash of unstyled content when doing router.refresh in Nextjs13

Nextjs 13 at least at one point recommended using router.refresh() to mutate data and revalidate if you let the user for example click a button in a client component that changes some data.

When I do this, the entire page flashes its unstyled content as the fonts are re-downloaded. I implement fonts in the official way, using next/font/google. How do I avoid this FOUC? I've read that server actions act like an even bigger refresh, so they wouldn't work, would they?

Upvotes: 2

Views: 1001

Answers (1)

baddox
baddox

Reputation: 81

This bug was fixed and reintroduced multiple times in the last several months. The bug is currently fixed for me on Next 14.1.

Here's the most recent mention of the bug that I was able to find on their GitHub:

https://github.com/vercel/next.js/pull/60175

Upvotes: 1

Related Questions