ansaurus

Question

Answer 1

+1 A:

You're getting 304 Not Modified HTTP responses because the server detected that your browser still has the images in the client-side cache, so the server instructed your browser to retrieve those images from that cache. If it were a 200 OK, that means the server sent the images over the network, which is not the case as shown in your Firebug Net tab.

stillstanding 2010-09-05 14:13:57

Yes, but there are many requests already, usually it should request an element on the page only once.

aularon 2010-09-05 14:19:05

Then you are saying , this image not loading from server location

Bharanikumar 2010-09-05 14:22:12

304 Not Modified HTTP responses GOOD OR BAD...

Bharanikumar 2010-09-05 14:25:09

304 Not Modified is good, because it means it doesn't got loaded again, instead it will be loaded from cache

jigfox 2010-09-05 14:29:57

The server just sends a 304 Not Modified header. No data is being transferred from server to your browser, which is a good thing because that's only a few bytes compared to several that an actual image being transferred consumes bandwidth-wise.

stillstanding 2010-09-05 14:33:10

@jigfox but it means that a request took place, a typical request is about 0.3 KB request headers and 0.3 KB response headers, while those GIF images (response body) are 0.3 KB. So no, a 3,000 `304 Not Modified` requests/responses are not okay.

aularon 2010-09-05 14:36:46

You'd have to check if 3000+ requests were actually made. I rather doubt it, especially when an object is used multiple times on a page. There's no point in doing "was this changed? how about now? now? now?". The cacheing layer will check ONCE for each page, and then just send the same response headers farther up the chain. So it looks like 3000+ 304's came in, but only one request was made.

Marc B 2010-09-05 15:02:32

A Web server will not respond with a 304 Not Modified header if the browser did not send an If-Modified-Since field in the HTTP request. The server will not issue a 304 whimsically.

stillstanding 2010-09-05 15:09:23

Answer 2

+1 A:

In your code don't do <img src..> but rather use a div with a css class that uses the image as a background image for the div. It would probably help quite a bit.

<style>
.editimage {width:20px; height: 20px; background-image:/path/to/image.gif}
</style>
...
<div class="editimage">&nbsp;</div>

Nir Levy 2010-09-05 14:50:05

Bad that's a bad practice when it comes to accessibility, it's not a styling image, but a button on the page with action to do, it should be `<img src="/path/to/img.gif" alt="Edit" />`.

aularon 2010-09-05 14:58:51

@aularon In this case, an image does not offer any content. It would be bad practice to use an image tag for something that does not add anything more than text would. A better idea would be to use an input button or an anchor tag with the image applied using CSS.

Dan Herbert 2010-09-05 22:14:09

I mean the image would be put inside an `<a>` tag, the `<a>` tag will provide the functionality. Besides, using a css supplied image with no text is bad when talking about accessibility.

aularon 2010-09-06 00:10:10

@aularon: They guy asked a simple question so I gave a simple answer. A page with 3000 list items is a bad idea (even without accessibility concerns) but life is hard and I am sure this guy has his limitations.. A css bg image is a dirty trick, I agree, but given the situation it might help.

Nir Levy 2010-09-06 08:20:33

@Nir It's okay, I just wanted to point that out so he knows that doing this has those cons besides the pros you mentioned

aularon 2010-09-06 09:26:00

ansaurus

tags:

views:

answers:

How to load image once

related questions