Dupliziertes JavaScript

Silktide prüft, ob ein Teil des Codes, den Ihre Seite herunterlädt, mehr als einmal enthalten ist. Duplizierter Code macht eine Seite größer und langsamer beim Laden, ohne den Besuchern einen Mehrwert zu bieten.

Modernes besteht in der Regel aus vielen kleinen Modulen, die zu einigen wenigen großen Dateien gebündelt werden. Wenn mehrere Bundles unabhängig voneinander erstellt werden – zum Beispiel Ihr eigener Code plus ein eingebettetes Widget –, kann jedes seine eigene Kopie desselben Moduls mitliefern, sodass Besucher identische Funktionalität zweimal herunterladen.

Warum das wichtig ist

Jedes duplizierte Modul kostet Downloadzeit, Verarbeitungszeit und mobile Daten – und liefert nichts im Gegenzug. An einem schnellen Büroanschluss mag die Verschwendung unsichtbar bleiben, aber Besucher auf dem Handy und in langsameren Netzen spüren sie direkt als eine Seite, die später erscheint und träge reagiert.

Duplizierung wächst zudem oft unbemerkt: Jedes neue Skript oder Widget, das einer Website hinzugefügt wird, kann eigene Kopien gängiger Bibliotheken mitbringen. So summiert sich die Verschwendung im Laufe der Zeit, sofern niemand gezielt danach sucht.

So beheben Sie das

Diese Korrektur betrifft Ihre Entwickler und den Build-Prozess der Website, nicht deren Inhalte:

Analysieren Sie, wie das JavaScript der Website gebündelt wird. Die meisten Bundling-Tools haben einen Analysemodus, der visualisiert, was jede Ausgabedatei enthält – damit lassen sich duplizierte Module leicht erkennen.
Konfigurieren Sie den Build so, dass gemeinsame Abhängigkeiten dedupliziert werden: Eine Bibliothek, die an mehreren Stellen verwendet wird, sollte einmalig eingebunden und geteilt werden, statt in jedes Bundle kopiert zu werden.
Gleichen Sie Versionen an: Zwei verschiedene Versionen derselben Bibliothek lassen sich nicht zusammenführen, daher besteht die eigentliche Lösung oft darin, alles auf eine gemeinsame Version zu aktualisieren.
Wenn die Duplizierung von einem Drittanbieterskript stammt, das Sie nicht neu bauen können, bitten Sie den Anbieter um einen schlankeren Build – oder ersetzen Sie es.

So testet Silktide dies

Silktide lädt die Seite in einem echten Browser, unter Verwendung des Gerätetyps, der Verbindungsgeschwindigkeit und des Teststandorts, die für Ihre Geschwindigkeitstests konfiguriert sind.
Es untersucht die JavaScript-Dateien, die die Seite herunterlädt, und identifiziert Module, die in mehr als einer Datei vorkommen. Kopien werden nach ihrer Funktion abgeglichen, sodass sie auch gefunden werden, wenn die Dateien unterschiedlich formatiert oder sind.
Für jedes duplizierte Modul meldet Silktide die Dateien, in denen es erscheint, und die Downloadgröße, die durch das Entfernen der zusätzlichen Kopien eingespart werden könnte.
Die Seite wird anhand der insgesamt verschwendeten Downloadgröße bewertet: Schon etwa 10 KB Duplizierung führen zu einer Abwertung, und 50 KB oder mehr werden als schlecht eingestuft.

Fehlerbehebung

Die beiden Dateien enthalten keinen identischen Code

Die Prüfung gleicht Module anhand dessen ab, was sie sind, nicht anhand ihres exakten Textes. Dasselbe Modul kann nach der Minifizierung in zwei Bundles sehr unterschiedlich aussehen und dennoch derselbe duplizierte Code sein.

Die Duplizierung steckt in einem Drittanbieterskript

Sie können das Bundle eines Dritten nicht neu bauen. Sprechen Sie den Anbieter darauf an, laden Sie sein Skript auf eine Weise, die Ihre Abhängigkeiten teilt, oder akzeptieren Sie die Kosten, wenn der Nutzen des Skripts überwiegt.