Curated by: Luigi Canali De Rossi
 


Tuesday, November 9, 2010

How To Speed Up Your Website Page Load Performance By Delaying The Load Of JavaScript And Widgets - Part 1

Sponsored Links

Are you looking to speed up your web site speed performance and page load speed but you don't know what to do with all those third-party widgets and JavaScripts you have been adding on your side columns? Have you just finished testing your web site speed with Google Page Speed, YSlow or GTMetrix only to find out that you have a ton of third-party stuff that is slowing your site down to a crawl?

speed_up_your_website_id324898_2.jpg
Photo credit: Stanely Hong

Time to take control back and to utilize a technical strategy that doesn't force you to give up all those goodies, while gaining back some, if not most of your original of your speed.

But before I tell you how to do it, let me make sure you know well why you should be so concerned about website speed.

  • Google now officially uses speed to rank your website inside search results. The faster your pages load, the more likely that Google will give preference to your site over others that have the same level and quality of information on a certain topic.

  • Users don't wait as much as you do. Especially those who are arriving on your site while having never been there before, will only concede a bunch of seconds to your site to display what they are looking for before giving up and going somewhere else. Put yourself in the shoes of one of your readers or potential customers. Have you ever felt like you could brew some coffee while your favorite sites open? You do feel frustrated, right? Well, so do they. And when frustration sets in, you miss the opportunity to attract new readers and convert your visitors into customers.

In this two-part guide you will learn how you can speed up your website performance by delaying the load of JavaScript and third-party widgets, such as comments, social media buttons and so on, and thus improving both user experience and your Google ranking potential.

The problem with JavaScript and widgets is that while they have been making the web more compelling and enjoyable to use, their use has greatly impacted web page loading times, bringing web sites that were previously very fast, down to a crawl.

While this guide is written in a non-technical language and you don't need to be a programmer to understand most of the information shared therein, it certainly won't hurt if you can rely on a competent technical person to assist you in implementing the speed optimization techniques suggested here.

Here is Part 1 (Part 2) of the guide on how to speed up your website page load performance by delaying the load of third-party widgets and JavaScript:

 

How To Speed Up Your Website Page Load Performance by Delaying The Load of JavaScript and Widgets - Part 1

speed_up_your_website_javascript_widgets_id14878321.jpg

On April 9th, 2010 Google announced something that was already rumored about; Page loading speed will become a factor in the site ranking.

From now on, webmasters will have to think through and economize with each element they put into their websites.

The pages heavily loaded with various active elements that slow down the load times and thus increase the blood pressure of their irritated visitors will no longer get away with impunity.

 



How It All Started...

speed_up_your_website_javascript_widgets_000010376631.jpg

Ever since the beginning of the Internet people had this tendency to put all kinds of bells and whistles on their websites. Animated GIFs, sounds and rollover images were visually annoying, but sometimes also a huge factor in slowing down the page load times.

On the other hand, these were not so bad because not too many websites worth visiting were going overboard with these. Most of the websites, especially those with some quality content were still well within the tolerable range.

However, with the arrival of the JavaScript widgets, things started to change. The code clutter that slowed down the page load was no longer appearing only on the amateur websites that one would visit just for the curiosity's sake. Serious, legitimate websites suddenly had a perfectly reasonable widgets on them.

You could have a widget to let your visitors connect with you on Twitter, Facebook, etc. Another widget let your visitors leave a comment to your post using their Facebook or Disqus account thus eliminating the need for any separate registration. This sent spam comments into plummeting like never before because links in the JavaScript comments do not register on Google's spiders and thus are of no value to spammers. Widgets that allow the visitors to share the URL of your post with their friends on various social networks also caught up very fast.

All in all, some of the widgets were perfectly reasonable and legitimate to put on a website because they enriched the user experience. Others were just plain demonstration of force of the kitsch which increased page loading times and made navigation between pages of some websites into a test of patience.

This is when Google came in and announced that it will take page loading speed into consideration when ranking a page.

The game changed. On one hand widgets can be useful, but on the other hand they can seriously slow down your site.

How do you know if your widgets are hurting you? Easy. Just ask Google.

 



