L'utilizzo dell'API History per gestire gli URL è fantastico e, in effetti, è una funzionalità fondamentale delle buone app web. Uno dei suoi svantaggi, tuttavia, è che le posizioni di scorrimento vengono memorizzate e, soprattutto, ripristinate ogni volta che consulti la cronologia. Ciò spesso comporta salti sgradevoli quando la posizione di scorrimento cambia automaticamente, in particolare se la tua app esegue transizioni o modifica in qualche modo i contenuti della pagina. Ciò comporta un'esperienza utente orribile.
A peggiorare le cose, non puoi fare molto: Chrome attiva un evento popState prima dell'evento scroll, il che significa che puoi leggere la posizione di scorrimento corrente in popState e poi invertirla nel gestore eventi scroll con window.scrollTo (che schifo, ma almeno funziona!). Firefox, tuttavia, attiva l'evento scroll prima di popState, quindi non hai idea di quale fosse il vecchio valore di scorrimento per ripristinarlo. Bah!
La buona notizia è che esiste una potenziale soluzione: history.scrollRestoration. Accetta due valori di stringa: auto, che mantiene tutto invariato (ed è il valore predefinito), e manual, che indica che tu, in qualità di sviluppatore, acquisirai la proprietà di eventuali modifiche allo scorrimento che potrebbero essere necessarie quando un utente esplora la cronologia dell'app. Se necessario, puoi tenere traccia della posizione di scorrimento mentre inserisci le voci della cronologia con history.pushState().
La funzionalità è nuova e sperimentale (anche se assolutamente fantastica), quindi assicurati che sia disponibile prima di utilizzarla:
if ('scrollRestoration' in history) {
// Back off, browser, I got this...
history.scrollRestoration = 'manual';
}
history.scrollRestoration è disponibile in Chrome 46 e versioni successive e puoi trovare le relative specifiche qui.
Non dimenticare di inviarci un feedback e di comunicare ad altri fornitori se vuoi che supportino anche scrollRestoration.