Lazy Load, 3 Ways to Lazy Load Using YUI

In these examples, all three methods of lazy loading we've discussed are being used. When the hello world class has been loaded, the backgrounds of the test cases will turn green. Simply reload the browser to reset the tests.

Proximity: By putting a bounding box around the button (you could use any relevant container element really), we can use an onMouseOver to start loading before the user gets to the button.

Timeout Load: After a certain amount of time, a lazy load can also occur. Use the button below to start a 3 second timer, which you would normally attach to onDOMReady or window.onload.

Click to Load: This is our example from before, by clicking, we will lazy load our JS file