Résumé
Cela fait plus de 10 ans que je réalise des intégrations, au travers des expériences front-end. Preuve de mon ancienneté dans ce domaine, j’ai connu les problématiques d’intégration IE7 ! Je me suis formé en continu, au fur et à mesure à mesure de l’arrivée (et le support) des nouvelles possibilités comme flexbox ou des meta-langages SCSS, SASS.
Mon approche
On peut penser que le travail d’intégration ne nécessite que peu d’expérience. Et pourtant une intégration bien réalisée nécessite une très bonne connaissance du web.
WebPerf
Aspet indispensable et pourtant trop souvent ignoré, la webperf est une pratique qui consiste à réduire le temps d’affichage d’une page web. Bien évidemment, les temps de réponse du serveur et des différentes API servants la donnée ont un impact fort mais il existe tout un ensemble de leviers côté intégration pour améliorer considérablement votre score webperf.

Métrics
Il existe un ensemble de métriques à prendre en compte. Pour ma part, je recommande de suivre les indicateurs de performance de l’outil Lighthouse de Google : First Contentful Paint, Speed Index, Largest Contentfull Pain, …
Critical CSS (exemple)
Critical CSS est un terme désignant le style indispensable à la construction du rendu qui est au-dessus de la ligne de flottaison.
Le header de votre page html doit contenir une balise style
(et non link
) incluant ce CSS.
L’extraction diffère en fonction des frameworks et outils comme le bundler. Idéalement cette mécanique doit être pensée en avance de phase et intégrée dans le socle du projet.
Sécurité
Sécuriser son frontend nécessite d’être vigilant et de se protéger à minima contre les attaques XSS via la mise en place de la couche CSP.
Maintenabilité
Un code bien rangé est un code maintenable et donc un code qui coûte moins cher sur le long terme. J’apporte une importance toute particulière à la structure du code en identifiant les ressources core et en découpant en composants. Le nommage des classes est un aspect tout aussi important pour ne pas si perdre avec le temps. Il existe des conventions comme le BEM qui permet de garder une structure claire et maintenable.
Accessibilité (A11y)
Site grand publique ou non, il est indispensable de prendre en compte les problématiques d’accessibilité lors de la phase d’intégration. Il existe un ensemble de bonnes pratiques à connaitre.
SEO
Le SEO est une discipline bien spéciale et n’est pas ma spécialité. Cependant, lors d’une intégration, je reste toujours vigilant aux bonnes pratiques de base comme l’utilisation des bonnes balises ou des attributs indispensables.