Is It Possible To Load Pieces Of CSS Code To Speed Up WP Loading?

cedomir87

Regular Member
Joined
Apr 21, 2010
Messages
337
Reaction score
102
I am looking to speed up my WP loading time as much as I can (especially since Google is officially introducing it as a ranking factor next month) so I've done the usual, I got a CDN and installed some plugins to move the JS scripts to the footer.

The only remaining problem is my style.css file. I'm currently using Newspaper theme which has a huge css file... Moving it to the footer, of course, breaks my website. Though everything looks fine after the file is fully loaded, I'm afraid users will immediately hit the back button if they see something is wrong.

My idea was to load only sections of the css code, mainly menu and main content div styling (without it adsense ads stretch out across the entire screen) since this content is above the fold...

Is something like this possible? Or is there some other solution to accomplish this?
 
This is called CSS Prioritization.

Step 1 - Extract the content of your CSS that is Above the fold - this includes header details, featured post etc.
Step 2 - Inline this CSS bit in between the <head></head> tags
Step 3 - Defer the rest of the file to load after your DOM has loaded (Load it at the end)

Problem solved. :)
 
Ohhhh, that's spot on advise right there, thank you! :)
 
Back
Top