5

We use Google Analytics to measure traffic on one of our websites (who doesn't?).

One of the thing that strikes us is the "page speed" tab. It shows that our website takes on average 5.69 seconds to load over the last 30 days. This is clearly way too slow, and we want to make that much faster.

We are a PHP and Apache site, but we use Google's Site Optimizer module for Apache. The content itself. With ab, I find that it takes on average 150ms to serve each and every document, also, a single document is loaded with 5 calls (1 CSS, 1 JS and 2 images). However, these assets should obviously be cached after the first request.

When I look at the "Network" tab in Google Chrome, I find that my site is slow mostly due to adsense, analytics, Google+, doubleclick... or even Facebook (we show a widget). These should obviously not be counted in the "load time" for our page, because these are not part of the content.

The site is Jobetudiant and you can access a version of it with no extra JS calls by adding noext&nopub to any URL.

What would you do to optimize the load and rendering times?

Improve this question
3
  • I'd remember that external web services are somewhat out of my control, and think about not using any that slowed my site down too much.
    – Rob Moir
    Feb 28, 2012 at 10:40
  • Well, we don't have much of a choice... I'm afraid.
    – Julien Genestoux
    Feb 28, 2012 at 14:54
  • I understand that, and I'd also be looking at the optimisation tricks below, but you also have to fundamentally accept that when you drop lots of 'widgets' onto your website from other people then you're losing some of your control of how well behaved your site will be (e.g. if slow loading times or malware style ads are served up by your ad broker, people will remember that it happened on your website, not which one of your 'partners' dropped the ball).
    – Rob Moir
    Feb 29, 2012 at 10:37

5 Answers 5

Reset to default
4

If the performance bottleneck is GA, AdSense, etc. then you need to look into non-blocking JavaScript. Since these are non-essential libraries, they can also be loaded asynchronously after the page has loaded.

You might also consider reducing the amount of widgets and ads you include on each page. There's probably no need to serve up content from more than a single ad network at a time, and having 6 ad units above the fold is a bit excessive.

Besides that, there's not a whole lot you can do. If you want to stuff your pages with a massive widget that shows 20 fan thumbnails and large skyscraper and leaderboard ads, etc. then there's gonna be some performance overhead for that.

Improve this answer
3
  • Is there a way to make existig JS non-blocking? We can't get rid of ads on this site, because it is indeed ad supported.
    – Julien Genestoux
    Feb 28, 2012 at 14:55
  • @Julien: For nearly all JS it's possible. But going one step further and loading 3rd-party components asynchronously is even better. There are a lot of ways of doing this (just google "asynchronous javascript non-blocking"), but the simplest is to insert such scripts into the DOM dynamically after page load. Ideally, you would put the JS that does this at the end of the page. So your content would load first, and when your page is done loading, GA, Adwords, etc. get injected into the page.
    – Lèse majesté
    Feb 29, 2012 at 6:09
  • Also, Google Adsense uses a similar approach called ASWIFT (Asynchronous Script Written into IFrame Tag), which you can learn about here. For other non-blocking techniques, see this page or check out stevesouders.com.
    – Lèse majesté
    Feb 29, 2012 at 6:30
3

You should check out: Steve Souders who does performance work at Google, Yahoo's Best Practices for Speeding Up Your Web Site, Google's Speed Insights and a good watch is Velocity 2010: Nicole Sullivan, "The Top 5 Mistakes of Massive CSS" on YouTube.

Personally I find enabling gzip compression on my pages to be a huge benefit. You've made the best start by actually gathering the measurements before you start trying to improve anything.

Improve this answer
1
  • 1
    Hum. We already have GZIP turned on. The thing is that I'm trying to optimize the "rendering" of the page (+ads), because I don't think there is much we can do with the server side that wouldn't be marginal. Right now, the server stuff represents less than 5% of the load time :(
    – Julien Genestoux
    Feb 28, 2012 at 9:25
2

The best thing you can do is server side caching:

You can install APC by running: pecl install apc.

  • Provides opcode cache (stores compiled code post parsing removing the parse and complication step on subsequent execution)
  • Provides user cache - note the following bugs: (1) (2).

Once you have finished tuning the server it is time to look at third parties. Move JavaScript includes to the end of your content. This will allow the rest of the site to load first and I recommend you take a look at Google Speed Insights.

Improve this answer
1
  • But the server side is curently less than 5% of the whole load time. any improvement would already be quite marginal.
    – Julien Genestoux
    Feb 28, 2012 at 9:27
1

Install Firebug for Firefox and then install the Google PageSpeed addon (and Yslow if you want another perspective). These will tell you specific details on how to optimize your pages to make them faster.

Improve this answer
1
  • Also Chrome has this built in. It's pretty interesting seeing what's taking the most time to load, no guessing, you view it in the chart and start axing the ones with the longest stripe.
    – Fiasco Labs
    Feb 28, 2012 at 16:56
1

Here is what I do to improve my pageload times:

  1. I use cloudflare. They have got a tool called Rocket Loader for simultaneous loading of javascript that reduces pageload times.
  2. Since my site is in Drupal, I have got a built in tool to aggregate and compress CSS and javascript which also helps me.
  3. Try gzip for faster html loading. If you have got a dynamic website on php, try these; install and configure memcache/memcached/varnish. These really helps to reduce server load and improve pagespeed. As a result of all these, my site now has a score of 97/100 in pagespeed insights.

(This answer assumes that you already have your page built with standard practices such as adding expires to headers, rounding the images with size, etc even though these does not help in your case).

Improve this answer
1

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.