Verbetering van Google Zoeken met compressiewoordenboeken

Carlos Mateo Muñoz

Barry Pollard

Gepubliceerd: 14 mei 2025

Compression Dictionary Transport is een nieuwe standaard waarmee we herhaalde content over meerdere verzoeken heen kunnen comprimeren. Deze standaard werd eind 2024 geïntroduceerd in Chrome 130. Google Search heeft deze nieuwe technologie overgenomen en aanzienlijke verbeteringen gezien.

De mogelijkheid

Er is veel duplicatie in de webpagina's die we bezoeken. Veel pagina's op dezelfde website bestaan ​​uit grote delen van dezelfde code – of het nu HTML, CSS of JavaScript is – waarbij alleen de inhoud tussen al deze code verandert. Hoewel elk resultaat een unieke combinatie is van honderden elementen die resulteren in volledig unieke inhoud, is er toch veel overeenkomst in de code die naar de browser wordt gestuurd om ze te produceren.

Visueel gezien lijken de meeste zoekresultatenpagina's min of meer op elkaar, ongeacht de ingevoerde zoekterm: bovenaan zien we het Google-logo, de zoekbalk en enkele bedieningselementen. In het midden bevinden zich tabbladen voor het zoektype, en links een lijst met zoekresultaten, afgewisseld met diverse widgets die de gebruiker helpen, en rechts extra context met 'over ons'-panelen.

Helemaal onderaan vinden we de pagineringsopties en de standaard voettekst. Dit is slechts wat visueel zichtbaar is; achter de schermen wordt er veel code (HTML, CSS en JavaScript) gebruikt om deze pagina te genereren. Veel van deze code is direct in de HTML van de pagina opgenomen als prestatieoptimalisatie. Hoewel dit zorgt voor een snellere laadtijd, is het nadeel dat de code niet gedeeld kan worden tussen verschillende resultatenpagina's, zoals wel mogelijk zou zijn bij een extern gecachede bron.

Compressie op het web

Compressie is een veelgebruikte technologie voor het web. Door bestanden te comprimeren met gzip, of nieuwere algoritmen zoals Brotli of Zstandard, wordt herhaling binnen een bestand voorkomen. Bij verliesvrije compressie wordt alle informatie zo compact mogelijk op de server verpakt voordat het bestand wordt verzonden. De browser kan de gecomprimeerde bytes vervolgens decomprimeren om de oorspronkelijke inhoud te herstellen. Voor afbeeldingen biedt verliesgevende compressie vergelijkbare voordelen door overbodige bytes te verwijderen die voor gebruikers mogelijk niet merkbaar verschillen.

Tot voor kort was compressie op het web beperkt tot compressie binnen afzonderlijke bronnen. Het was niet mogelijk om te comprimeren tussen verschillende bronnen, en al helemaal niet tussen verschillende pagina's. Dit werd al lange tijd erkend als een beperking die webontwikkelaars graag wilden verhelpen.

Compressiewoordenboek. Transport schiet te hulp!

Compression Dictionary Transport is een nieuwe standaard die compressie over verschillende bronnen mogelijk maakt door gebruik te maken van gedeelde "woordenboeken" waarmee veelvoorkomende reeksen bytes kunnen worden vervangen door verwijzingen naar dat gedeelde woordenboek.

Moderne compressiealgoritmen zoals Brotli en Zstandard ondersteunen het gebruik van woordenboeken met veelgebruikte termen, waardoor een hogere compressie mogelijk is doordat die termen worden vervangen door een kortere verwijzing naar het woordenboek. Brotli wordt zelfs geleverd met een ingebouwd woordenboek met veelgebruikte webtermen. Compression Dictionary Transport bouwt hierop voort door de server en browser de mogelijkheid te bieden om aangepaste woordenboeken te delen.

Aangepaste woordenboeken kunnen een bron zijn die al op de site wordt gebruikt. Je kunt bijvoorbeeld app.v1.js als woordenboek gebruiken bij het downloaden app.v2.js om in principe alleen het verschil te downloaden (vaak bekend als "delta-compressie"). Als alternatief kan een aparte woordenboekbron worden gespecificeerd met een <link rel="compression-dictionary"> tag (of een equivalente Link HTTP-header).

Dit kan de downloadgrootte van bronnen met veel gedeelde inhoud of code, zoals de eerder genoemde zoekresultatenpagina's, aanzienlijk verkleinen.

Het gebruik van compressiewoordenboeken door Google Search

Het Google Search-team is continu bezig de prestaties van Search te verbeteren . Ze waren er vroeg bij om compressiewoordenboeken te gebruiken, omdat ze het potentieel van deze technologie inzagen.

