Loading Scripts

Stages Stage 1, page loading (blank page)

Stage 2 Document mark up displays the text and image place holders on your page.

Stage 3 Page is fully loaded with images, stylesheets and scripts, etc

Events DOMContentLoaded load document.addEventListener("DOMContentLoaded", start); window.addEventListener("load", start);

Your browser parses your DOM sequentially from the top to the bottom Your browser parses your DOM sequentially from the top to the bottom. Any script elements found along the way will get parsed in the order they appear in the DOM.

Loading Images

var image = new Image(); image. src = “image. png”; image var image = new Image(); image.src = “image.png”; image.onload = function () { // Image has loaded. };

Allow smoother animation window.requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (callback) { window.setTimeout(callback, 1000 / 60); };

JavaScript Objects https://www.w3schools.com/js/js_object_prototypes.asp