History API - Kaydırma geri yükleme

Paul Lewis

URL'lerinizi yönetmek için History API'sini kullanmak mükemmel bir yöntemdir ve iyi web uygulamalarının önemli bir özelliğidir. Bununla birlikte, kaydırma konumlarının olumsuz yanlarından biri de, daha da önemlisi, geçmişte gezinirken yaptığınız işlemlerin geri yüklenmesi. Bu durum genellikle kaydırma konumu otomatik olarak değiştiğinde, özellikle de uygulamanızın geçiş yaptığı veya sayfanın içeriğini herhangi bir şekilde değiştirdiği durumlarda hoş görünmeyen atlamalar anlamına gelir. Sonuç olarak bu çok kötü bir kullanıcı deneyimine yol açar.

İşleri daha da kötü hale getirmek için yapabileceğiniz çok az şey var: Chrome, scroll etkinliğinden önce bir popState etkinliğini tetikler. Bu da popState içindeki geçerli kaydırma konumunu okuyabileceğiniz ve ardından window.scrollTo ile scroll etkinlik işleyicisinde bunu tersine çevirebileceğiniz (Ewww, ancak en azından işe yarar!) anlamına gelir. Ancak Firefox, popState öncesinde scroll etkinliğini tetikler. Bu nedenle, eski kaydırma değerinin ne olduğunu geri yüklemek için herhangi bir fikriniz yoktur. Bahadır!

Ancak iyi bir haberimiz var: history.scrollRestoration. İki dize değeri alır: Her şeyi bugün olduğu (ve varsayılan değeri) koruyan auto ve manual. Yani, bir kullanıcı uygulamanın geçmişini gezindiğinde yapılması gerekebilecek tüm kaydırma değişikliklerinin sahipliğini geliştirici olarak alırsınız. Gerekirse history.pushState() ile geçmiş girişlerini aktarırken kaydırma konumunu takip edebilirsiniz.

Bu özellik yeni ve deneyseldir (ancak tamamen harikadır), kullanmadan önce kullanılabilir olup olmadığını kontrol edin:

if ('scrollRestoration' in history) {
    // Back off, browser, I got this...
    history.scrollRestoration = 'manual';
}

history.scrollRestoration uygulamasını Chrome 46 ve sonraki sürümlerde bulacaksınız. Spesifikasyonu burada bulabilirsiniz.

Bize geri bildirim göndermeyi ve scrollRestoration ürününü desteklemelerini istediğiniz diğer sağlayıcıları bildirmeyi unutmayın.