[BUG] Dark-mode screen flicker when opening a new document

[poVoq]

I have checked all the prerequisites below and I'm yet experiencing a problem

• Read the README.md
• Have the extended version of Hugo installed
• Used the exampleSite's config.toml as a reference

Describe the bug

When switching between documents in light mode there is a slight screen flicker as if the dark-mode still gets shown for a split second.

When disabling default dark-mode via enableDarkMode = false this switches around to a flicker in dark-mode as if the light-mode was shown for a split second. This is obviously much more jarring on dark-mode and thus more noticeable.

This is easy to reproduce with Firefox even on your hosted documentation version. With Chromium it is less consistent as it seems like even when enableDarkMode = true it flickers sometimes in dark-mode.

Desktop (please complete the following information):

• Browser: latest Chromium and Firefox

[ltguillaume]

This is deeply annoying when browsing the website.

The cause for this is probably that all JavaScript is bundled and loaded at the end of the page. For this to be solved, there should either be a non-JavaScript solution (see #92) or this bit of JavaScript sould already be run in head or at least at the top of body.

[ltguillaume]

At first, I didn't see the flickering in Firefox-based browsers, but it remained visible on Chromium-based browsers (see 8496fdf#commitcomment-102459533), but I just retested on a slow device and it's still present for both browser engines (Chromium-based browsers are just slower in this particular case).