How Fast Is… The Windows 8 Launch Website?
Our regular video series How Fast Is…? examines real world websites and details the cause of their performances issues as well as what should be done to solve them. After all, the best way to learn about front-end web performance is to see what other people are doing right and doing wrong. In this edition of How Fast Is…? we analyze Microsoft’s Windows 8 Launch Website.
Why the Windows 8 Site?
Tomorrow Microsoft launches Windows 8. This is easily the most interesting version of Windows to ship in a decade. Microsoft has created a single OS that will run on multiple form factors like tablets or laptops, as well as multiple chip architectures (x86, and ARM). Additionally, Microsoft has combined two radically different interface paradigms into Windows 8: The touch-focused Metro interface, and the classic Desktop interface. Given Microsoft’s position as the dominate PC OS manufacturer, Windows 8 will sell literally hundreds of millions of copies, even if the product is a train wreak. Coupling that fact with all the intense interest these radical changes have stirred up means that the Windows 8 launch website will see traffic levels greater than any other Windows release to date. For these reasons, I thought it would be interesting to see how the site is optimized.
Let’s start out the gate with some good things Microsoft did, especially when compare to Apple, who I analyzed earlier this week. Microsoft is doing a great job with caching. Apple only cached files for 5 minutes, where as Microsoft is caching objects like its images for 1 year. How can they do this? They are using file versioning. Basically, the URL for a resource includes a string that changes when the file changes. This allows you to use far-future unconditional caching, which provides the best performance, while still allowing that you can change the content and ensuring that visitors will not use older, stale content. This is because the URL of the image (or JS file or CSS file) actually changes with either each new build of the website or when the content changes. Since the URL is different for the newer content, browsers will fetch the newer content, even if they have the older content cached.
Microsoft has a very serious performance problem. In fact, fixing this one problem would drastically decrease their bandwidth usage and improve page load speed. The problem is they are using a 1 megabyte 1600 x 491 pixel photograph as a splash image, and it’s a PNG image! This is a huge mistake. PNG is lossless and should not be used for photographic images. Converting this image to a JPEG reduces its size to 140K. That’s a 10x reduction! This image is the single largest resource on the page that gets downloaded. Additionally, Microsoft is using the Application Tier (ASP.NET) instead of the web server (IIS) to serve this image. That means that an
Accept-Ranges header isn’t added, and this image can’t be partially downloaded. If there are any network errors, your browser has to redownload the whole 1 meg image!
The (Mobile) Ugly
To make matters worse, the Windows 8 launch website does not change for mobile devices. It’s not a responsive design, and they aren’t giving you different HTML or image content based on your
User-Agent. This means that when you visit the Windows 8 launch page on your phone, Microsoft is sending that 1 meg image over a crappy cell connection. And remember, the Windows 8 launch website doesn’t support partial downloads so you browser can’t resume downloading the last half of the image if there was an error on that crappy connection. You have to redownload the whole thing!
For a detailed analysis of these issues and more, be sure to watch the video.