Salut, amis passionnés du Web ! ?

Avant de plonger dans le vif du sujet, je voulais vous faire savoir que cet article est une série d'articles d'introduction sur les modèles de rendu de mon portfolio. Si vous êtes curieux, vous pouvez consulter la version complète et bavarde sur mon site Web. C'est écrit comme une conversation amusante, ce qui le rend très facile à suivre. Mais pour l'instant, restons simples et directs ici sur dev.to !

Parlons maintenant des modèles de rendu Web !

Que sont les modèles de rendu Web ?

Imaginez que vous construisez une maison. Vous avez différentes manières de le construire, n'est-ce pas ? Certaines méthodes sont rapides, d’autres sophistiquées et certaines sont un mélange des deux. Les modèles de rendu Web sont un peu comme ça, mais pour les sites Web.

Il existe différentes manières de créer et d'afficher des pages Web. Chaque voie a ses propres bons et moins bons points. Connaître ces modèles vous aide à choisir la meilleure façon de créer votre site Web.

Pourquoi devriez-vous vous en soucier ?

Comprendre ces modèles est important car ils affectent :

1. À quelle vitesse votre site Web se charge
2. Comme c'est agréable à utiliser
3. Dans quelle mesure les moteurs de recherche peuvent-ils trouver votre site
4. Comme il est facile de mettre à jour votre site

Les principaux modèles de rendu

Voici les principaux modèles que nous examinerons :

Sites statiques

Applications multipages (MPA)

Rendu côté client (CSR)

Rendu côté serveur (SSR)

Génération de sites statiques (SSG)

Régénération statique incrémentielle (ISR)

Hydratation

Hydratation Progressive

Rendu en streaming côté serveur

Architecture de l'île

Composants du serveur

Quelques termes importants

Avant d'aller plus loin, apprenons quelques mots clés :

• Time To First Byte (TTFB) : à quelle vitesse le serveur commence à envoyer des données
• Time to Interactive (TTI) : quand vous pouvez commencer à utiliser le site Web
• First Contentful Paint (FCP) : lorsque vous voyez quelque chose pour la première fois sur la page
• Largest Contentful Paint (LCP) : lorsque la plus grande partie de la page apparaît
• Pré-rendu : création de pages Web à l'avance
• Meta Frameworks : outils spéciaux qui facilitent la création de sites Web
• Rendu isomorphe : un moyen de rendre les sites Web rapides et interactifs à la fois

Conclusion

Comprendre ces modèles est très utile si vous souhaitez créer de superbes sites Web. Chaque modèle a sa propre utilisation, et savoir quand les utiliser peut améliorer considérablement vos sites Web.

Ce n'est que le début de notre voyage vers les modèles de rendu. Si vous souhaitez en savoir plus sur chaque modèle, avec des exemples et comment les utiliser, consultez mon guide complet sur mon site portfolio.

N'oubliez pas que la clé n'est pas seulement de connaître ces modèles, mais de comprendre quand les utiliser. Bonne création de site Web ! ?

Si vous trouvez des erreurs ou si vous avez des suggestions d'amélioration, faites-le moi savoir ! Vos commentaires sont précieux pour améliorer encore ce contenu.