PDA

View Full Version : Preloading Large images



maximo
02-07-2007, 02:55 AM
Can someone help me. I need to preload 20+ imgs ranging from 800kb to 3mb
I tried using the following but it still takes for ever to preload:

<SCRIPT LANGUAGE = JAVASCRIPT>
if (document.images)
{
img1 = new Image();
img1.src = "img1.jpg";
}
</script>

can any on give me any ideas

Bob90
02-07-2007, 03:07 AM
Firstly - Is it really necessary?

I mean even with the fastest connections the images you suggest will take around

av. size = 2MBs
av. size in bits = 16Mbs
No. of files = 20
Total download = 320Mbs
download speed = 1Mb/s (Realistically)
Time = 320 seconds or

2 minutes

No-one is going to waste that much time.


Secondly - are All the images necessary?
Is each user going to see all images?

Thirdly - The web is for small images (like it or not), are people actually going to see 2Mb of picture in their browser?

If I have got this wrong please tell me, but the idea is a little far-fetched.

:)

codeexploiter
02-07-2007, 03:43 AM
You can even try some image compression tools that will give more optimized images suitable for web. I wonder what kind of image format you are using for a 3 MB image file.

You can also try splitting a big (3 MB) image into a number of small images so that it won't take much time to load these small images.

As a website owner/developer you can't expect all of users with a T1 connection. If they are using a slow connection then it will take forever to load your images.

Check this article (http://www.webreference.com/dev/graphics/compress.html) that I found in the net which is about image compressing techniques.

jscheuer1
02-07-2007, 06:04 AM
Can someone help me. I need to preload 20+ imgs ranging from 800kb to 3mb
I tried using the following but it still takes for ever to preload:

<SCRIPT LANGUAGE = JAVASCRIPT>
if (document.images)
{
img1 = new Image();
img1.src = "img1.jpg";
}
</script>

can any on give me any ideas

Accckkk!!

In addition to the good advice already put forth in this thread, you should realize that preloading isn't a way to make images load faster. The only thing that can do that is reducing their byte size.

Preloading is a way to load images before they are needed. It is most beneficially used with small images that will later be needed for rollovers. Preloading a huge image will take time, lots of it. So, unless you can do it on another page, it probably will not make the image load any faster. Even if you do it on another page, it will take the same amount of time to preload as it would have taken to load. So, you better make sure that the user will be busy with something else on the preload page, to give the image time to fully load. Partially loaded images from another page will not be resumed so, loading a large image ahead may actually increase its server and bandwidth load.

maximo
02-08-2007, 12:32 AM
The site is for a photographer with a with about 20 pics like I said and more to come. I have the images broken down to thumbnails and when the user clicks on the thumbnail it will display the enitre pic. They high res. pics so I am guessing that is why they are so large. so thanks for the Ideas and the information

jscheuer1
02-08-2007, 04:26 AM
Tell the photographer that if they publish high res versions of their work on the web, they are giving them away. And, tell them that on the web a lower res image can look as good as a high res version. And, tell them that no image needs to be larger than 700x500. Any larger than that won't even fit on many folks screens.

mburt
04-08-2007, 04:06 PM
Preloading images only load the images into the users cache first, it doesn't decrease load time, or file size. Use the suggestions above.