Le blog fait peau neuve

Découvrez la transformation majeure du blog : migration de Next 14 Page Router vers Next 15 App Router. Guide des défis, solutions et avantages de cette mise à niveau technique qui améliore les performances tout en conservant l'expérience utilisateur.
Oui, vous l'avez probablement remarqué, le blog a changé un peu !

En surface, très peu, mais dessous énormément !
On passe de Next 14 Page Router à Next 15 App Router, et franchement ce n'est pas rien pour une bascule de 2 jours, une PR de +6K -5K, vous voyez le genre...
Les principaux points à surveiller lors de votre montée en version:
- Passage des pages du dossier pages/[nom].tsx à un modèle app/[nom]/page.tsx: pas très compliqué jusque là.
- Changement des dynamic import vers les directives "use client", là ça se complique car en fonction de SSR true ou false il faut procéder différemment donc refactor le composant.
- Passage des api de api/[nom].ts à api/[nom]/route.ts: pas très compliqué non plus
- Au niveau des apis, changement des exports handler vers les exports REST, là il faut réécrire aussi, car finito les conditions sur le type de call (POST, PUT, DELETE...), c'est un export à part entière.
- Refactor de certains composants, ajout de "use client" dans les hooks pour forcer un render côté front
- Refonte de certains composants.
- N'oubliez pas de faire un:
export const dynamic = "force-dynamic";
Sinon vos pages seront statiques !
Les changements notables:
- Gain de perf sur les temps de rendus et l'optimisation mémoire
- Moins de confusion lors des rendus server side (ce qui était le cas des anciens moteurs de Next, cela crée des erreurs parfois s'il essaye de render côté back, d'où l'utilisation de safehydration wrapper.
- Légère perte au niveau des accessibilités (j'ai du perdre un ou deux attribut aria pendant la migration, mais je les remettrai...), l'objectif était de poser une première brique.
- Amélioration sécu ? je ne sais pas, parce que vu la faille Next exposée dernièrement, il faut attendre de voir si ça ne couve pas autre chose.
Quoiqu'il en soit, profitez bien de la nouvelle peau du site, et rien que pour le souvenir, je vous poste une photo de ce que c'était avant:
Adios Next v14

Bon surf.

Alexandre P.
Développeur passionné depuis plus de 20 ans, j'ai une appétence particulière pour les défis techniques et changer de technologie ne me fait pas froid aux yeux.
Poursuivre la lecture dans la rubrique News