Geekflare wird von unserem Publikum unterstützt. Wir können Affiliate-Provisionen durch den Kauf von Links auf dieser Website verdienen.
Teilen:

Laden Sie Facebook Like und Share Button schneller

Facebook mag langsam
Invicti Web Application Security Scanner – die einzige Lösung, die eine automatische Verifizierung von Schwachstellen mit Proof-Based Scanning™ bietet.

Wie lade ich die Facebook-Button asynchron?

Fast jedes Blog, eine Website hat einen Facebook-Like-, Share- oder Follow-Button.

Wie Sie vielleicht wissen, wird der Standardcode für die soziale Freigabe von Facebook synchron mit Ihren Webseitenressourcen geladen.

Dies erhöht Ihre Ladezeit der Website und Schaden SEO Score. Es ist nicht nur SEO, sondern beeinträchtigt auch die Benutzererfahrung.

Ich bin mir sicher, dass der Facebook-Social-Share-Button wichtig ist, aber nicht als tatsächlicher Code, der zuerst angezeigt wird. Es gibt viele Blogs oder Websites, die aufgrund des Standard-Facebook-Codes eine höhere Ladezeit für Seiten haben.

Die asynchrone Verwendung von Facebook-Code hilft Ihnen beim Laden Ihrer Webseite 0.5 - 1.5 Sekunden schneller. Dies ist, was Sie Facebook wie laden, teilen oder Schaltfläche schneller folgen müssen.

Hier ist der Code, von dem ich bekommen habe Facebook-Entwickler für Like und Share auf geekflare.com

<div id="fb-root"></div>
<script>(function(d, s, id) {    
var js, fjs = d.getElementsByTagName(s)[0];    
if (d.getElementById(id)) return;    
js = d.createElement(s); js.id = id;    
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=xxxxxxxxxx&version=v2.0";    
fjs.parentNode.insertBefore(js, fjs);  
}(document, 'script', 'facebook-jssdk'));</script>

Jetzt muss ich nur noch der einzelnen Zeile in meinem Code folgen, um die Schaltflächen schneller zu laden.

js.async=true;

Der geänderte Code wäre also:

<div id="fb-root"></div>
<script>(function(d, s, id) {    
var js, fjs = d.getElementsByTagName(s)[0];    
if (d.getElementById(id)) return;    
js = d.createElement(s); js.id = id;  
js.async=true;    
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=xxxxxxxxxx&version=v2.0";    
fjs.parentNode.insertBefore(js, fjs);  
}(document, 'script', 'facebook-jssdk'));</script>

Ist es nicht einfach

Aktualisierung: Die neuen Code-Schnipsel, die von Facebook angeboten werden, sind oben nicht erforderlich script async schon kannst du unten sehen.

<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v7.0" nonce="JekfmCeX"></script>

Verwenden Sie WordPress? Zur kasse diese posHier erfahren Sie, wie Sie die Leistung ohne Plugin optimieren können. Und wenn Sie nach einem Social-Media-Plugin suchen, das nicht langsamer wird, kann ich es nur empfehlen novashare.

Ich bin sicher, dass Ihre Webseite schneller geladen werden soll, und ich hoffe, dies hilft Ihnen.

Danke an unsere Sponsoren
Weitere großartige Lektüre zum Thema Entwicklung
Treiben Sie Ihr Geschäft an
Einige der Tools und Dienste, die Ihr Unternehmen beim Wachstum unterstützen.
  • Invicti verwendet das Proof-Based Scanning™, um die identifizierten Schwachstellen automatisch zu verifizieren und innerhalb weniger Stunden umsetzbare Ergebnisse zu generieren.
    Versuchen Sie es mit Invicti
  • Web-Scraping, Wohn-Proxy, Proxy-Manager, Web-Unlocker, Suchmaschinen-Crawler und alles, was Sie zum Sammeln von Webdaten benötigen.
    Versuchen Sie es mit Brightdata
  • Semrush ist eine All-in-One-Lösung für digitales Marketing mit mehr als 50 Tools in den Bereichen SEO, Social Media und Content-Marketing.
    Versuchen Sie es mit Semrush
  • Intruder ist ein Online-Schwachstellenscanner, der Cyber-Sicherheitslücken in Ihrer Infrastruktur findet, um kostspielige Datenschutzverletzungen zu vermeiden.
    MIT DER INTELLIGENTEN SCHADENKALKULATION VON Intruder