5 common developer mistakes that affect page load times

Is your site too slow? Then it's time to take some action to solve this problem. Even if it isn't, you might be interested to know what mistakes developers make that affect page load times.

Why is page load time important?

Page load time is directly related to site performance.

If it takes more than 3 seconds to load, you will lose half of your visitors before they even get to your site.

• Visibility - Google takes page load time into account when ranking in search results. Hence, site load time affects how easily users can find it on the Internet.

  
  
  
  
  

• Conversion - the faster the page loads, the more users interact with the site. Slow sites kill conversions. Potential customers will be reluctant to use the site and follow calls to action (CTAs) if your web page takes a long time to load. This will lead to frustrated users leaving the site without purchasing your product or using your services.

  
  
  
  
  

• Ease of use - the shorter the loading time, the more satisfied the user will be. As a result, customer retention will be higher.

  
  
  
  
  

, , HubSpot.

• Yahoo 0,4 , 9%.

  
  
  
  
  

• 1 Amazon 1,6 .

  
  
  
  
  

• 2- Bing 4,3% , 3,75% 1,8%.

  
  
  
  
  

, , .

, ,

. , .

1. HTTP-

HTTP- , , . , , Network .

4 8. , .

, Yahoo, , 80% HTTP-. 

, HTTP-:

• CSS / JS - CSS, JS , . CSS , CSS .

  
  
  
  
  

• , - , . . , , , , , .

  
  
  
  
  

• - , . , HTTP- . .

  
  
  
  
  

• HTTP/2 . HTTP/2 , . , .

  
  
  
  
  

2. CDN

- CDN, , . , HTTP- .

CDN .

CDN , -, , . CDN . , .

, , CDN .

CDN TTL .

CDN ?

. , , CDN, .

, CDN , . , .

: Bit (Github).

, , , .

Bit Node, TypeScript, React, Vue, Angular .

3.

- . .

.

- . Gzip. . - Gzip.

, Brotli, .

HTML CSS 50% 70% , .

, , .

4.

HTML, CSS JS , , .

JS .

JavaScript - JS . , - JS-.

HTML, JS- (defer.js) </body>



.

<script type="text/javascript">
 function downloadJSAtOnload() {
   var element = document.createElement("script");
   element.src = "defer.js";
   document.body.appendChild(element);
 }
 if (window.addEventListener)
   window.addEventListener("load", downloadJSAtOnload, false);
 else if (window.attachEvent)
   window.attachEvent("onload", downloadJSAtOnload);
 else window.onload = downloadJSAtOnload;
</script>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

: «, , defer.js».

5.

, . , HTTP-. . Google , , , .

, Screaming Frog, . , .

, :

• -

  
  
  
  
  

• -

  
  
  
  
  

, -.

, ? , , .

- , Google Pagespeed Insights, Pingdom, YSlow .. , .

, .

, , .