Menggunakan History API untuk mengelola URL Anda adalah hal yang luar biasa dan, kebetulan, merupakan fitur penting dari aplikasi web yang baik. Namun, salah satu kelemahannya adalah posisi scroll disimpan, lalu yang lebih penting, dipulihkan setiap kali Anda menjelajahi histori. Hal ini sering kali berarti lompatan yang tidak terlihat saat posisi scroll berubah secara otomatis, dan terutama jika aplikasi Anda melakukan transisi, atau mengubah konten halaman dengan cara apa pun. Pada akhirnya, hal ini akan menyebabkan pengalaman pengguna yang mengerikan.
Untuk memperburuk masalah, Anda tidak dapat berbuat banyak: Chrome memicu peristiwa popState sebelum peristiwa scroll, yang berarti Anda dapat membaca posisi scroll saat ini di popState, lalu membalikkannya di pengendali peristiwa scroll dengan window.scrollTo (Ewww, tapi setidaknya berfungsi). Namun, Firefox memicu peristiwa scroll sebelum popState, sehingga Anda tidak tahu nilai scroll lama untuk memulihkannya. Bah!
Namun, kabar baiknya adalah ada potensi perbaikan: history.scrollRestoration. Ini memerlukan dua nilai string: auto, yang mempertahankan semuanya seperti saat ini (dan merupakan nilai defaultnya), dan manual, yang berarti Anda sebagai developer akan mengambil kepemilikan atas perubahan scroll yang mungkin diperlukan saat pengguna menjelajahi histori aplikasi. Jika perlu, Anda dapat melacak posisi scroll saat mendorong entri histori dengan history.pushState().
Fitur ini baru dan eksperimental (meskipun sangat keren), jadi pastikan untuk memeriksa ketersediaannya sebelum menggunakannya:
if ('scrollRestoration' in history) {
// Back off, browser, I got this...
history.scrollRestoration = 'manual';
}
Anda akan menemukan history.scrollRestoration di Chrome 46 dan yang lebih baru, dan Anda dapat menemukan spesifikasinya di sini.
Jangan lupa untuk memberikan masukan kepada kami, dan beri tahu vendor lain jika Anda ingin mereka juga mendukung scrollRestoration.