Page flickering

I’m wondering if Hugo-based website page flickering is just something that’s supposed to be tolerated as a tradeoff with some of Hugo’s other advantages.

I recently opened an issue about this in github, which was actually reopening an older issue, but it was immediately closed and locked as resolved.

I’m experiencing a very fast full-page white flash/flicker on page load when navigating Hugo-based websites. There are also frequent flashes of unstyled content. This is happening with every Hugo theme demo I have tried from here:

It also happens with the Hugo website itself.

I’m experiencing this in Chrome, Firefox, and Edge on Windows 10.

I’m not experiencing it when previewing any Gatsby theme demos, and it seems to depend on each theme architecture with Jekyll - some have FOUC issues and some don’t.

Hugo is my preferred site generator because of its seamless integration with the R blogdown package, but the page flickering/FOUC issue is a serious barrier for websites that demand a cleaner user experience.

Any ideas why this could be happening with ALL Hugo-based websites and if there’s any way to fix it?

It doesn’t happen for me, or, I daresay, other users of Hugo. Certainly you are the first to complain of this. Hugo doesn’t modify the HTML, CSS, or JavaScript so any flickering issues are likely caused either by the theme itself, or is an artifact of your setup rather than normal Hugo behaviour.

You will need to provide complete documentation of not only the site and theme you are testing against, but your system and browser setup if you want support on this.

Also, if testing using the local ‘server’ (hugo serve) have you tried disabling the 'livereload` feature, as that causes a page reload and refresh when a page is changed. If you using some tool like Tailwind you may find that it causes a lot of file changes that trigger the reload.

1 Like