limber vale
Hi, when reloading a page, I get a white flash. This is happening since a recent update (or change in my code), it was not there before. How can I pinpoint the cause of this?
A reproduction in production can be found here: https://hetbrugrestaurant.nl/
White flash on page reload
I found another thread with a similar problem suggesting disabling third party scripts, however I only have Sentry and Plausible and if I disable both the issue still persists.
limber vale
Was missing "ssr" in the nuxt.config, going to check now if that fixes is. I assumed SSR was enabled by default
limber vale
Did not work. I have another app with basically the same dependencies and settings and code and it does not have the same issue.
honest tide
I have encountered the issue once. In my case, it was because I had an invalid html structure. Like placing a heading tag inside a div. There may be other causes too and it typically has to do with mismatches between what the client renders and the server renders.
limber vale
@honest tide I don't see any hydration issues in the console, do you know of methods to find out what goes wrong?
limber vale
I have removed all stylesheets, plugins, components, stores, etc. from the project, the nuxt config is basically empty and I added one piece of text and an image to the index.vue page, but it still gives the same issue, I see it flicker to white after a reload
The weird thing is, this is a "storefront" of which there are currently 3 in the project. They are basically copies, with some tweaks in styling. But all basic logic is the same. Only this one is giving problems.
Maybe its a dependency issue from my PNPM monorepo. Going to try and isolate it now
limber vale
With all dependencies removed and the project isolated the issue is gone. Going to backtrack now where the issue is.
limber vale
It appears it was simply a version mismatch, probably one of the packages was using vue 3.5.11 and the other 3.5.12 or something like that.