Google’s “Let’s Make the Web Faster” Movement

Posted: June 29, 2009 Comments(5)

I love Google, I really do. The company and all of its work is heavily integrated into everyone’s lives no matter how hard you may try to escape it. Google not only takes a lot of initiative when it comes to the Web in general, Google has done a lot to facilitate Web development on many levels. From Google Code to Google Gears and many (many) in between, Google’s latest venture, Let’s Make the Web Faster, is geared directly at Web developers.

What you can learn

By far the largest resource available on Let’s Make the Web Faster is the collection of articles available. The articles are put together quite well, involving a good blend of video and supporting imagery. You’ll be able to quickly learn the background behind some of the jargon used in document optimization.

Articles aren’t limited to front end development, because there’s more to writing markup and style if you’re a Web designer. Google takes the time to discuss other relevant areas such as the optimization of Web graphics for faster download times without losing quality. There are also articles on optimizing your JavaScript and even some PHP performance tips. One of the headlines that first caught my attention was UI Messaging and Perceived Latency — what a great topic. Google also includes a number of links to various Tech Talks @ Google, which are always a good watch.

Let’s Make the Web Faster launched as a very information-rich resource, and I imagine Google will be adding new articles fairly consistently from here on out. What’s great is that Google has done its part in retaining the community value of Web developers by devoting a section of Let’s Make the Web Faster to the community, opening doors for your input.

As with everything, be wary

Just because you read it on the Internet, the information you got may not be bulletproof, even if Google wrote it. Articles attempting to Debunk Google’s Internet Optimization Tips are beginning to crop up, and I think it’s great. Google suggests a number of techniques, actively put in practice on many Google products, that I will personally never employ just because it skirts around a rule or two. Saving a few bytes by writing sloppy code just isn’t something I’m interested in doing.

Like every Web designer, I’ve worked in PHP. I tend to really like PHP, but I don’t know PHP on the intimate level that programmers know PHP. I’m still learning about how the language itself actually works. I’m specifically interested in what PHP does differently than other languages which causes it to be huffed and puffed upon by so many.

It’s very interesting to read that some of the PHP optimizations suggested by Google may not be entirely accurate. I always enjoy reading technical pieces written by programmers who will always know more than me about programming. The existence of such a thread shows the nature of the PHP community, and it’s good to see that even Google might not know everything after all.

The important thing to keep in mind when reading Let’s Make the Web Faster, as with reading every article on the topic of Web development, is to take everything with a grain of salt, and to not follow the advice blindly.

Page Speed for Firebug

Everyone knows about Firebug. It’s arguable the most widespread, actively used tool by the majority of developers and designers, and for good reason. The tool changed the way many people approach front end development, and it was a true game changer.

Some time ago, Yahoo! released an add-on for Firebug called YSlow. The tool aimed to help developers analyze documents and suggest optimizations not only for speed, but rules for optimization. YSlow proved to be very helpful for many people, and I know I learned a thing or two about some of the techniques I had been using for quite some time.

As part of Google’s initiative, they have released Page Speed, also a Firebug add-on aimed at page performance analysis. After installing the Page Speed add-on, you’ll notice a new tab within Firebug:

Screenshot of Google's Page Speed Firebug add-on, default tab

As with YSlow, you need to invoke the analysis by clicking a button quickly after navigating to the document you’d like to test. After completion, you’re provided with a very detailed report containing a breakdown of the criteria against which your document was run:

Screenshot of Google's Page Speed Firebug add-on, after site analysis

Additionally, Page Speed takes another step forward in offering to apply a number of optimizations to your document immediately. For instance, if deemed necessary, Page Speed will go ahead and minimize your JavaScript on the fly, as the browser downloads the JavaScript, having an optimized version ready at any time:

Screenshot of Google's Page Speed Firebug add-on, offering minified JavaScript

The last feature within Page Speed I’d like to tout is the CSS analysis. Beyond suggesting the combination of CSS files to reduce the number of HTTP requests, Page Speed will examine your style sheet on a per-line basis, letting you know what could be written better:

Screenshot of Google's Page Speed Firebug add-on, CSS analysis

Page Speed will separate your ‘very inefficient’ and ‘inefficient’ rules and let you know what makes each less than ideal.

As with YSlow, Page Speed has links throughout the panel directing you to the information backing up the suggestion, found on Google’s Let’s Make the Web Faster. I would suggest that everyone have Page Speed at the ready during a testing phase of a Web project. It will make sure your documents are top notch concerning performance, and you’ll become a better developer because of it.

There is an abundance of information available if you’d like to read a bit more before installing Page Speed. Even if you’re not a Firefox user, I absolutely suggest keeping it on hand not only for render tests, but optimization tests using Page Speed as well.

Overall impression

There is a lot to learn as far as Web page optimization goes. As new technology appears, you’ll have to learn even more, but it’s an important aspect of Web design and a valuable part of the medium. It’s important for you as a professional to know how to produce work of the highest caliber, and optimizations can do a great deal to make your work feel that much more polished. Google’s “Let’s Make the Web Faster” is a great platform that should help spread the word very quickly to a large audience.

I hope to see Google continue developing content for the recent project, and I hope to see a decent community response, especially debunking any poor advice Google may be giving by offering detailed responses. While certain practices may achieve the most desirable result, it will be up to the community to ensure that the actions aren’t welcoming detrimental side effects causing more problems than before.

Get my newsletter

Receive periodic updates right in the mail!
  • This field is for validation purposes and should be left unchanged.

Comments

  1. It’s okay to be wary. Cautious is okay. Anyways – as for making the web faster — perhaps Google’s purchase of Clifton Park’s On2 Technologies will result in videos on Google and its properties load more quickly? Just a thought.

Leave a Reply

Your email address will not be published.