File download order for browser
I had asked this question at another forum recently, but no one seemed to have the answer, so will try it here. I think this would be useful information, as the layout of a page is considered:
What dictates the order that files are downloaded when the browser is retrieving a webpage?
Does it always start with text, then go on to graphics? Is it the sequential order that it finds as it goes through the HTML, from top to bottom? Or is it by graphic file creation date? Or file size? Or does it just depend on the pathway that the packets take as they travel from the host server to the desktop?
I have been to many pages with thumbnail galleries, for example, where the images on the 3rd line row start loading before some of those on the first, so I'm wondering if there is a rhyme or reason to it all?
If there is, then it may impact my decision on how to lay out a page. If for example the largest graphics load last, then I might want to put them at the bottom of a page, so the top loads more quickly for the viewer's convenience.
Does anyone familiar with browser technology have any insight?
jammin posted this at 16:08 — 20th November 2002.
They have: 222 posts
Joined: Sep 2002
i beleive it loads the html document first, then any external javascript, then images... but not quite sure... might be different for different types of browsers.
anyone can do any amount of work provided it isnt the work they are supposed to be doing.
Mark Hensler posted this at 17:35 — 20th November 2002.
He has: 4,048 posts
Joined: Aug 2000
HTML is always loaded first. (As the URL for the images resides within the HTML) Whether or not the HTML finishes downloading before the first image is requested or not, I don't know.
The browser cannot descriminate images based on size, creation date, or anything. This is because it won't know any of that information until it has already downloaded the file.
I believe the browser will request files in the order in which they appear in the HTML. (this may happen before the HTML is completely downloaded) Then the images may finish downloading in a different order than requested, like you said, because of the way the TCP packets arrive.
Mark Hensler
If there is no answer on Google, then there is no question.
SW Reynolds posted this at 21:12 — 20th November 2002.
They have: 24 posts
Joined: Dec 2001
It does seem logical that the browser would have to load HTML first, and as jammin said, it would bring in the external js next. If images are in fact retrieved sequentially, then it does make sense (to me at least) to keep the very top of the page as light as possible when planning a page layout, so the viewer quickly gets the sense that something is happening.
What I find confusing are situations where tiled backgrounds (small files) do not display until most of the rest of the page is shown. You would think that a little 5 k file would always be first, especially since it is in the tag. But on occasion, it seems to come in after other larger graphics are in place, which is in part what prompted me to ask the question.
Thanks to both of you for your input...
Busy posted this at 21:17 — 20th November 2002.
He has: 6,151 posts
Joined: May 2001
I believe the images are loaded before the backgrounds are.
But you also have to take in consideration the browser make, the layout of the page (does it have nested tables), included files (css, js, html, txt ...), if all the files are in the same folder as the .html page thats calling them, paths (full or part url) etc etc
troworld posted this at 21:18 — 20th November 2002.
They have: 9 posts
Joined: Nov 2002
It would make sense to ask the manufacturers of a particular browser that question for more precise results.
imaputz posted this at 00:25 — 21st November 2002.
They have: 16 posts
Joined: Nov 2002
I looked into this sometime ago. My access logs show a nice pattern regarding how browsers request files. One item I noticed is that browser XYZ requests files in the same order as browser ABC. It's the protocol where the request order differs (HTTP 1.0 vs HTTP 1.1).
For HTTP 1.1 request order was typically: HTML, CSS, JS, IMAGES
For HTTP 1.0 request order was typically: HTML, JS, CSS, IMAGES
I don't have embedded files like movies or sounds, so I'm not sure what part of the order those would fall into.
The order may differ depending on your server... I'm not sure. Maybe a few others could look through their logs and post results we could have a general consensus.
Mark Hensler posted this at 00:59 — 21st November 2002.
He has: 4,048 posts
Joined: Aug 2000
Apache logs are appended after a connection closes. When I download a large file from my cousin's server (Win2K, Apache 1.3.x), he doesn't see me in the log until after the file download is done.
Mark Hensler
If there is no answer on Google, then there is no question.
SW Reynolds posted this at 01:17 — 21st November 2002.
They have: 24 posts
Joined: Dec 2001
From Busy: "I believe the images are loaded before the backgrounds are."
So if a person wanted the small background to quickly load and therefore be viewable before some of the larger graphics (which may be lower on the page, below the scroll line), would it make sense to use a js pre-load image script just for the background file?
If as imaputz says the js loads early in the process, perhaps that would be one way to maintain a bit of control over the order??
Busy posted this at 04:01 — 21st November 2002.
He has: 6,151 posts
Joined: May 2001
I don't think preload scripts affect the loading order, if anything it probably goes images - backgrounds - preload
File size doesnt seem to matter either.
and if CSS is before images (would have to be) are the css images (backgrounds) faster or slower than HTML backgrounds.
using a 5x5 pixel background image is slower than using a 25x25 image, smaller file size but bigger area it has to cover
I think at the end of the day as long as all the images are small in size it shouldnt really matter.
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.