{"id":241377,"date":"2022-04-07T12:48:00","date_gmt":"2022-04-07T09:48:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=241377"},"modified":"2022-05-16T11:31:50","modified_gmt":"2022-05-16T08:31:50","slug":"so-verschieben-sie-javascript-mit-wordpress-fuer-schnellere-ladezeiten","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/de\/so-verschieben-sie-javascript-mit-wordpress-fuer-schnellere-ladezeiten\/","title":{"rendered":"So verschieben Sie Javascript mit WordPress f\u00fcr schnellere Ladezeiten"},"content":{"rendered":"

M\u00f6chten Sie Javascript auf Ihrer Website zur\u00fcckstellen?<\/p>\n

Wenn Sie selbst kein Entwickler sind, kann dies wie eine un\u00fcberwindbare Aufgabe erscheinen.<\/p>\n

Javascript aufzuschieben ist nicht schwer, wenn Sie die Site von Grund auf neu erstellt haben, aber mit WordPress haben Sie wahrscheinlich ein Theme und 6-10 Plugins, die alle ihre eigenen Javascript-Dateien laden.<\/p>\n

Es w\u00fcrde ewig dauern, die "Hooks" zu finden, die Sie \u00e4ndern m\u00fcssen, um zu \u00e4ndern, wie jede JS-Datei geladen wird!<\/p>\n

Zum Gl\u00fcck gibt es einen viel einfacheren Weg.<\/p>\n

Alles, was Sie brauchen, ist das richtige Werkzeug.<\/p>\n

Warum Sie JS-Dateien zur\u00fcckstellen sollten<\/h2>\n

Stellen wir sicher, dass wir auf der gleichen Seite sind.<\/p>\n

Browser laden normalerweise Javascript-Dateien, bevor sie versuchen, Ihre Website zu rendern. Das bedeutet, dass Besucher Ihre Website erst sehen k\u00f6nnen, wenn alle Javascript- (und CSS-)Dateien vollst\u00e4ndig geladen sind.<\/p>\n

Wenn Sie eine Javascript-Datei zur\u00fcckstellen, kann das HTML-Dokument geladen werden, bevor das Laden der Javascript-Datei abgeschlossen ist. Die JS-Datei wird m\u00f6glicherweise gleichzeitig geladen, wird jedoch erst ausgef\u00fchrt, wenn das HTML-Dokument vollst\u00e4ndig geladen ist.<\/p>\n

Mit anderen Worten, wenn Sie Ihre Javascript-Dateien zur\u00fcckstellen, wird das HTML-Dokument fr\u00fcher geladen, was bedeutet, dass Ihre Site fr\u00fcher sichtbar ist. Dadurch wird Ihre Website den Besuchern schneller angezeigt, was letztendlich am wichtigsten ist.<\/p>\n

Kommen wir nun zu der unglaublich einfachen Methode, um Javascript auf Ihrer Website zu verschieben.<\/p>\n

So verschieben Sie Javascript-Dateien<\/h2>\n

Anstatt zu versuchen, Skripte manuell zu finden und zu verschieben, k\u00f6nnen Sie ein Plugin verwenden, um dies automatisch f\u00fcr Sie zu erledigen.<\/p>\n

Es gibt zwei verschiedene Methoden, die ich empfehle.<\/p>\n

Aufschieben mit asynchronem Javascript<\/h3>\n

Da<\/a> ist zun\u00e4chst das kostenlose und einfach zu bedienende Async<\/a> – JavaScript-<\/a> Plugin.<\/p>\n

\"So<\/a><\/p>\n

Einfaches und beliebtes Async-JavaScript ist eine solide Wahl zum Zur\u00fcckstellen von JS-Skripten.<\/p>\n

Wenn Sie dieses Leistungs-Plug-in installieren, wird Ihrer Website das folgende neue Einstellungsmen\u00fc hinzugef\u00fcgt:<\/p>\n

\"So<\/a><\/p>\n

Wenn Sie die Dinge schnell zum Laufen bringen m\u00f6chten, k\u00f6nnen Sie mit einer dieser Einstellungen alle Ihre Javascript-Dateien auf einmal asynchronisieren oder zur\u00fcckstellen:<\/p>\n

\"So<\/a><\/p>\n

Sie k\u00f6nnen die Methode zum verz\u00f6gerten Laden auf alle Dateien anwenden, den Cache leeren und dann Ihre Site sorgf\u00e4ltig testen. Es besteht die M\u00f6glichkeit, dass einige Funktionen Ihrer Website besch\u00e4digt werden, z. B. das mobile Men\u00fc oder die interaktiven Suchleisten.<\/p>\n

Wenn Sie feststellen, dass Funktionen auf Ihrer Website nicht mehr funktionieren, wechseln Sie zu einer der Versionen, die jQuery ausschlie\u00dfen, und h\u00f6chstwahrscheinlich werden dadurch alle Probleme behoben.<\/p>\n

Andernfalls k\u00f6nnen Sie Skripts manuell zu async hinzuf\u00fcgen oder zur\u00fcckstellen, sodass Sie jeweils eine Datei sorgf\u00e4ltig testen k\u00f6nnen.<\/p>\n

\"So<\/a><\/p>\n

Die einzige Sache bei diesem Ansatz ist, dass Sie \u00fcber einige technische Kenntnisse verf\u00fcgen m\u00fcssen, um die Skript-Handles zu finden, die erforderlich sind, um zu identifizieren, welche Dateien zur\u00fcckgestellt werden sollen.<\/p>\n

Insgesamt ist Async Javascript ein gro\u00dfartiges Plugin und es ist kostenlos!<\/p>\n

Wenn Sie ein ebenso einfaches, aber robusteres Leistungs-Plugin suchen, lesen Sie weiter.<\/p>\n

So verschieben Sie JS mit WP Rocket<\/h3>\n

Das Plugin, das ich auf competethemes.com verwende und f\u00fcr die meisten Leistungsoptimierungen empfehle, ist WP Rocket<\/a>.<\/p>\n

\"So<\/a><\/p>\n

WP Rocket bietet eine einfache Benutzeroberfl\u00e4che voller Leistungsoptimierungsfunktionen. Sie k\u00f6nnen einen Schalter umlegen, um Dateien zu verkleinern und zu verketten, erweitertes Caching zu aktivieren, Bilder faul zu laden<\/a> und mehr.<\/p>\n

W\u00e4hrend dieses Plugin unter der Haube komplex ist, erfordert das Einstellungsfenster keine technischen Kenntnisse. Dies gilt auch f\u00fcr das Zur\u00fcckstellen von Javascript-Dateien.<\/p>\n

Im WP Rocket-Dashboard finden Sie einen Abschnitt zur Dateioptimierung.<\/p>\n

\"So<\/a><\/p>\n

Hier gibt es viele gro\u00dfartige Optimierungstools, und die JS-Aufschubfunktion befindet sich am Ende der Seite. Wenn Sie das Aufschieben aktivieren, wird ein zweites Kontrollk\u00e4stchen mit einer automatisch aktivierten Einstellung f\u00fcr den abgesicherten Modus angezeigt.<\/p>\n

\"So<\/a><\/p>\n

Wie ich bereits erw\u00e4hnt habe, f\u00fchrt das Zur\u00fcckstellen von jQuery sehr oft zu fehlerhaften Funktionen auf Ihrer Website. Sie k\u00f6nnen zwar versuchen, den abgesicherten Modus zu deaktivieren, sollten dies jedoch wahrscheinlich nicht.<\/p>\n

Und das ist wirklich alles! Aktivieren Sie einfach ein einzelnes Kontrollk\u00e4stchen und Ihre Javascript-Dateien werden zur\u00fcckgestellt.<\/p>\n

Wenn Sie weitere Leistungsoptionen erkunden m\u00f6chten, besuchen Sie WP Rocket hier<\/a> oder lesen Sie unser WP Rocket-Tutorial<\/a>.<\/p>\n

Javascript verschoben<\/h2>\n

Wenn Ihre Javascript-Dateien zur\u00fcckgestellt sind, wird das HTML-Dokument Ihrer Site fr\u00fcher geladen und Ihre Site wird viel schneller angezeigt.<\/p>\n

F\u00fcr die meisten WordPress-Sites ist dies ein einfacher und erheblicher Leistungsgewinn. Besser noch, es erfordert keine technischen Kenntnisse, um sich auf Ihre Website zu bewerben.<\/p>\n

Wenn Sie noch Fragen zum Zur\u00fcckstellen von Javascript mit WordPress haben, hinterlassen Sie unten einen Kommentar.<\/p>\n

Aufnahmequelle: www.competethemes.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"

Finden Sie zwei einfache Methoden, um Javascript auf Ihrer WordPress-Site zu verschieben. Jede Seite wird nach ein paar Minuten Einrichtung schneller geladen.<\/p>\n","protected":false},"author":1,"featured_media":257628,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[580],"tags":[845],"class_list":["post-241377","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-beschleunige-wordpress","tag-affiai-de"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/241377","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/comments?post=241377"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/posts\/241377\/revisions"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/media?parent=241377"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/categories?post=241377"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/de\/wp-json\/wp\/v2\/tags?post=241377"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}