Suspense not working as expected
Answered
Norwegian Forest Cat posted this in #help-forum
Norwegian Forest CatOP
Hey gang, i'm trying to get to grips with React Suspense and using Next Loading...
I've set up a repository:
https://github.com/dextermb/nextjs-suspense-testing
Deployed to Vercel:
https://suspense-five.vercel.app
and as you can see my 5 second sleeped promise does not seem to show a loading state or delay initial paint.
Any ideas what I'm doing wrong here? Any good tutorial or documentation as I found it hard to understand the Next docs on streaming as there's limited examples.
I've set up a repository:
https://github.com/dextermb/nextjs-suspense-testing
Deployed to Vercel:
https://suspense-five.vercel.app
and as you can see my 5 second sleeped promise does not seem to show a loading state or delay initial paint.
Any ideas what I'm doing wrong here? Any good tutorial or documentation as I found it hard to understand the Next docs on streaming as there's limited examples.
Answered by Norwegian Forest Cat
Incorrect. I reached out to Lee. It's a bug with Safari where the browser won't wait for suspense when loading small amounts of information.
27 Replies
Norwegian Forest CatOP
Seems like this was a Safari related bug that is undocumented. Thanks @Multiflora rose seed chalcid for pointing it out 
Multiflora rose seed chalcid
To clarify, it's a issue with any framework and Safari
@Norwegian Forest Cat Hey gang, i'm trying to get to grips with React Suspense and using Next Loading...
I've set up a repository:
https://github.com/dextermb/nextjs-suspense-testing
Deployed to Vercel:
https://suspense-five.vercel.app
and as you can see my 5 second sleeped promise does not seem to show a loading state or delay initial paint.
Any ideas what I'm doing wrong here? Any good tutorial or documentation as I found it hard to understand the Next docs on streaming as there's limited examples.
the page is static and it is pre-rendered on server, I don't think you would see loading state on any other browser
@Ray the page is static and it is pre-rendered on server, I don't think you would see loading state on any other browser
Norwegian Forest CatOP
Incorrect. I reached out to Lee. It's a bug with Safari where the browser won't wait for suspense when loading small amounts of information.
Answer
Norwegian Forest CatOP
Please do your own research rather than messing with my answered question. You can even check the source code here
https://github.com/dextermb/nextjs-suspense-testing/blob/main/app/page.jsx#L10-L12
https://github.com/dextermb/nextjs-suspense-testing/blob/main/app/page.jsx#L10-L12
yes there is an issue with streaming on safari
please test your page with chrome
if you see loading state, then you are right
but your page is static generated
@Ray please test your page with chrome
Norwegian Forest CatOP
No need. I have moved on from this question as it was answered over a month ago. Please stop re-opening questions
please don't mark incorrect answer
@Ray please don't mark incorrect answer
Norwegian Forest CatOP
it is not incorrect
Here is a snippet of the convo with Lee
yes it is because your page is static
@Ray yes it is because your page is static
Norwegian Forest CatOP
There you go, I have forced the page to be
force-dynamic. Now feel free to test yourself on Safari vs. ChromeYou will see that Safari will hang for 5 seconds while Chrome will stream the page.
I know
Norwegian Forest CatOP
Then what is your point?
you were testing suspense with a static page
it is not gonna work on any browsers
Norwegian Forest CatOP
it was a poor minimal example, fine, you could test it locally inwhich it would never be static/cached
still not sure why you're reading into a question that was resolved over 30 days ago with a valid answer for the problem – even if the example was poor
orly
Norwegian Forest CatOP
Alrighty guy, I'm going to block you. have a nice day
go ahead