aspose file tools*
The moose likes HTML, CSS and JavaScript and the fly likes preloading of images and the cache Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "preloading of images and the cache" Watch "preloading of images and the cache" New topic
Author

preloading of images and the cache

christine clarin
Ranch Hand

Joined: Feb 05, 2005
Posts: 106
hello! i hope you can help me with this:

i am getting confused with the concept of preloading images and caching.you see, i'm building a site which is like google images where in all images in the database are shown in thumbnails within a page.now, i am looking for ways to make the loading of these images faster since the number of the images are getting bigger. when i searched thru the net, i was advised to use preloading of images via javascript which says that i am saving these images within the cache of my local machine. what confuses me though is that even if i don't have this preloading javascript code in my application, firefox and IE still saves my images in their cache automatically. so why do i still have to preload? and why are my images loading slowly even though the images are already in the cache... help! please! thanks. by the way, here are some snippets of my codes:

this is how i show the thumbnails of the image (i just resize, is this adviseable, or is there any other way?):

<td> <img src = "<%=x.getImagePath() %>" height="100" width="100" name = "img" id="img" />

this is the code i got for preloading:

var myPic = new Image(100,100);
myPic.src = "<%= x.getImagePath() %>"

is this correct? thanks! any help would be greatly appreciated.
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
The idea about preloading is you load them before you need them. You do not do both at the same time. So you load 5 images and you also preload the next 5 images.

Eric
christine clarin
Ranch Hand

Joined: Feb 05, 2005
Posts: 106
i'm still not quite sure if i understand correctly, so in my case, will preloading be needed to load my thumbnail images faster? or is the caching by the browser ok? do you have any advice on how i can load the images faster?
Eric Pascarello
author
Rancher

Joined: Nov 08, 2001
Posts: 15376
    
    6
Prloading images means it will load things BEFORE they are needed. Say you had 5 pages of images. You can start to load the second page while the user is looking at the first page.

IE is limited to 2 connections to the same domain so that is why it takes awhile to load the images. Look how big the files are, did you actually make smaller images or did you just change the height and width in the HTML markup?

Also the type of image file matters. Make sure you are not using some format that has a huge file sie.

If you look at sites hat display a lot of images, they use sub domains to display them. Why? Because IE sees sub domains as seperate domains and allows for more connections.

< img src="http://foo1.yourdomain.com/images/im1.jpg" />
< img src="http://foo1.yourdomain.com/images/im2.jpg" />
< img src="http://foo2.yourdomain.com/images/im3.jpg" />
< img src="http://foo2.yourdomain.com/images/im4.jpg" />

Eroc
christine clarin
Ranch Hand

Joined: Feb 05, 2005
Posts: 106
Originally posted by Eric Pascarello:


IE is limited to 2 connections to the same domain so that is why it takes awhile to load the images. Look how big the files are, did you actually make smaller images or did you just change the height and width in the HTML markup?



-- as for the thumbnails, i just resized it via HTML. is there any other way of doing this? thanks!
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 61437
    
  67

Originally posted by christine clarin:
-- as for the thumbnails, i just resized it via HTML. is there any other way of doing this

That's not going to do anything for you. All you are doing is send the full-sized images to the browser and telling it to show them in a smaller size.

If you want to send smaller files, create smaller files.
[ December 15, 2007: Message edited by: Bear Bibeault ]

[Asking smart questions] [Bear's FrontMan] [About Bear] [Books by Bear]
 
It is sorta covered in the JavaRanch Style Guide.
 
subject: preloading of images and the cache