Wat is edge rendering en waarom is het belangrijk

Een traditionele webserver wordt in één geografische regio gehost. Gebruikers dicht bij die regio krijgen snelle antwoorden, maar gebruikers ver weg hebben last van aanzienlijke latentie — een gebruiker in Tokio die inhoud opvraagt bij een US-East-server, voegt meer dan 200 ms retourtijd toe voordat de eerste byte aankomt.

Een contentdeliverynetwerk (CDN) slaat statische bestanden zoals afbeeldingen, CSS en JavaScript op in tientallen aanwezigheidspunten (PoP's) wereldwijd en levert ze vanaf de dichtstbijzijnde locatie. Een traditioneel CDN kan echter geen code uitvoeren — het kan alleen vooraf gebouwde, statische inhoud aanbieden.

Een edge-runtime voert JavaScript uit op CDN-PoP's wereldwijd en voorkomt daarmee een retour naar de originserver voor dynamische aanvragen. In plaats van de aanvraag naar één server te routeren, wordt die afgehandeld op het PoP dat het dichtst bij de gebruiker ligt — vaak in dezelfde stad — waardoor de latentie sterk afneemt.

Cloudflare Workers voeren JavaScript uit met V8-isolates op meer dan 300 locaties wereldwijd. In tegenstelling tot serverloze functies zoals Lambda en Cloud Run hebben Workers vrijwel geen cold starts — gemeten in microseconden in plaats van de meer dan 100 milliseconden die kenmerkend zijn voor Lambda — omdat ze V8-isolates hergebruiken in plaats van containers op te starten.

Edge-rendering betekent dat je je React-applicatie server-side rendert op het edge-PoP dat het dichtst bij elke gebruiker ligt en de resulterende HTML onmiddellijk aanbiedt. De gebruiker in Tokio ontvangt een volledig gerenderde HTML-pagina vanaf een PoP in Singapore, niet vanaf een server in Virginia.

Een standaard-SSR-app die vanuit US-East wordt aangeboden, heeft mogelijk 400 ms nodig om Tokio te bereiken (200 ms netwerk + 200 ms serverrendering). Met edge-rendering vindt het renderen plaats in Singapore, waardoor de netwerklatentie daalt naar 30 ms en de HTML in totaal in minder dan 100 ms wordt geleverd — een verbetering van vier keer in de ervaren laadtijd.

Edge-runtimes zijn geen volledige Node.js-omgevingen. Cloudflare Workers verbieden de kern-API's van Node.js (fs, net, crypto), beperken de CPU-tijd tot 50 ms per aanvraag (betaalde abonnementen staan meer toe), beperken het geheugen en hebben geen toegang tot het bestandssysteem. Deze beperkingen vereisen een doordachte architectuur.

Verschillende platforms bieden edge-runtimes: Vercel Edge Functions (gebouwd op hetzelfde model met V8-isolates), Deno Deploy (gebruikt de Deno-runtime aan de edge) en Fastly Compute (gebruikt WebAssembly). Elk platform heeft een andere API-compatibiliteit, wereldwijde dekking en prijsmodellen.

Edge-rendering is het nuttigst voor inhoud die grotendeels statisch is, maar enige personalisatie nodig heeft: marketingpagina's met A/B-testvarianten, landingspagina's met geografisch gerichte inhoud en blogberichten met gebruikersspecifieke elementen (ingelogde status, taal). Zeer dynamische, database-intensieve pagina's hebben er minder baat bij.

Lambda- en Cloud Run-functies starten containers op, downloaden je code, initialiseren de runtime en voeren de code daarna uit — wat leidt tot cold starts van 100 tot 1000 ms. Workers hergebruiken V8-isolates die al actief zijn, waardoor cold starts met minder dan 5 ms feitelijk onmerkbaar zijn.

De meeste productie-apps gebruiken edge-rendering selectief: de edge rendert snelle, grotendeels statische pagina's, terwijl een regionale server geauthenticeerde, database-intensieve bewerkingen verwerkt. Met deze hybride aanpak profiteer je van de lagere latentie van edge-rendering zonder tegen de beperkingen ervan aan te lopen.

Edge-rendering voert JavaScript uit op CDN-PoP's wereldwijd, waardoor retouren naar originservers verdwijnen en de latentie sterk afneemt. Cloudflare Workers lopen voorop met cold starts van microseconden op basis van V8-isolates, verspreid over meer dan 300 locaties. De afwegingen zijn reëel — geen Node.js-API's en beperkte CPU-tijd — waardoor edge-rendering het meest geschikt is voor marketingpagina's en gepersonaliseerde maar grotendeels statische inhoud, en minder voor zware databasegestuurde pagina's.