Responsive Performance Benchmark Comparison
published on
Over the last year responsive web design has been going strong, many new ideas and tools have been popping up and there were (and still are) many lessons to be learned.
One of the big challenges with responsive design lies within its performance. At SmashingConf in September 2012, Brad Frost mentioned the term "Performance is Design" in his talk and it made total sense. Now, he sparked this conversation anew, with his recent article Performance as Design. There's also a very good follow up article on this topic by Tim Kadlec: Setting a Performance Budget.
Previously there have been articles about Performance Implications, Bad news for site owners and mobile users and Trends. But from a short discussion on Twitter it seems that there were no numbers on average pagesize and load times of responsive sites available.
anyone remember a study that found average size of a RWD was 2MB+ .. link?
— Luke Wroblewski (@lukew) <a href="https://twitter.com/lukew/status/296003059010650113">January 28, 2013</a>
Kurt Elster (@kurtinc) took the initiative and started creating a list of responsive sites and their sizes. I contributed to that list and now we do have some numbers for 34(+4) responsive websites, which at least gives somewhat of an indication on the size trend.
Interesting is that numbers sometimes vary quite a bit between the used test tools in which cases Web Inspector or YSlow show much larger numbers than Pingdom. Also might the load times differ depending on location etc. We haven't tested these sites with Webpagetest, but it seems that these results would also differ slightly.
The results from the findings in short:
Average Requests:
| Pingdom |
|---|
| Chrome Web Inspector |
| YSlow |
Average Size:
| Pingdom |
|---|
| Chrome Web Inspector |
| YSlow |
Average Loadtime:
| Pingdom |
|---|
| Chrome Web Inspector |
| YSlow |
See the complete Responsive Performance Benchmark Comparison on Google Docs
Better Performance for Today's Web
It's nothing new that responsive websites tend to be quite heavy. Considering the rise of mobile, sites should actually be smaller and faster again…
If you're working in a web project, devote the same amount of attention to your site's performance as you would to its clear structure, visual appearance or quality of code. Because Performance is Design. And it does matter.