Korzystanie z interfejsu History API do zarządzania adresami URL jest świetnym i bardzo ważnym elementem dobrych aplikacji internetowych. Jednym z minusów jest to, że pozycje przewijania są przechowywane, a co ważniejsze, przywracane za każdym razem, gdy przewijasz historię. Często powoduje to nieestetyczne przeskakiwanie, gdy pozycja przewijania zmienia się automatycznie, zwłaszcza jeśli aplikacja przechodzi w inny stan lub zmienia zawartość strony w jakikolwiek sposób. W konsekwencji użytkownicy nie będą zadowoleni.
Co gorsza, nie można tego zbytnio obejść: Chrome uruchamia zdarzenie popState
przed zdarzeniem scroll
, co oznacza, że możesz odczytać bieżącą pozycję przewijania w funkcji popState
, a potem odwrócić ją w obiekcie scroll
za pomocą funkcji window.scrollTo
(niezbyt przyjemne, ale przynajmniej działa). Firefox uruchamia jednak zdarzenie scroll
przed popState
, więc nie wiesz, jaka była stara wartość przewijania, aby ją przywrócić. Bah!
Dobra wiadomość jest jednak taka, że istnieje potencjalne rozwiązanie: history.scrollRestoration
. Akceptuje 2 wartości ciągu znaków: auto
, która zachowuje wszystko w obecnej postaci (i jest wartością domyślną), oraz manual
, co oznacza, że Ty jako deweloper przejmiesz prawo własności do wszystkich zmian przewijania, które mogą być wymagane, gdy użytkownik przegląda historię aplikacji. W razie potrzeby możesz śledzić pozycję przewijania podczas przesyłania wpisów historii za pomocą history.pushState()
.
Ta funkcja jest nowa i eksperymentalna (choć naprawdę świetna), więc zanim z niej skorzystasz, sprawdź, czy jest dostępna:
if ('scrollRestoration' in history) {
// Back off, browser, I got this...
history.scrollRestoration = 'manual';
}
history.scrollRestoration
znajdziesz w wersji Chrome 46 i później. Specyfikację znajdziesz tutaj.
Nie zapomnij zostawić nam opinii i poinformować innych dostawców, że chcesz, aby oni też obsługiwali scrollRestoration
.