What exactly is an image sprite? Have a look above to see an example from our left-menu navigation! A sprite is just an image composite from multiple images, designed to speed up the user experience on a website. Amazon, Google, and other top-tier websites use image sprites. It’s completely invisible to you, but you’ll appreciate how snappy the page loads are as a result.
Since very few of us use dial-up internet connections any more, you may be wondering why some web pages load slower than others. You may not realize that every web page you visit can require hundreds of files before rendering properly. Accessing the New York Times for instance actually requires 111 files!
Your internet connection may be fast, but loading 111 individual files means 111 separate requests to the web server, and 111 separate transactions. Typically, you’ll just experience this as a few second delay, but it could be longer. Image sprites cut down on the quantity of these separate transactions by merging images into a composite image. For example, for the navigation image sprite example above, those 24 separate images are now a single request.