De zoekfunctie maakt gebruik van gedeelde Brotli-compressie voor de resultatenpagina's, met een apart woordenboekbestand dat is opgebouwd uit een representatieve steekproef van zoekresultaten. Een robuuste, geautomatiseerde pipeline zorgt ervoor dat het woordenboek actueel blijft en gelijke tred houdt met de vaak veranderende SRP-content die meerdere keren per dag wordt uitgebracht. U kunt DevTools gebruiken om precies te zien hoe dit werkt.

Wanneer een client voor het eerst een pagina met zoekresultaten laadt, stuurt de server een link naar het woordenboek via de HTTP-header Link: met het type rel=compression-dictionary :

Als de client Brotli-woordenboekcompressie ondersteunt, maar het gedeelde woordenboek nog niet in de cache heeft opgeslagen, downloadt de browser dit woordenboek tijdens inactiviteit. Het antwoord met het woordenboek bevat de Use-As-Dictionary -header, die de browser vertelt voor welke bronnen het woordenboek gebruikt mag worden:

Het woordenboek maakt gebruik van standaard cache-control en is beschikbaar voor alle bronnen die voldoen aan de regels die in die header zijn gedefinieerd – in dit voorbeeld pagina's die beginnen met /search .

Bij toekomstige weergaven van de zoekresultatenpagina kan de browser de server laten weten dat er een woordenboek beschikbaar is door middel van de HTTP-header ` Available-Dictionary . Het opnieuw laden van de pagina laat dit in actie zien:

Met het selectievakje 'Logboek behouden' ingeschakeld en filterend, kunnen we de twee antwoorden vergelijken:

In dit voorbeeld is het eerste verzoek het volledige antwoord van 107 kB en maakt gebruik van Brotli-compressie ( br ), terwijl het tweede herlaadverzoek bijna half zo groot is, namelijk 60 kB, en gebruikmaakt van Dictionary-Compressed Brotli-compressie ( dcb ), wat resulteert in een snellere downloadtijd.

In Chrome kunt u de pagina chrome://net-internals/#sharedDictionary bekijken om gedeelde woordenboeken te zien en deze te wissen als u dit voorbeeld vanaf het begin wilt herhalen.

De resultaten

De wijziging werd in het voorjaar van 2025 uitgerold naar gebruikers van Google Search, aanvankelijk naar Chrome-gebruikers. Hierdoor werd de gemiddelde grootte van de HTML-payload voor alle Chrome-gebruikers met 23% verminderd ten opzichte van de standaard Brotli-compressie. Dit gemiddelde omvat zowel resultaten die niet met een woordenboek zijn gecomprimeerd (bijvoorbeeld voor nieuwe gebruikers zonder woordenboek) als resultaten die wel met een woordenboek zijn gecomprimeerd. Voor resultaten die met een woordenboek zijn gecomprimeerd, is de besparing zelfs nog groter, zoals we zagen met de verbetering van bijna 50% in het vorige voorbeeld.

Dit resulteerde in een algehele verbetering van 1,7% in de Largest Contentful Paint (LCP)-waarde , en tot wel 9% op netwerken met een hoge latentie. Dit lijkt misschien weinig, maar Google Search is een hypergeoptimaliseerde site, dus winsten van deze omvang zijn enorm. Andere sites kunnen met deze technologie zelfs nog grotere verbeteringen zien.

Probeer het eens op je website!

Compression Dictionary Transport is nu beschikbaar voor gebruik in alle op Chromium gebaseerde browsers (Chrome, Edge, Opera, enzovoort). Het is een geleidelijke verbetering die in eerste instantie genegeerd zal worden door browsers die het nog niet ondersteunen, maar naarmate meer browsers dit ondersteunen, kunnen ook zij er profijt van hebben.

De uitdagingen die deze technologie aanpakt, zijn lang niet specifiek voor Google Search. Veel websites kunnen profiteren van Compression Dictionary Transport, ofwel met een apart woordenboek zoals Search gebruikt, ofwel door een bestaande bron als woordenboek te gebruiken (zoals de vorige versie van een app bij het uitrollen van een nieuwe versie).

Raadpleeg de handleiding op MDN voor meer informatie over hoe deze technologie werkt en hoe u deze op uw website kunt implementeren.

Dit vereist wel enige configuratie op uw server of in uw buildproces om op woordenboeken gebaseerde gecomprimeerde resources te creëren en deze op de juiste manier aan te bieden, maar de resultaten kunnen qua prestaties zeer indrukwekkend zijn!