Gedupliceerde JavaScript

Connor Clark
Connor Clark
X GitHub

Gepubliceerd: 8 okt. 2025

Verwijder grote, dubbele JavaScript-modules uit bundels om het aantal onnodige bytes dat door netwerkactiviteit wordt verbruikt, te verminderen.

Hoe dit inzicht over te brengen

  • Voor pagina's met meerdere JavaScript-bundels splitst de code grote afhankelijkheden die nodig zijn voor meerdere bundels op in een gemeenschappelijke bundel.
  • Zorg ervoor dat er binnen afzonderlijke JavaScript-bundels slechts één versie van grote afhankelijkheden is.

Je kunt dieper ingaan op de JavaScript-bundels op een pagina door op View Treemap te klikken. Hiermee open je de bundels van de pagina in de Lighthouse Treemap.

Lighthouse Treemap. De gekleurde knooppunten vertegenwoordigen dubbele modules die in meerdere JavaScript-bundels voorkomen.
Lighthouse-treemap. De gekleurde knooppunten vertegenwoordigen dubbele modules die in meerdere JavaScript-bundels voorkomen.

  • In PageSpeed ​​Insights en in het Lighthouse-rapport bevindt deze knop zich in de categorie Prestaties onder de statistieken:

    Knop Treemap Vuurtorenweergave
    Knop "Bekijk Treemap" van vuurtoren.

  • In het DevTools Performance Panel bevindt deze knop zich in het inzicht Gedupliceerde JavaScript :

    DevTools Prestatiepaneel Weergave Treemap-knop
    DevTools Prestatiepaneel "Treemap weergeven"-knop.

Stapelspecifieke begeleiding

Maak een extra toegangspunt voor veelvoorkomende, grote afhankelijkheden en schakel de codesplitsingsfunctie van uw JavaScript-bundler in voor het volgende:

Aanvullende referenties