Welcome!

Web Performance is a Journey, Not a Destination

Mehdi Daoudi

Subscribe to Mehdi Daoudi: eMailAlertsEmail Alerts
Get Mehdi Daoudi via: homepageHomepage mobileMobile rssRSS facebookFacebook twitterTwitter linkedinLinkedIn


Blog Feed Post

Vox Media: One Year from Performance Bankruptcy

Exactly one year ago, Vox Media declared “Performance bankruptcy”, realizing their sites were “friggin’ slow”. They were way behind most of their competitors.

Vox promised an overhaul on all of their performance debts. They set out to reduce their render start times by 58% and their page complete times by 65%.

Goals:

Render Start Times: From 4.85s to 2s

Document Complete: From 23.33s to 8s

It’s been a fascinating learning experience for performance engineers, tracking the progress Vox has been making, chipping away each second from their load times.

Performance update #2: Electric Boogaloo

Performance Update #3: Line Rider Edition

Now, 365 days later, we’re analyzing Vox Media’s “The Verge” and “Vox” sites to see if they are holding up their end of the promise and we also see how they are doing against the competition.

The Analysis:

They achieved an incredible response time (time taken to download the HTML), clocking in at 106ms and 114ms for Vox and The Verge respectively. A notable 13% improvement since February 2016, and an incredible 80% improvement from February 2015 topping the charts amongst their peers. (Find bottom of blog for competitive analysis)

 

Vox Media web performance optimization

Response Time: check.

The Performance Team has the render start metric nailed down. The Verge clocking in at 880ms and Vox at a 1023ms. This is 50% improvement over their set target, and 79% improvement from one year ago.

A part of this could be attributed to having a fewer number of critical resources. Following web performance best practices of loading the stylesheets at the top and loading non-critical scripts asynchronously.

 

Vox performance improvements

Render Start: check.

Clocking in document complete (also known as webpage load) at 4829ms and 6089ms for The Verge and Vox respectively, the Performance Engineers at Vox Media have achieved an astonishing 79% improvement from a year ago; bettering their target by almost 40% for The Verge.

 

Vox Media performance optimization

Document Complete: check.

A snapshot of the amazing turnaround:

Vox performance metrics

Contributing to these incredible changes have been several significant tweaks:

Contributing to these incredible changes have been several significant tweaks,

        1. The usage of WebP type for large images. (Apart from the other very specific image optimizations mentioned in their blog)
        2. Trimming the critical rendering path for faster render start times.
        3. Following Web Performance best practices of loading critical stylesheets right after the html download and asynchronously requesting other scripts.
        4. Using CDNs for serving most of their static content through sharded domains (vox-cdn.com).

Having said that, there’s still much room for improvements including:

          1. Over half of the contents loaded before render start are 3rd party contents. Impact of 3rd party services has been documented substantially.
          2. Certain campaigns using un-optimized images, some almost 1Mb in size.
          3. Loading of resource intensive gifs before Document Complete.

The Competition

While Vox Media has been chiseling away at their numbers, so have their competitors. In spite of Vox Media’s heroic improvement, they are still playing catch up (except for response times).

Below are the comparison charts for some important metrics.

Vox competitor benchmark

Vox Media, The Verge, Tech Crunch, Mashable

Having said that, the performance engineers at Vox have done an incredible job in making up ground and getting in striking distance for the top spot in web performance.

The post Vox Media: One Year from Performance Bankruptcy appeared first on Catchpoint's Blog.

Read the original blog entry...

More Stories By Mehdi Daoudi

Catchpoint radically transforms the way businesses manage, monitor, and test the performance of online applications. Truly understand and improve user experience with clear visibility into complex, distributed online systems.

Founded in 2008 by four DoubleClick / Google executives with a passion for speed, reliability and overall better online experiences, Catchpoint has now become the most innovative provider of web performance testing and monitoring solutions. We are a team with expertise in designing, building, operating, scaling and monitoring highly transactional Internet services used by thousands of companies and impacting the experience of millions of users. Catchpoint is funded by top-tier venture capital firm, Battery Ventures, which has invested in category leaders such as Akamai, Omniture (Adobe Systems), Optimizely, Tealium, BazaarVoice, Marketo and many more.