JavaScript Loading Strategies: Lazy Loading

In our second tutorial on JavaScript loading patterns we cover lazy loading. Lazy loading allows you to load a minimal amount of JavaScript to begin with and then load the rest in the background. This provides a faster page load.

Would you like to help keep this channel going?

For more resources on JavaScript:

Full personalized courses on JavaScript:

Tutorials referred to in this video:

#javascript #AllThingsJavaScriptLLC

[logixindie]

Never seen that ide background color before! Pretty cool

[johnaweiss]

Hardcoding .js filenames in your function is bad form. Those deferred js files should be listed somewhere (by convention, in the HTML file). If your list of .js files changes, you should be changing the list somewhere outside of any js function. Then, call your LoadJS function on that list.

Another option (which i prefer) is to simply load ALL .js files in a given directory (eg "/Deferred JS/"). Then, instead of having to edit some list every time you switch out your js files, all you have to do is... switch out your js files.

[sumantkanala]

Awesome! great and easy way to lazy load script files

[mobilegameplay]

thanks for taking 8.04 valuable minutes from my life.

[ravikiranpatel]

Hi All Things JavaScript,

I have a question

i am in form and i am in 8th scroll place and if i save the form or load the form, the mouse cursor is going to top of the form or 1st scroll... i want to keep the mouse cursor in 8th scroll place only ... so how to do it? can you please help me

[keithcarrillo]

Hey, was wondering in this tutorial is lazy loading being used by refreshing the page? How did the page know that appNext needed to be loaded. It kind of seem as though you refreshed the page and the script was simply read and would do the same with or without DomContentLoaded? Thanks for the videos though! Cheers.