Tools to revamp Page Loading Speed

There are numerous tools available online, which allow you to test and analyze page loading speed of your Website. You can either use them online or download them for testing purpose. You will also notice, there are some paid and premium tools available for testing page loading speed. Almost every tool tests the speed and just shows suggestions to improve the performance, which doesn’t helps much. However there are few tools available which allow you to optimize speed at higher levels. With the combination of these tools you can boost the page loading speed of your site to only a few seconds. Read on to find out, which tools are these and how you can use them.

Firefox Add-ons

Download and install these exciting Firefox add-ons one by one:

  1. Firebug: allows you to analyze HTML/CSS/JS, and modify the layout on-the-fly. In addition, you can extend its feature with below mentioned extensions.
  2. Google PageSpeed: is an extension to Firebug. It allows you to test your Website’s Page Loading Speed and shows suggestions how you can improve its performance. Follow the suggestions and make your Website speedy.
  3. Yahoo! YSlow: is again an extension to Firebug. It analyzes the Website performance, display the statistics; provide famous tools like JSLint & Smush.it for in-depth analysis, and show suggestions to improve the performance.
  4. Firecookie: Do you know cookies are the culprit to load any Website in a browser? If your Website is running slow then you must inspect its cookies with Firecookie extension.

Now analyze your Website using PageSpeed & YSlow, and then follow their suggestions to improve the Page Loading Speed.

Screenshot of testing our Website with Firebug and its extensions

Web Page Analyzer

This online server analyzes your Website’s Performance and helps you in diagnosing the notified problems in the analysis.

Screenshot of Web Page Analyzer Online Tool

Best Designed WordPress and Bootstrap Themes

Designmodo Shop

CSS Sprite Generators

CSS Sprites helps to reduce the total number of HTTP requests created for image resources required by your Website. In fact, a CSS Sprite combines several small images into a large one defined through X and Y coordinates. You can assign these coordinates to image positioning elements in CSS. Mostly CSS Sprites are used to create large background through very small-sized images. The small image loads up only once and displayed at different defined places. To use a CSS Sprite Generator, you have to

  1. collect the images into a zip file,
  2. upload the zip file to a generator’s Website/Tool, and
  3. generate the Sprite.

Following are few famous CSS Sprite Generators

  1. CSS Sprites.com – it is an easy to use online tool. You can upload as many as images you want and change the settings as per your requirement.

Screenshot of CSSsprites.com, a free CSS Sprite Generator

  1. Sprite Gen Website Performance – A nice online tool to generate CSS Sprite with more options.

Screenshot of SpriteGen Website-Performance

Image Optimizers

You can use following Image Compressors to optimize your images and compress their size.

ImageMagick

ImageMagick provides a command line tool to not only compress the file size but also to add more look-&-feel to your images. Using it, one can transform the static 2D JPEG image into a 3D PNG format with simulated depth, rich textures and less file size. ImageBrick GUI Releases are available for Windows, Unix, iOS and Mac.

PNGCrush

PNGCrush is a command-line optimizer for PNG images. You can run it either in MS-DOS at Windows or at command line in Unix/Linux. Two GUI tools are also available if you want to take benefit of PNGCrush in GUI mode. These are:

  1. ImageOptim for Mac
  2. Trimage for Ubuntu, Debian, and Linux

JPEGclub

JPEG Club provides two tools jpegtran and Jpegcrop to optimize the JPEG images. jpegtran resizes the JPEG images without any loss, whereas Jpegcrop allows you cropping the images. You can make use of JPEGCrop Windows Utility to take benefit of both options.

Closure Compiler

This software allows you creating faster JavaScript to run and download on Websites. It is a simple Web Application, which makes use of a RESTful API. You can also install the Closure Inspector extension in Firebug add-on at Mozilla Firefox to review the changes done by Closure Compiler.

WebP

Google, Adobe, Microsoft and other giants are working with WebM foundation to create new standards for open Web and making much better than we’ve today. In the same project, WebP image format have been launched. This format have 39.8% smaller file sizes than JPEG formats. You can visit Google Code’s WebP Page and download the converter to convert your JPEG/PNG/BMP files to WebP format.

