Debunking Responsive CSS Performance Myths
Responsive design is our best answer today to the explosion and the variety of the different screen sizes on which online content is consumed: smartphone resolutions vary widely, landscape and touch orientations, different pixel densities, and so forth. CSS3 media queries allow the browser to alter the presentation of the page based on all of the above attributes and more without making us modify the underlying HTML of the page – nice win.
However, when it comes to performance, we still have a lot of kinks to work out with responsive design. For one, while we can optimize the presentation on the client, most of the sites do not optimize the actual assets: you may be viewing a mobile version of the site, but you are likely downloading the same desktop assets. Not a great story for mobile.
An excerpt from Debunking Responsive CSS Performance Myths