How Does Your Website Rank Speed-Wise?

speed_up_your_website_javascript_widgets_speed_meter.jpg

There is a simple way to find out what Google thinks about the current speed of your website.

To get that information you need to set up an account on Google Webmaster Tools. This is where Google tells you exactly what speed it sees on your website and thus what is the speed that it will use to calculate your website rank.

  1. Once inside the Google Webmaster Tools, click on the link with the name of the website and you will be taken to the dashboard.
  2. On the left hand side you will see a link "Labs". Click it and you will see a menu item "Site Performance". This is what you are looking for.
  3. Click it and you will see a page with a graph and a section that says:

    Performance overview

    On average, pages in your site take X.Y seconds to load (updated on [DATE] ). This is slower than XYZ% of sites.

At the moment this article is being written, the data in Google Webmaster Tools doesn't get updated very often. Sometimes it takes 10 days for the numbers to be updated.

However, this is where you can see how fast or slow your pages are in the eyes of Google and how fast you are compared to the other websites. Google doesn't say how slow a site has to be before some points are taken away from the ranking, but obviously, the faster you are the better.

 



Consequences AKA The "Collateral Damage" Question

speed_up_your_website_javascript_widgets_id9973012.jpg

The websites peppered with unnecessary kilobytes of stuff that diminishes user experience will have to re-think what they put into pages.

On the other hand, what happens to the sites with quality content and several reasonable widgets?

Does this new Google approach to rewarding speed mean that all sites with longer pages and in-depth content will be pushed back in favor of short, superficial blog posts?

Apparently not. Faced with this new moment we analyzed our pages at MasterNewMedia and made some conclusions.

  • Length of the text is not a factor in any web page. You need quite a bit of text to make even a single kilobyte. For example, a full text of "Oliver Twist" takes only 914 kB (check it on Project Gutenberg). Any article that can still be called an article is much smaller in size, so article length makes no observable impact on the page load speed.
  • Images and videos can be an issue depending on the website they are coming from. Local images are not so much of an issue.
  • Widgets seem to be the biggest problem. They come from other websites and take the longest time to load. Those from popular sites like Facebook and Disqus are the biggest problems from a loading time perspective.

All things considered, on any given article widgets took more time to load then all the text and images combined and even with all the website interface images on top of them. This gets worse in the hours when the web traffic is at its peak because that is when most people are requesting same widgets on millions of pages.

Most widgets come from only a handful of websites (Facebook being an obvious example), so the widget servers are slowing down. As they slow down, so do all the pages that contain the widgets.

This realization alone doesn't help much. Most websites don't go overboard with the widgets to begin with. They have a select few of them and they are all there to enhance user experience and increase the ability to interact.

So, what can a website do?

Are we all supposed to drop our comment sections and lose the interactivity with the visitors in order to gain those few extra seconds (sometimes considerable number of seconds)?

How about "share" buttons that visitors can use across different social networks?

To enhance user experience with page load speed, widgets would just have to become a collateral damage.

Or perhaps not?




End of Part 1

How To Speed Up Your Website Page Load Performance By Delaying The Load Of JavaScript And Widgets - Part 2




Originally written by Drazen Dobrovodski for MasterNewMedia, and first published on November 9th, 2010 as "How To Speed Up Your Website Page Load Performance By Delaying The Load Of JavaScript And Widgets - Part 1".




Photo credits:
How To Speed Up Your Website Page Load Performance By Delaying The Load Of JavaScript And Widgets - yellow2j
How It All Started... - Kmit Ivan
Consequences AKA the "Collateral Damage" Question - Aliaksei Lakamkin

Drazen Dobrovodski -
 
 
 
Readers' Comments    
blog comments powered by Disqus
 
posted by Daniele Bazzano on Tuesday, November 9 2010, updated on Tuesday, May 5 2015


Search this site for more with 

  •  

     

     

     

     

    16307




     
     




    Curated by


    Publisher

    MasterNewMedia.org
    New media explorer
    Communication designer

     

    POP Newsletter

    Robin Good's Newsletter for Professional Online Publishers  

    Name:
    Email:

     

     
    Real Time Web Analytics