MinifyJavaScript

Want to simplify your work of minifying JavaScript then MinifyJavaScript is here to help. You can visit its Website, enter the code and click ‘Compress JavaScript’ button to minify the long-&-lengthy JS into a pretty-&-small code.

Online JavaScript Compressor to minify JavaScript Code from MinifyJavaScript.com

mod_pagespeed Apache Extension

In its Page Speed project, Google has developed mod_pagespeed Extension for Apache. You can download it in free and integrate with Apache 2.2 or later.

mod_pagespeed for Apache from Google

Google Page Speed Service

Google has started to provide the Page Speed Service to the Websites, but it is limited to only a few Webmasters. This service helps you to speed up the page loading speed of your Websites or Web Apps.

Google Page Speed Service in Trial Version

Google Page Speed Service will:

  1. fetch content from your servers
  2. automatically minifies the JavaScript & CSS using Closure Compiler
  3. optimize and rescale images automatically
  4. rewrites fetched content according to the standardized rules of optimizing Page Loading Speed
  5. serves the optimized and fast loading content to visitors.

One can fill this form and request Google to provide this service. It is noteworthy that Google has not declared till yet whether this service is free or paid. Currently, this service does not support HTTPS, Flash, streamed audio, streamed video, non-www domains, and domains hosted on Blogger, Google Sites or Google App Engine.

YUI Compressor

Yahoo! has built this command line tool to help you in increasing the performance of your Websites and Web-based applications. You can download YUI Compressor Library and follow the mentioned instructions to use it on Linux/Ubuntu/Fedora or other environments. If you are not a programmer then you can opt Online JS/CSS Compression Tool from Refresh-SF.com. Browse the Website, paste the code of desired JS/CSS file, and it will compress them using YUI Compressor.

Screenshot of Online YUI Compressor Tool at Refresh-SF.com

Content Delivery Networks (CDNs)

A Content Delivery Network is a network of geographically distributed computers containing copies of the data placed at each node. CDN will have several copies of Website content at different nodes scattered around the globe and allow the users to access a copy located quite near to his/her location. This will reduce the bandwidth and redundancy to a single location hosting your Website. Famous CDNs are Akamai, Limelight Networks, BitGravity, MaxCDN, and CacheFly.

MaxCDN

Most of the CDNs or Cloud Hosts are quite difficult to setup as they need technical knowledge and expertise on Web Hosting concepts. On the contrary, MaxCDN is simple and easy to configure. You just have to spend 5 minutes to configure it, Moreover its rates are also flexible. If you are using a CMS like WordPress, Joomla, Drupal, Magento, X-Cart, OS-Commerce, or Typo3 then there are ready-to-use plugins or extensions available to configure MaxCDN for your Website. In addition, you do not have to pay an extensive price to use it because their charges are flexible and based on pay-per-use. They provide 30 days money back guarantee, free shared SSL, and 24/7 technical support as well.

Conclusion

Optimizing page loading speed only through Browser and Proxy Cache may be an easy task, but for better performance, we suggest using above tools. We invite our readers to add remaining tools to optimize Page Loading Speed through their valuable comments.

Keshav Arora is a Senior Technical Writer with seo-Semantic-xhtml.com, a specialized division of IPraxa. He specializes in topics on Content Management Systems, Web Design and Development Technologies. seo-semantic-xhtml.com provides PSD to HTML, XHTML, CSS and 3rd party application integration. Follow us on Twitter, and be our fan on Facebook.

Newsletter

4 Comments
  1. Jason Aug 10, 6:10 am

    Yahoo SmushIT is also a great tool to reduce image file size
    http://www.smushit.com/ysmush.it/

    Reply
    0
  2. Jason Aug 10, 6:16 am

    Another interesting idea is to Blogger as simple business website. Leveraging on its servers, Blogger websites are served with CDN.

    This is some sort of FREE resources for small business to get CDN. ;) My company use Blogger as company website blogmakeover[dot]net

    Reply
    0
  3. Akhtar Aug 12, 10:53 am

    Very useful tools… helped me a lot recently. Good idea to post it ;)

    Reply
    0

Leave a Reply

*
* Minimum length: 20 characters