Explaining How HTML5 Made Windows Live SkyDrive Faster For Millions of Users

Microsoft hopes you've had a chance to try the new version of HTML5-powered Windows Live SkyDrive that shipped a few weeks ago. You probably noticed that the performance of the Web experience has been dramatically improved and redesigned for simplicity. In a blog post on Thrusday July 14 on the Inside Windows Live, Windows Live […]

Microsoft hopes you've had a chance to try the new version of HTML5-powered Windows Live SkyDrive that shipped a few weeks ago. You probably noticed that the performance of the Web experience has been dramatically improved and redesigned for simplicity. In a blog post on Thrusday July 14 on the Inside Windows Live, Windows Live Development Manager Steven Bailey covers a few of the things explaining how the windows live team used HTML5 to make SkyDrive fast for millions of people?

"Our overall goal in the new SkyDrive architecture is to use HTML5 and modern browser capabilities to reduce or eliminate page loads and make each click feel nearly instant," stated Bailey.

"The old version of SkyDrive was based on a server-rendered architecture, which meant that every time you clicked on something in a SkyDrive web page, SkyDrive would essentially do a complete server-generated page load. A page load is a very slow process which generally takes many seconds to complete due to the lack of client-side caching and numerous client-server round-trips. This meant that every user action would take at least a few seconds, which was clearly not ideal. This was a "least common denominator" approach that catered to people with old browsers."

"As our tens of millions of users upgrade to modern browsers, we can take advantage of new capabilities and move to an intelligent AJAX architecture. The key to making AJAX performance great has to do with intelligent client network utilization since the client network is usually the biggest bottleneck to performance," explained Bailey.

We focused on four distinct things related to intelligent client network utilization:

  1. Reduce the number of client-server requests (client-side caching).
  2. Reduce the payload size of each request (get only what you need and compact protocol).
  3. Reduce the number of "miles" a request has to travel (put servers/Content Delivery Networks close to users).
  4. Make the most out of each request (utilize batching and pre-fetching).

For detailed information, read Buley's post here.