𝗪𝗔𝗡𝗡𝗘𝗘𝗥 𝗘𝗘𝗡 𝗘𝗘𝗡𝗩𝗢𝗘𝗗𝗜𝗚𝗘 𝗥𝗘𝗙𝗥𝗘𝗦𝗛 𝗢𝗡𝗭𝗘 𝗔𝗣𝗣 𝗞𝗔𝗣𝗢𝗧 𝗠𝗔𝗔𝗞𝗧𝗘
We vonden een bug. Hoofdroutes werkten prima. Diepere routes veroorzaakten volledige paginareloads. De zijbalk werd telkens gereset. De app voelde onstabiel aan.
Het werkte lokaal. Het faalde in productie.
We gebruikten Next.js static export op Azure Static Web Apps. Deze setup heeft geen server runtime. Het dient statische bestanden.
Het probleem was soft navigation. Next.js heeft route payload-data nodig voor soepele overgangen. Het heeft HTML nodig voor de eerste load.
Onze Azure rewrite rules waren te breed. Azure stuurde HTML wanneer Next.js om payload-data vroeg. De router faalde. De app herlaadde.
We hebben dit opgelost met automatisering. We hebben een tool gebouwd om rewrite rules te genereren vanuit de build output. De tool doet nu het volgende:
- Scant op dynamische routebestanden.
- Maakt specifieke regels voor HTML en payloads.
- Sorteert regels op prioriteit.
- Schrijft het uiteindelijke configuratiebestand.
Dit elimineerde handmatige fouten.
Als je static export gebruikt op Azure:
- Automatiseer je configuratiebestanden.
- Test soft navigation.
- Controleer of payload-verzoeken HTML teruggeven.
- Behandel rewrite rules als kritieke infrastructuur.
Complexe frontend-bugs bevinden zich vaak tussen de build output en de hostingregels.