Forum Moderators: phranque
I would like the 8kb css to load first though.
This is what I did to make the site laod faster per Google's instructions:
<ifmodule mod_expires.c>
ExpiresActive On
ExpiresDefault "access plus 1 seconds"
ExpiresByType image/gif "access plus 518400 seconds"
ExpiresByType image/jpeg "access plus 518400 seconds"
ExpiresByType image/png "access plus 518400 seconds"
ExpiresByType text/css "access plus 518400 seconds"
ExpiresByType text/javascript "access plus 216000 seconds"
ExpiresByType application/x-javascript "access plus 216000 seconds"
</ifmodule><ifmodule mod_headers.c>
# Cache specified files for 6 days
<filesmatch "\.(ico¦flv¦jpg¦jpeg¦png¦gif¦css¦swf)$">
Header set Cache-Control "max-age=518400, public"
</filesmatch># Cache Javascripts for 2.5 days
<filesmatch "\.(js)$">
Header set Cache-Control "max-age=216000, private"
</filesmatch>
</ifmodule>
I also had this but disabled it (no results)
#<IfModule mod_deflate.c>
#<FilesMatch "\.(js¦css)$">
#SetOutputFilter DEFLATE
#</FilesMatch>
#</IfModule>
What am I doing wrong? Any suggestions?
thanks.
What you are seeing now because of the caching/compression changes is probably what most users with slow connections or slow computers (or both) see on your site all them time.
Try a search for FOUC, FOUSC, and "flash of unstyled content" for the causes and solutions of this problem.
BTW, be sure to completely flush (delete) your browser cache after making any server-side config changes. As this case illustrates, you've cached your own compressed CSS file, which causes a delay while it is being decompressed, so you still see the problem even after backing out the code changes on your server. And even though you're not longer compressing it on the server, the compressed version will stay in your cache for six days unless you flush it.
Another tip: When first experimenting with and deploying any kind of caching, set the time-durations on the short end. Keep everything down to only a few hours until everything is tested and has been proven to work. Then slowly increase the time only as your confidence grows. As it is, anyone who has fetched your CSS will be using the compressed version they've cached for the next six days, and if the time required to decompress that file is aggravating FOUC problems, then some of them will be seeing your site as 'broken' for the next six days, no matter what you may change on the server.
For the life of me, I can't remember the main cause of really-severe FOUC is -- I think it had something to do using CSS and having JS code in the page <body> instead of in the <head>, or something really obscure like that...
Jim
