כשהרענון הפשוט שבר לנו את האפליקציה
מצאנו באג. נתיבים ראשיים (Top routes) עבדו מצוין. נתיבים עמוקים (Deep routes) גרמו לטעינה מחדש של כל הדף. הסרגל הצדדי (sidebar) התאפס בכל פעם. האפליקציה הרגישה לא יציבה.
זה עבד מקומית. זה נכשל ב-production.
השתמשנו ב-Next.js static export ב-Azure Static Web Apps. להגדרת ה-setup הזו אין runtime של שרת. היא מגישה קבצים סטטיים.
הבעיה הייתה soft navigation. Next.js זקוק לנתוני payload של הנתיב עבור מעברים חלקים. הוא זקוק ל-HTML עבור הטעינה הראשונה.
חוקי ה-rewrite של Azure היו רחבים מדי. Azure שלח HTML כאשר Next.js ביקש נתוני payload. ה-router נכשל. האפליקציה נטענה מחדש.
תיקנו את זה באמצעות אוטומציה. בנינו כלי ליצירת חוקי rewrite מתוך ה-build output. הכלי כעת:
- סורק קבצי נתיבים דינמיים (dynamic route files).
- יוצר חוקים ספציפיים עבור HTML ו-payloads.
- מסדר את החוקים לפי עדיפות.
- כותב את קובץ ה-config הסופי.
זה הסיר שגיאות ידניות.
אם אתם משתמשים ב-static export ב-Azure:
- אוטומטו את קובצי ה-config שלכם.
- בדקו soft navigation.
- בדקו אם בקשות payload מחזירות HTML.
- התייחסו לחוקי rewrite כתשתית קריטית.
באגים קשים ב-frontend נמצאים לעיתים קרובות ברווח שבין ה-build output לבין חוקי האחסון (hosting rules).