A study conducted by server-side responsive design tech firm Trilibis has highlighted failings in the performance of many top responsive design websites in terms of their load times on mobile devices.

Trilibis analysed the performance of 155 responsive sites. Of these, only 21 per cent loaded in less than four seconds on a smartphone. 32 per cent of the sites required between eight and 48 seconds to load.

Trilibis investigated the reason for this sluggish performance and found that image size was the primary cause. By analyzing page composition, Trilibis determined that the mean homepage weight of the sites in the sample was 1.7MB, with a median weight of 1.2MB. Notably, this figure was considerably heavier than the 420KB average page weight of the top 30 retailers tracked on the Keynote Mobile Commerce Performance Index.

While a number of factors contribute to overall weight of a web page, image size ranks highest. This is particularly true for responsive websites, which are often graphically complex and are designed to deliver an excellent visual experience on all devices. For desktop computers with high-bandwidth connections and abundant local resources, page weight is not a major concern. But for mobile devices, the exact opposite is true.

When Trilibis examined the relationship between image weight and overall page weight of the sites in the sample, it found that images constituted more than 50 per cent of overall page weight for 107 websites (69 per cent of the sample). The company found that, on average, images were 50–60 per cent of the page weight for these sites, and that load time was unacceptable when overall page weight exceeded 1MB. In fact, 61 per cent of the responsive websites in this sample served a home page of at least 1MB in size.

As part of the survey, Trilibis examined whether server-side processing could lower overall page weight and improve performance on mobile devices. It selected the 64 most image-heavy websites and performed simple image optimization to reduce images to a size that would ensure excellent rendition of the website on a wide range of desktop and mobile devices.

Before server-side optimization, the total image weight of all 64 responsive websites was 115MB. After optimization, the page weight was down to 50MB for desktop browsers, 30MB for tablets, and 27MB for smartphones. The mean page weight of the 64 websites was 1.8MB; optimization reduced this to 780KB (desktop), 470KB (tablet) and 420KB (phone). To measure the reduction in load time, Trilibis applied these optimization techniques to three sites in the sample – Boldandnoble.com, Engadget.com and Starbucks.com – and recorded site-load time reductions of “several seconds”.