Solving white page flickering in Firefox

Posted by in Allgemein

Solving white page flickering in Firefox

When I released a website to a new server i realized some strange behaviour. While loading each page, the page flashed for a short period of time white. I figured out it happened in Firefox, but not in Chrome.

After some hours of searching for the source of the problem I found the solution! It’s the charset definition. The definition of the header sent by the webserver must match the charset definition in the meta tag of the website.

The solution to the white flicker problem in Firefox

The charset definition of the website was sent correctly:

But the webserver sent only the following header:
Content-Type: text/html

The solution was to sent the correct header:
Content-Type: text/html; charset=UTF-8

This can be done directly via PHP:

header('Content-Type: text/html; charset=UTF-8');

Or via a definition in the .htaccess file:
AddDefaultCharset UTF-8

Unfortunately the definition in my .htaccess file was ignored for some reason. So I enabled it globally on this server.

So what happened in the browser?

Firefox recognized that the charset in the website differed from the header charset. So it started re-rendering the whole page. And in this time it presented the white page.