How to reduce number of HTTP requests for images

Web Performance Discuss Test Results
1

Hi everyone,

I have an e-commerce website where a majority of my pages have a lot of images. This is increasing my number of HTTP requests and hence taking a huge load time. Is there a way to reduce the requests ? I was thinking on the lines of using a CDN for all the image requests ? will it help

Thanks

2

Hi,
could be a good way loading images from an other domain - because the amount of parallel requests will be higher if you load images from an other domain. CDN esp is better if your users are from different countries.
But if you have “long pages” it could be first an easy way to try “lazy loading”. It is a common use on pages with much images. So first the amount of request is low until the user scrolls down-then the images will load.
I use this jquery plugin : GitHub - dkern/jquery.lazy: A lightweight, fast, feature-rich, powerful and highly configurable delayed content, image and background lazy loading plugin for jQuery & Zepto.
Best is you show here your test-results from webpagetest.org.
because it will shows the “bootlenecks” and best way to get better results.

3

Hi,
Domain sharding has it’s drawbacks since there are additional overhead on the tcp and http connections and would not reduce the number of http requests. SDPY would probably help since your are multiplexing the connections. Instead of reducing the number of http requests, optimizing the images would be a better choice (e.g. transcoding). I agree with kayferdinand in that it would be good to see the WPT results.

4

I had the same problem with our website (cornhole boards). I created my own CDN script that does lossless compression for PNG & JPG’s as well as client side and server side caching. My site now has straight A’s for the report, excluding the CDN because it’s not known.

We use very high quality and large photos and was pushing near 8Mb’s on a page load before optimization. Take a look, www.cornholeboards.us

5

Hi harshpoddar,

As the others have noted, absent test results to be reviewed, most of what you’ll get regarding answers/responses will be conjecture and/or reading-into your post (as none of us are have been provided with actionable particulars).

That said, and to address the specific information provided in your post, reducing the HTTP requests for your site’s images may or may not do anything for your website (it’s relative). The primary reason being that all modern browsers can handle numerous HTTP requests at once and in parallel. So: so long as you have other things in proper order, a lot of images, and therefore HTTP requests derived therefrom, ought not be a problem (and can add to UX [i.e. user experience] – also relative…).

You are certainly on the general right track with the idea of using a CDN for your site’s images (i.e. image HTTP requests); but, it is quite literally never a bad idea to make use of an effective CDN for any of a website’s static resources, which images are.

Lazy loading images is, in our opinion, virtually never a bad idea regardless of where you get your traffic from. But, if the majority of your site’s visitors come by way of high-latency devices (i.e. mobiles, tablets), then lazy-loading is arguably required for a high-quality UX (insofar as website speed equals User Experience.

Best,
AJ
Managing Partner
WpFASTER