Several methods of lazily loading JS code to speed up web page access

  • 2020-03-26 21:25:28
  • OfStack

This article explains how to delay the loading of javascript code and speed up the access of web pages.

When a website has a lot of js code to load, the location of js code will to some extent affect the loading speed of the image page. In order to make our web page load faster, this article summarizes the following points:
1. Lazily loading js code

 
<script type= " text/javascript "  src= " " id= " my " ></script> 
<script type= " text/javascript " > 
setTimeout( " document.getElementById( ' my').src='include/php100.php';  " ,3000);//Delay 3 seconds
</script> 

This allows more time for the page to load by lazily loading the js code!

2. Js finally loads scheme 1
Where JS needs to be inserted, insert the following code:
The program code
 
<span id= " L4EVER " >LOADING ... </span> 

Sure, that LOADING... You can change it to your favorite small picture. It looks very AJAX.
Insert at the bottom of the page:
The program code
 
<span id= " AD_L4EVER " > your JS Here's the code !</span > 
<script>L4EVER.innerHTML=AD_L4EVER.innerHTML;AD_L4EVER.innerHTML= " ";</script> 

3. Let JS finally load scheme 2
This involves web pages load order problems, such as the introduction of external js script file, if in the HTML head, the page is loaded before the js scripts will be loaded into the page, and in the body, will be in accordance with the page from the top down load order to run javascript code ~ ~ ~ so we can put the js file introduced from outside to the bottom of the page, to let js finally introduced, so as to speed up page loading speed.


Related articles: