Tuesday, March 3, 2009


Article From Codeproject

This article is about an httpmodule designed to create one image out of many for faster loading and fewer web server HTTP requests. Module creates auto generated CSS image maps of positions for displaying on a webpage using background positioning. The module also handles creating mouse over image effects. This module was designed to run with ASP.NET websites and uses the web.config to control the image and CSS directories. It can also append to existing CSS files instead of creating new ones to keep old webpage CSS intact.

The general purpose to implement this code is to increase web server response time by removing multiple image HTTP requests. When clients access your website through their browser, they request all of the images for your webpages one by one. If you have many images like I do, this can create a giant workload for your web server to serve up. So to resolve this issue, why can't we just create one image out of many with CSS mappings to the position within the image file. By doing this, your server then only receives one request for all your images, which it can handle efficiently fast. The other benefits of oneimage are listed below:

  1. Less chance of corrupt file transmission
  2. Faster image downloads because it's all in one file
  3. Enable caching for one image to keep it in memory
  4. Less HTTP Requests and Responses
  5. Keeps people from using your images directly on their sites
  6. Makes image rollovers simple
  7. Turns GIF formats into PNG, to not be binded by GIF copyrights

Read More

No comments: