Faster Page Loads With Image Concatenation
Written by on April 26th, 2007 in Ajax News.
Matthew Batchelder has been looking at the impact of latency on web applications with respect to downloading lots of images as icons, based on thoughts he heard from Zimbra when they presented at The Ajax Experience.
His piece on Faster Page Loads With Image Concatenation goes into why and how:
For complex web apps, the quantity and resulting latency of icons and images used can greatly impact page load times…and developers, in most cases, generally try to reduce page load time with a sweet web app rather than increase it.
To reduce latency in my apps, I use Image Concatenation! Coupled with a bit of CSS magic, performance improves and life is great.
He also discusses using CSS to handle inactive icons (instead of duplicate images):
-
-
#sidebar img.icon{
-
filter:alpha(opacity=50);
-
-moz-opacity: 0.5;
-
opacity: 0.5;
-
}
-
-
#sidebar img.icon:hover{
-
filter:alpha(opacity=100);
-
-moz-opacity:1.0;
-
opacity:1.0;
-
}
-
Source: Ajaxian
Original Article: http://ajaxian.com/archives/faster-page-loads-with-image-concatenation