why does my website flicker if i scroll too fast up and down the website when no content has changed
Unanswered
Chinese Alligator posted this in #help-forum
Chinese AlligatorOP
I have a recording of a deployed website ( stage environment, if that matters ) that flicker when I scroll up or down. THE CONTENT IS NOT JUMPING. When I am at the bottom of the page and quickly scroll up to the top, the content that should be showing shows blank for a quick second then the content reappears.
The second website I try this on in the video doesn't have this problem or at least it isn't at noticeable.
You can try it yourself at stage.theplaygroundtravel.com/landing/product1
you can compare with this site
https://try.kettleandfire.com/bb/hg
The second website I try this on in the video doesn't have this problem or at least it isn't at noticeable.
You can try it yourself at stage.theplaygroundtravel.com/landing/product1
you can compare with this site
https://try.kettleandfire.com/bb/hg
12 Replies
Chinese AlligatorOP
May have found the culprit, just realized none of my pages are statically generated...
Chinese AlligatorOP
OK I just found the most annoying reason why all my pages are served dynamically. Its because in some way shape or form I check cookies to see if there is any active cart in session. However that is literally only a small button on the header that cares about that information. Since it does I have no options of having that route statically rendered?!
WTH! I cant even call a server action through the same route. Is this also an issue for anyone else, cause it really sucks when I think about it.
WTH! I cant even call a server action through the same route. Is this also an issue for anyone else, cause it really sucks when I think about it.
@Chinese Alligator OK I just found the most annoying reason why all my pages are served dynamically. Its because in some way shape or form I check cookies to see if there is any active cart in session. However that is literally only a small button on the header that cares about that information. Since it does I have no options of having that route statically rendered?!
WTH! I cant even call a server action through the same route. Is this also an issue for anyone else, cause it really sucks when I think about it.
New Guinea Freshwater Crocodile
use client and server actions?
Chinese AlligatorOP
Thanks I didn’t think of grabbing cookies through client side.
Chinese AlligatorOP
Still with pre-rendered pages, I still get the same effect...
What's a stage environment?
Your page might be dynamic, but you can localize it in one of two ways using suspense. You can await the promise on a child component allowing the rest of the page to load while a section of you page is dynamically loaded or 2 you can start the promise on the page and not await it and pass it to a child component also wrapped in suspense and await on the child or if the child is a client using use()
Maybe this helps https://www.demos.patmac.ca/cache-components
You can also use cache components and still serve a static shell
Giant panda
I think this prombelem is sloved?
I'm not sure LOL. Hard to pinpoint what's actually going on with that scroll flicker without seeing the code, but it does sound like there might be some issues with the way he's streaming the dynamic data into the page