𝗪𝗛𝗘𝗡 𝗔 𝗦𝗜𝗠𝗣𝗟𝗘 𝗥𝗘𝗙𝗥𝗘𝗦𝗛 𝗕𝗥𝗢𝗞𝗘 𝗢𝗨𝗥 𝗔𝗣𝗣
Nous avons trouvé un bug. Les routes principales fonctionnaient bien. Les routes profondes provoquaient des rechargements complets de la page. La barre latérale se réinitialisait à chaque fois. L'application semblait instable.
Cela fonctionnait en local. Cela échouait en production.
Nous utilisions l'export statique de Next.js sur Azure Static Web Apps. Cette configuration ne possède pas d'environnement d'exécution serveur. Elle sert des fichiers statiques.
Le problème venait de la navigation fluide (soft navigation). Next.js a besoin des données de payload des routes pour des transitions fluides. Il a besoin de HTML pour le premier chargement.
Nos règles de réécriture Azure étaient trop larges. Azure envoyait du HTML alors que Next.js demandait des données de payload. Le routeur échouait. L'application se rechargeait.
Nous avons résolu cela grâce à l'automatisation. Nous avons conçu un outil pour générer les règles de réécriture à partir du résultat du build. L'outil permet désormais de :
- Scanner les fichiers de routes dynamiques.
- Créer des règles spécifiques pour le HTML et les payloads.
- Ordonner les règles par priorité.
- Écrire le fichier de configuration final.
Cela a éliminé les erreurs manuelles.
Si vous utilisez l'export statique sur Azure :
- Automatisez vos fichiers de configuration.
- Testez la navigation fluide (soft navigation).
- Vérifiez si les requêtes de payload renvoient du HTML.
- Considérez les règles de réécriture comme une infrastructure critique.
Les bugs frontend complexes se cachent souvent entre le résultat du build et les règles d'hébergement.