שימוש ב-History API לניהול כתובות ה-URL הוא נהדר, וזו גם תכונה חיונית לאפליקציות אינטרנט טובות. עם זאת, אחד החסרונות של השיטה הזו הוא שמיקומי הגלילה נשמרים, ואז, חשוב יותר, משוחזרים בכל פעם שעוברים בהיסטוריה. לרוב, המשמעות היא קפיצות לא אסתטיות כשמיקום הגלילה משתנה באופן אוטומטי, במיוחד אם האפליקציה מבצעת מעברים או משנה את תוכן הדף בכל דרך שהיא. בסופו של דבר, זה מוביל לחוויית משתמש נוראית.
גרוע מכך, יש מעט מאוד שאפשר לעשות בקשר לזה: Chrome מפעיל אירוע popState לפני האירוע scroll, כלומר אפשר לקרוא את מיקום הגלילה הנוכחי ב-popState ואז להפוך אותו ב-window.scrollTo בטיפול באירוע scroll (איכס, אבל לפחות זה עובד!). עם זאת, ב-Firefox האירוע scroll מופעל לפני popState, כך שאין לכם מושג מה היה ערך הגלילה הישן כדי שתוכלו לשחזר אותו. Bah!
עם זאת, יש פתרון אפשרי: history.scrollRestoration. הוא מקבל שני ערכי מחרוזת: auto, שמאפשר לשמור על המצב הנוכחי (וזה ערך ברירת המחדל שלו), ו-manual, שמציין שאתם, המפתחים, תקבלו בעלות על כל השינויים בגלילה שעשויים להיות נדרשים כשמשתמש עובר בהיסטוריה של האפליקציה. אם צריך, אפשר לעקוב אחרי מיקום הגלילה בזמן שמזיזים את רשומות ההיסטוריה באמצעות history.pushState().
התכונה הזו חדשה וניסיונית (אבל היא ממש מגניב), לכן חשוב לוודא שהיא זמינה לפני שמשתמשים בה:
if ('scrollRestoration' in history) {
// Back off, browser, I got this...
history.scrollRestoration = 'manual';
}
האפשרות history.scrollRestoration מופיעה ב-Chrome מגרסה 46 ואילך, והמפרט שלה זמין כאן.
אל תשכחו להשאיר לנו משוב, ולהודיע לספקים אחרים אם אתם רוצים שהם יתמכו גם ב-scrollRestoration.