• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

preloading of images and the cache

 
Ranch Hand
Posts: 106
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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.
 
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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
Posts: 106
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
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
Posts: 106
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

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!
 
Sheriff
Posts: 67746
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

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 ]
 
What's brown and sticky? ... a stick. Or a tiny ad.
a bit of art, as a gift, the permaculture playing cards
https://gardener-gift.com
reply
    Bookmark Topic Watch Topic
  • New Topic