hundreds of images download a little slow

[windandwaves]

Hi Folk

I have a page with about 300 images. All of them are very small (they total about 40Kb).

However, they do seem to take a while to download (Firebox seems to be doing one at the time).

Is there anyway I can speed up this process?

Thank you

- Nicolaas

 

[Roy Schestowitz]

Hi Folk

I have a page with about 300 images. All of them are very small (they
total about 40Kb).

However, they do seem to take a while to download (Firebox seems to be
doing one at the time).

Is there anyway I can speed up this process?

Thank you

- Nicolaas

Enable pipelining.

http://www.theinquirer.net/?article=20453

 

[windandwaves]

Enable pipelining.

http://www.theinquirer.net/?article=20453

--

Thank you Roy, that is allright for the user, by I am the administrator, the person making the site and I can not tell the world to
download FireFox and start pipelining just for my one little silly page.

Is there something you can do on the server, with php or perhaps JavaScript?

 

[Roy Schestowitz]

Thank you Roy, that is allright for the user, by I am the administrator,
the person making the site and I can not tell the world to download
FireFox and start pipelining just for my one little silly page.

Is there something you can do on the server, with php or perhaps
JavaScript?

I realised that you were the administrator, but I thought it was a private
page of yours, e.g. a portal.

What's the URL? Are you sure you can't combine the (/some of the) images to
make larger 'chunks'? If your page contains 300+ elements (essentially hits
too), no wonder it takes a long time to long. Can you imagine the mess this
inflicts upon cache? And the size of the log on the Web server?

Roy

 

[Disco Octopus]

Roy Schestowitz wrote :

Enable pipelining.

http://www.theinquirer.net/?article=20453

wow. i didnt know about the about:config. thats very groovy.

 

[Roy Schestowitz]

Roy Schestowitz wrote :

wow. i didnt know about the about:config. thats very groovy.

....will only boost things under certain circumstances. Sites hate it, we
love it...

*smile*

 

[Richard]

windandwaves wrote:

Enable pipelining.

http://www.theinquirer.net/?article=20453

That's fine for the visitor who may or may not be using firefox.
He's talking about sending the 300+ images to ANY browser FROM the server.

If you'd bother to check out the firefox site, you'd also find a more
detailed thing there about the "about:configure" file.

 

[Richard]

Hi Folk

I have a page with about 300 images. All of them are very small (they
total about 40Kb).

However, they do seem to take a while to download (Firebox seems to be
doing one at the time).

Is there anyway I can speed up this process?

Thank you

- Nicolaas

Might take me all of 2 seconds to load that many at that size.
Why on earth do you have a need for so many damn small images?
The only thing I can think of would be for tracker crap.

Try a preloading routine.

 

[Roy Schestowitz]

That's fine for the visitor who may or may not be using firefox.
He's talking about sending the 300+ images to ANY browser FROM the server.

As already said, I assumed he was administrator creating a hidden page for
personal use.

If you'd bother to check out the firefox site, you'd also find a more
detailed thing there about the "about:configure" file.

I did not know that. Thanks, I'll check it out...

Roy

 

[Roy Schestowitz]

Might take me all of 2 seconds to load that many at that size.
Why on earth do you have a need for so many damn small images?
The only thing I can think of would be for tracker crap.

Try a preloading routine.

I thought about that, but this would only make things graceful, not quicker.

<sacrcasm>
How about this: tar or zip all the files, attach a batch script to the
archive and ask the user to run the script. Might be quicker...
</sacrcasm>

 

[Andy Dingley]

I have a page with about 300 images. All of them are very small (they total about 40Kb).

What's the URL ? How slow is "slow" ?

I'm guessing this is an image gallery with lots of thumbnails. I
wouldn't worry about it. But make sure that caching is allowed for
them (check the HTTP headers that are returned), so that repeated
navigation past this page doesn't have to keep re-loading them.

 

[nice.guy.nige]

While the city slept, windandwaves ([email protected]) feverishly
typed...

Hi Folk

I have a page with about 300 images. All of them are very small
(they total about 40Kb).

That's not what I would call "very small" for a page with lots of images on
it. For my photos, I try to get my thumbnails to about a tenth of that size
maximum, and the larger image (displayed when the user selects a thumbnail
to view) is usually about half that. You have 300 of them on one page.

However, they do seem to take a while to download

Grab a calculator... you are serving 300x40 kilobytes, or about 12 Meg! No
wonder it is taking a while to download! Especially as you are serving this
12 Meg in 300 40k chunks, so there are all those trips to the server too.

Is there anyway I can speed up this process?

Is there any reason to have all those images on one page? It seems rather
excessive. I would say that 300 images on one page (even as thumbnails)
would be too many. Can you not break it down into groups of pictures, so you
only have a few on each page? And maybe set them up as thumbnails so they
will load quicker, and the user can see a larger version if they want to.

