When I look at the waterfall in detail, I see that it took 6.322s to Start Render.
First there is about a 2 second Time To First Byte for the main page.
Then it has to fetch 4 .css stylesheets and 5 .js javascript files.
One file doesn’t start until the other finishes. Why do they all have to occur serially?
This is a wordpress blog hosted on Yahoo. Various plugins have their own style-sheets and javascript. I see the recommendation to combine .css in one file and .js in one file. Is this possible with wordpress? We didn’t write the code, only installed it and activated various plugins and widgets.
Also, I don’t know if Keep-Alive is turned on. Would that eliminate the Initial Connection latency (orange)? How to turn on Keep-Alive when webhost is Yahoo webhosting. I don’t think I can modify an Apache config file or anything. I only have ftp access to the host computer.
I would like to at least get to the green line (Time to First Byte) quicker.
Ahh, the nature of the beast. Javascript files (in the head at least) block other files from loading in parallel which is why you see them loading serially and why it is so critical to merge them together into a single file. The css files can load in parallel but even then it’s still only 2 at a time from the same domain so merging them is important as well.
There are wordpress plugins that can do the combining for you (here is a pretty good link: WEBO Site SpeedUp – WordPress plugin | WordPress.org). You should probably also look at some of the others like W3 supercache which will significantly reduce that first byte time as well. Google around a bit, there are a LOT of articles on speeding up a wordpress site.
Yes, the keep-alives would eliminate all but 2 of the initial connect times (the browser still needs to open the connection initially but then it will keep it open and re-use the connection). Do you have access to modifying .htaccess files? If so, is there already one there somewhere? I can’t imagine that Yahoo would have it disabled by default so I’m wondering if there is something with your config that is turning it off.
Those are the biggies but if you can get gzip enabled you’ll also cut 100KB+ off of the download (and most of it at the beginning).
I am trying out WEBO Site SpeedUp to see what kind of improvement I can get.
I don’t have any .htaccess files that I know about. I am not sure if I can write to .htaccess file or not. Maybe .htaccess is not allowed. Here are is the server status from WEBO
I first tried the WEBO Safe but it didn’t seem to speed up the time to Start Render.
Then I tried WEBO Optimal. For some reason the Image in the post on the font page was broken.
Then I tried WEBO Safe
Combine All CS in tags and <body
Combone All Javascript in and
This defintely sped things up. Time to Start Render was 3.602s and Document Complete was 9.116s.
Unfortunately, the page was broken–a lot of things on the page didn’t appear.
I’m not sure why combing cs and js files would break the page like that. I will have to experiment with it some more.
The latest thing I tried was disabling WEBO and then turning on WP Super Cache. Basically, this WP plugin makes static html pages.
I set WP Super Cache Status to ON WP Cache and Super Cache enabled
This sped things up considerably. The green Time to First Byte was reduced to less than one second. Time to Star Render was 3.807s. Still has the problem of multliple cs and js file. Document Complete 9.591s
You can try to edit the Webo configuration manually.
I use here and now and virtually have only 1 CSS and 2 JS.
Get the safe configuration and go enabling the options, one by one, and restarting your page.
I did that and now I have a “A” YSlow site.