SSR

Webpagina-rendering

Rendering is het proces waarbij de browser HTML, CSS en JavaScript omzet naar pixels op het scherm. De browser bouwt de DOM- en CSSOM-boom, combineert ze tot de render-tree, berekent de layout en schildert de pixels. Rendering kan server-side (SSR), client-side (CSR) of via static generation (SSG) plaatsvinden. Render-blocking resources vertragen dit proces.

A

Performance

Next JavaScript Framework

Next.js is een React-meta-framework van Vercel met API-routes, bestandsgebaseerde routing en automatische code splitting. Het is eenvoudig om mee te werken voor ontwikkelaars en bevat productie-optimalisaties out-of-the-box. De app router is de nieuwste architectuur en is de standaard voor moderne React-apps.

AA

Frontend

Static Site Generation

Bij SSG worden pagina's gebouwd op deploymenttijd in plaats van per request. Dit levert razendsnel serveerbare HTML op die gecached wordt op een CDN. Ideaal voor blogs, documentatiesites en marketingpagina's. Frameworks: Next.js, Nuxt en Astro.

AAA

Concepten

Client-Side Rendering

Bij CSR rendert de browser de pagina volledig met JavaScript: de server stuurt een vrijwel lege HTML-pagina en de browser bouwt de content op. Voordelen zijn een app-achtige ervaring na het laden. Nadelen zijn langzamere initiële laadtijd en complexere SEO. React en Vue zonder SSR zijn standaard CSR.

AA

Concepten