Improving website performance with Google Page Speed

As you know website load time greatly affects website ranking in Google. Page load speed depends on wide range of parameters of web-server configuration and website CMS. To test and optimize these parameters the Google suggested using Google Page Speed.

Introducing Google Page Speed

Google Page Speed is an addon for Mozilla Firefox with Firebug addon activated. With the help of this addon you can value the performance of web server and website CMS. This evaluation is based on effective methods of increasing page loading speed. They are called web performance best practices:

  1. Optimizing caching: cache optimization of website static objects (CSS and JavaScript files, images) by browsers and proxy-servers;
  2. Minimizing round-trip times (RTT): minimizing the amount of DNS requests and HTTP redirects. It's JavaScript and CSS files combining, arranging CSS and JavaScript links, arranging javascripts, using four or five web-servers to provide parallel loading of page components;
  3. Minimizing request overhead: minimizing cookies size; loading static objects from domains that don't use cookies;
  4. Minimizing payload size: using gzip compression; deleting links to not used CSS; minify JavaScript and CSS code, defer loading Javascript code that doesn't go immediately after page loading; images optimization, using unique URL for all page components to decrease RTT;
  5. Optimizing browser rendering: not using ineffective CSS selectors; not using CSS-expressions, relocation of CSS links and inline CSS into document headers, specifying images sizes.

Website analysis with Google Page Speed

In order to analyze the website with Google Page Speed run Firefox and navigate to the website page you want to analyze. Then you need to activate Firebug (select Tools > Firebug > Open Firebug or press F12. In the Firebug menu select Page Speed tab. To get accurate results wait until the page you want to analyze is fully downloaded. Press Analyze Performance button.

Analyzing is started. It takes from few seconds to few minutes before you get the result.

Google Page Speed report sample

In this fragment of the report Overall performance summary (total score) has Medium priority. You can also see the list of rules (best practices you can use to improve your website performance), the page's score on each one and the link to Google Page Speed suggestions for improvement. Performance scores are the following:

  • High priority - High priority score indicates that these rules have to be optimized first. It wont take much effort but will greatly increase the performance;
  • Medium priority - Medium priority - optimization of rules with this score can be postponed as it requires lots of efforts and wont improve performance much;
  • High priority - Low priority - rules with this score don't need to be optimized or can be optimized but this will improve the performance just slightly (getting this score for a website that has to be optimized is very unlikely);
  • High priority - Information message - this score indicates elements that are not connected to the analyzed page or test errors.

Pressing the plus sign allows you to see all Google Page Speed recommendations based on analysis of particular rule. For example Leverage browser caching test checks if web server responses have correct HTTP Expires headings (they set the time interval during which browser can use objects preserved in its cache and doesn't have to load them from web server) for static objects:

Google Page Speed Leverage Browser Caching

To do more detailed analysis you can use Advanced Options: turn on Profile Deferrable JavaScript (showing up JavaScript code that doesn't go immediately after page loading), Automatically Run at Onload (automatic testing of all visited pages) and choose required User Agent (browser type). These options can be viewed if you select the Page Speed tab and click the down arrow. You should take into consideration that turning on Profile Deferrable JavaScript will slow down your browser so don't use it until it's really necessary. Also keep in mind that in most cases it's better to choose Default Value for User Agent because other choices may cause errors.

This is a short version of website analysis with Google Page Speed. This information is quite enough for all who perform website maintenance on amateur level. For web-developers and technical support specialists there are more advanced tools to analyze website performance.

Website optimization with Google Page Speed

As any tool Google Page Speed can't configure web servers and website CMS, it just provides you information that can help you to improve the performance of your website. But it can be very helpful with CSS and Javascript files and images optimization that is purely mechanical and doesn't require any special knowledge or skills.

Optimization is being performed transparently during website analysis. More compact copies of objects are being saved in three sub-folders of the folder chosen in Save Optimized Files To in Advanced Option menu. CSS files are being saved in page-speed-css subfolder, JavaScript in page-speed-javascript sub-folder and images in page-speed-images sub-folder. Recommendations on optimization are being put into sections Minify CSS, Minify JavaScript and Optimize images of the report. Google Page Speed suggestions for improvement can be viewed by pressing плюсик. That's Minify CSS test result for the main page of the website before optimization:

Google Page Speed Minify CSS

In this screenshot you can see that the page is using 4 CSS files that can be reduced in size for 30.7KiB (or 50%).
After we performed the minification of all of our CSS files the plus sign button disappeared and the score for Minify CSS changed from Medium priority to High priority.

Google Page Speed Final Report

The procedure for JavaScript files and images is the same. Don't forget that after updates of CMS, CMS themes and CMS plugins you might need to do it all again.

Afterwords

Google Page Speed is a very useful tool and everyone who performs the website tech support should turn their attention to it. Google Page Speed can provide you with detailed report and will give you recommendations for improving website performance anytime and free of charge. This kind of information shouldn't be underestimated. Good luck with optimizing your website!






  1. Danila
    2014-06-10 02:07:42
    Did you know that you can take much of optimization hassle by using service www.getpagespeed.com ? It automatically installs mod_pagespeed on any VPS :)

Got a comment?

captcha =

Categories

  1. System (20)
    1. FreeBSD (5)
    2. Linux (9)
  2. Email (2)
  3. DNS (2)
  4. Databases (1)
  5. WebServer (27)
 
Copyright © 2012-2015 HowToUnix - *nix Howtos and Tutorials
All Rights Reserved.