5 häufige Entwicklerfehler, die sich auf die Ladezeiten der Seite auswirken

Ist Ihre Website zu langsam? Dann ist es Zeit, Maßnahmen zu ergreifen, um dieses Problem zu lösen. Auch wenn dies nicht der Fall ist, könnten Sie daran interessiert sein, welche Fehler Entwickler machen, die sich auf die Ladezeiten der Seite auswirken.

Warum ist die Ladezeit der Seite wichtig?

Die Ladezeit der Seite hängt direkt mit der Leistung der Website zusammen.

Wenn das Laden länger als 3 Sekunden dauert, verlieren Sie die Hälfte Ihrer Besucher, bevor sie überhaupt auf Ihre Website gelangen.

• Sichtbarkeit - Google berücksichtigt beim Laden in den Suchergebnissen die Ladezeit der Seite. Daher wirkt sich die Ladezeit einer Site darauf aus, wie leicht Benutzer sie im Internet finden können.

  
  
  
  
  

• Conversion - Je schneller die Seite geladen wird, desto mehr Benutzer interagieren mit der Site. Langsame Websites beenden Conversions. Potenzielle Kunden werden Ihre Website nur ungern nutzen und Handlungsaufforderungen (CTAs) folgen, wenn das Laden Ihrer Webseite lange dauert. Dies führt dazu, dass frustrierte Benutzer die Website verlassen, ohne Ihr Produkt zu kaufen oder Ihre Dienste zu nutzen.

  
  
  
  
  

• Einfache Anwendung - je kürzer die Ladezeit, desto zufriedener wird der Benutzer sein. Infolgedessen wird die Kundenbindung höher sein.

  
  
  
  
  

, , 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 .. , .

, .

, , .