Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Using Images to Take Down Your Site Performance

DZone's Guide to

Using Images to Take Down Your Site Performance

More ways to ruin your customer experience with giant, useless images. Free of charge!

· Performance Zone ·
Free Resource

Maintain Application Performance with real-time monitoring and instrumentation for any application. Learn More!

In my last blog, I gave you five simple steps to slow down your site and ruin your customer experience. One of those steps involved images; specifically making them as big and rich as possible, using large megapixel images, and not compressing them. I also mentioned that truly creative people could find additional ways to use images to bring their site to a crawl.

While investigating some issues for an ecommerce website, I discovered just how creative some people can be. In their new ad campaign, the company dropped a 3.5 MB background image on their homepage — and in making sure they inflicted maximum pain on their customers, they requested that background image twice. That’s 7 MB of data to download for just two images. The chart below provides a clear visual of when this campaign was launched and their load speed was brought down with it.

image load speed

I was able to stop the sea of red (and the alert spam) by blocking those images from loading with Catchpoint, but the site’s customers continued to suffer.

In addition to the background image(s), this company also included additional large images.

image download speed

With the homepage originally a whopping 14 MB, it still weighed in at 7 MB without the images even being present.

This ecommerce campaign is a perfect example of how to use images to bring your site speed down to a crawl and your brand reputation to the gutter. If you want to learn how not  to ruin your web performance, take a look at our recent blog post with expert advice on optimizing your objects.

Collect, analyze, and visualize performance data from mobile to mainframe with AutoPilot APM. Learn More!

Topics:
performance ,website design

Published at DZone with permission of

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}