Les différents types de rendu web

HTML

La base de toute page web

2 possibilités

• Rendu côté serveur

• Rendu côté client

Rendu côté serveur

Rendu côté serveur

+ Chargement initial rapide
+ Meilleur référencement
+ Choix technologiques

- Navigation consécutive lente
- Pas de persistance
- Plus de charge serveur

Rendu côté client

Rendu côté client

+ Navigation plus fluide
+ Pas de rechargement total
+ Page d'accueil statique

- Chargement initial plus long
- Technologie imposée (JS)
- Difficile à référencer
- Architecture séparée (API)

SPA (single page application)

C'est quoi le mieux ?

Hybride centré serveur

• Hotwire

• Unpoly

• Livewire ( Laravel)

• Alpine.js, Stimulus

Hybride centré serveur

• Preact

• SolidJS

• Svelte

Hybride centré client

• Next

• Nuxt

• SvelteKit

• Remix

• Angular Universal

Dynamic Rendering

Comment choisir ?

Quelques exemples

• Wikipedia 
• Amazon
• Google
• GitHub
• StackOverflow
• Grafikart.fr

• YouTube
• Twitter
• Twitch
• Gmail
• Reddit

SSR

CSR