Hope that helps.

Cheers,
Nige

 

[Oli Filth]

While the city slept, windandwaves ([email protected]) feverishly
typed... ^
^
!!!


Grab a calculator... you are serving 300x40 kilobytes, or about 12 Meg! No
wonder it is taking a while to download! Especially as you are serving this
12 Meg in 300 40k chunks, so there are all those trips to the server too.

What?! He said the *total* size of the thumbnail files was 40kB.

 

[nice.guy.nige]

While the city slept, Oli Filth ([email protected]) feverishly
typed...

What?! He said the *total* size of the thumbnail files was 40kB.

Okay, okay... I've not had any coffee yet....... ;-)

Cheers,
Nige

 

[Sid Ismail]

On Tue, 22 Feb 2005 14:05:39 GMT, Oli Filth

: nice.guy.nige wrote:
: > While the city slept, windandwaves ([email protected]) feverishly
: > typed...
: >>I have a page with about 300 images. All of them are very small
: >>(they total about 40Kb).
: ^
: ^
: !!!
:
: >>However, they do seem to take a while to download
: >
: > Grab a calculator... you are serving 300x40 kilobytes, or about 12 Meg! No
: > wonder it is taking a while to download! Especially as you are serving this
: > 12 Meg in 300 40k chunks, so there are all those trips to the server too.
:
: What?! He said the *total* size of the thumbnail files was 40kB.


300 images = 40Kb? That I'd like to see.

He probably has it all in a huge table and that slows it down
drastically. URL?

Sid

 

[Richard]

Richard wrote:

I thought about that, but this would only make things graceful, not
quicker.

<sacrcasm>
How about this: tar or zip all the files, attach a batch script to the
archive and ask the user to run the script. Might be quicker...
</sacrcasm>

uh-uh. That would only turn away the visitor.
Besides the host might not like the idea.
What you need is a script that would load the page first, then load the
images.
You do that with <body onload="dothis">.

 

[Nik Coughin]

300 images = 40Kb? That I'd like to see.

He probably has it all in a huge table and that slows it down
drastically. URL?

Sid

It's about 133 bytes each. When I make boxes with rounded corners etc. the
corner pieces are often around that size if I save them as .png. But 300?
The only possible explanation that I can think of is a tile based game or
something similar, because I cannot see any other situation where you would
need this many small images.

 

[Nik Coughin]

^^^^
^^^^

uh-uh. That would only turn away the visitor.
Besides the host might not like the idea.
What you need is a script that would load the page first, then load
the images.
You do that with <body onload="dothis">.

 

[windandwaves]

[..........................]

This message is a follow-up on the earlier posts that I send in the last few days, while I was trying to puzzle together a map. I
have cross-posted this to comp.lang.JavaScript, as I also asked some questions there relating to this map and most of the map is
done in JavaScript (any comments greatly appreciated).

The culprit was Photoshop / image ready. I wanted to make a funky map with "on mouse overs" for about 40 regions. So Photoshop
decided to slice it up..... BIG mistake. Yes, most of the images where only about 100bytes or so (gifs with few colours are indeed
very small).

No, I did not have them in a table that slowed things down. But YES, it was a stupid idea. On my high speed internet connection
(4mb/s) it took about one minute to download, just as long as it took for my friend on a 56k. modem! Interesting. Once, I set my
firefox to multiple pipe (or whatever that is called), it went a lot faster though (thanks for the tip).

Anyway. I have devised a different way now for those 300 images... To see the results, please visit:

http://switch.hosts.net.nz/~admin64/m/map.html

I am pleased with the result, as it is a very interactive map that does not require MacroMedia's Flash, that should be quick to
download (images are only about 25Kb) and that allows for people without JavaScript to just tick the boxes. Also, it is easy to
maintain, as each region has its own small gif and no fancy position is required.

To make those small gifs, I used Photoshop, where I created a map with extra layers for each "onmouseover" image. I then saved each
layer individually as gif with only three colours (dark yellow, light yellow and transparency). I also cropped the image so that it
only went from the NE corner to as far as it needs to go. Then, I got the co-ordinates for the image map from image ready. The
images are named 0 to 40.gif.

If anyone wanted to see the original (with the (almost!) 300 images, then have a look at:

http://switch.hosts.net.nz/~admin64/m/disaster.html

Thank you all for your comments.

-Nicolaas

 

[RobB]

Just a quick note: you should be using 'onclick' rather than
'onmousedown'. To see why, click on a checkbox, and then 'pull off'
while holding down the button. Difference between the raw ''mousedown'"
and the semantic "click".

Also, you might want to loop all those onclick handlers on page load,
otherwise the page may load with boxes checked and no areas
highlighted.

var el, n = 1;
while (el = document.getElementById('r' + n++))
if (null != el.onclick)
el.onclick();

//assuming ids start at 'r1'

Some flickering in IE; might want to control event bubbling.