multiple request for same image

[SocketReve]

Hi,
why you use multiple assign of same resource?
This produce multiple junk http requests.

"$self.attr("src", original);"
" .attr("src", $self.data(settings.data_attribute));"

                $("<img />")
                    .bind("load", function() {
                        var original = $self.data(settings.data_attribute);
                        $self.hide();
                        if ($self.is("img")) {
                            $self.attr("src", original);
                        } else {
                            $self.css("background-image", "url('" + original + "')");
                        }
                        $self[settings.effect](settings.effect_speed);

                        self.loaded = true;

                        /* Remove image from array so it is not looped next time. */
                        var temp = $.grep(elements, function(element) {
                            return !element.loaded;
                        });
                        elements = $(temp);

                        if (settings.load) {
                            var elements_left = elements.length;
                            settings.load.call(self, elements_left, settings);
                        }
                    })
                    .attr("src", $self.data(settings.data_attribute));

Thanks

[tuupola]

URL of the page where this happens? Does the problem exist in the demo page too? What browser are you using?

It first assigns the src to anonymous image element which is not in the dom.This loads the image into cache. After image is loaded into cache plugin changes the src attribute of the lazyloaded image in dom. So unless browser cache is somehow confused second loading should not happen.

[SocketReve]

i'm using latest chrome but the same "bug" is present in safari but not in firefox so i think that maybe is a webkit problem.
not every webserver set "cache control" field on http request.
in my sites i've replaced that piece of code with:
$self.fadeOut('slow',function() {
$self.attr("src", $self.data(settings.data_attribute));
}).fadeIn('slow');
ok, i know that this code no preload image in cache but saving at least some http request ( also if you have image in cache, http requests are made ) and works correctly also in slow and lossy network.

there is another way?

Thanks

[tuupola]

URL of the page where this happens? Does the problem exist in the demo page too?

I do not see this behaviour with latest Safari nor Chrome. There is only one request made according to dev tools and webserver logs.

[SocketReve]

ok, i've tested not in local branch and everything work like a charm. maybe a bug in webkit browsers or some flags in http request for my local php server.
sorry for this issue

[tuupola]

If you ever find out let me know what causes it. You are second person in a short time who first has double requests but then upon testing they are gone.

[tuupola]

@SocketReve check #151. Do you still have the problematic setup somewhere. What kind of response headers the images had?