Are HTML elements loaded even if they are not attached to the DOM? What about the backbone view?


If I create an image tag without actually adding it to DOM and add source to it does it still get the image and load it. I mean when I attach it to DOM do I immediately see the image without any delay?

More specifically, I'm working with backbone currently. So if I create a bunch of backbone view's and store them in an array, each holding individual image, do those images render even if I don't attach it to DOM? And when I do attach one those views to DOM. Do I immediately see the images without any delay?

this.$el.append(view.render().el); // where view object was created before and stored in an array

Is this a good prefetching strategy and what about the memory constraints?

Yes, that's a frequent (and not very good) scheme for background image loading : you add the src to an Image element but don't add it to the DOM. The browser loads it just as if it was in the DOM.

When you add the images to the DOM after they have been loaded, they're immediately rendered.