PDA

View Full Version : Website Load Times vs. Amount of Content



scskimmer
25 Jan 2011, 05:18 PM
Hey there

I'm making that transition from newb to more intermediate levels of html/php/js/css. After creating a couple websites, and failing to turn up happy results from google/webdevforum searches, I have a couple questions. These all pertain to website load times. It's nice to test on your localhost, but I am afraid in the real world websites would never perform nearly as fast, and I have seen some ugliness pop up from websites I have made because I didn't think about testing in regards to low bandwidth.

Is there a way to tell the DOM what NEEDS to be loaded first? Let's say for instance, I have my content that has highest priority followed by a bunch of frivolous pictures. Is there a way to tell the DOM that I want the pictures to have the least precedence? Do I arrange the pictures to be called from a separate php/html file at the very end of the main document? Do I use css, followed by javascript to change the values after the more important things load? I suppose I could use AJAX, but that would be my last resort, as I was looking for a more elegant solution.

Stemming off the previous question, the CSS properties of DISPLAY & VISIBILITY: is the content still loaded when I set these css properties to none & hidden? If I had a huge IMG file that I set to display: none, does the image get loaded when the page loads, or does it get loaded when I change the css value?

Finally, what are some good (FREE!) products that simulate a low bandwidth when you are testing web sites through your browser? I tried Sloppy and was not very happy with it; Firefox Throttle seems to not be implemented anymore. Requirements: Mac os x snowlep, needs to run w/ http://localhost tests for php pages, (am using Dreamweaver cs5, if that helps). If you have one that you swear by that costs a little $, then I guess that's ok. Thanks a lot for the reply/link(s)!!!

resdog
26 Jan 2011, 08:24 AM
DOM loads in a top to bottom order. The only way to "tell" it what to load is to place the higher precedented items at the top and the lower precedents at the bottom. then you can use css to change the position of the lower precedent items.

CSS properties display and visibility do not affect the DOM loading. Everything is loaded, whether or not CSS tells it to display. It's like having an painting and putting a white piece of paper on top of it. All you see if the white paper, but no matter what you do, the painting is still behind the white piece of paper.