StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>If the problem you are trying to solve is to load images in your page that have the <code>grid</code> class faster, then there is no way to do that. To find the images in your page that have the <code>grid</code> class, you'd have to wait for the DOM to load and then search the DOM to find those images. At the point you are doing that, the browser is already working to load them. Nothing you can do in Javascript at that point can make the image load go any faster. The browser is already loading them.</p> <p>The only thing I know that you could do is to make an array of the URLs that you want to load and you can preload those in the very first part of your javascript (script in the <code>head</code> tag) and this "might" get the images loading a little faster. But, in order to do this, you'd have to manually list out the images you want to apply this to. You can't wait for the page to load and look for them in the page because, by then, they're already being loaded as fast as they can be. If you control the server-side code, you could generate this list of images server-side and put that array into the JS. If you did that, it would look something like this:</p> <pre><code><head> <script type="text/javascript"> var preloadURLs = [ "http://photos.smugmug.com/photos/344291068_HdnTo-Ti.jpg", "http://photos.smugmug.com/photos/344290837_ypsKL-Ti.jpg" ]; var preloadImgs = [], img; for (var i = 0; i < preloadURLs.length; i++) { img = new Image(); img.src = preloadURLs[i]; preloadImgs.push(img); } </script> </head> </code></pre> <p>In most browsers, this should serve to somewhat give priority to the loading of these images since their requests would be launched first before the page starts to load.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload