How to check progress of pageload?

Question

How can I check the window load progress? I know there is a jquery event for when the page fully loads but I also want to be able to track the percentage of its load progress.

Something like (just pseudocode)

$(window).load_change(function(){
    set_progress_bar(window.load_percentage);
});

and this will get the progress of the page load and change the progress bar accordingly.

Is this possible?

Answer 1

To see how much of the DOM is loaded, you can strategically check for the existence elements on the page. The following post is a good reference for doing so, but simply having an array of the IDs of the elements you want to check and then using setTimeout() to call an update function every 200ms or something should allow you to see what has been loaded and update your progress bar accordingly.

How to check if element exists in the visible DOM?