Ürün Listelemede Sayfalama, Daha Fazla Göster ve Sonsuz Kaydırma

Ürün listeleme sayfasında sayfalama biçimi görsel bir tercih değil; katalog büyüklüğüyle ve listeyi besleyen sorguyla birlikte alınan bir karar. Sonsuz kaydırma, "daha fazla göster" ve klasik sayfalama üçü de belirli bir katalog aralığında doğru, o aralığın dışında yanlış çalışır. Çoğu mağaza seçimi yalnızca arayüz tarafında yapıp veri tarafını olduğu gibi bırakıyor; sorun da genelde oradan çıkıyor.

Sonsuz kaydırma hangi listede çalışır

Sonsuz kaydırma için sık verilen tavsiye, kategori başına ürün sayısının 40'ın altında olması. Bu tavsiye kendi içinde tutarsız. 40 ürün zaten tek sayfaya sığar; sığmıyorsa mesele sayfalama biçimi değil, ürün kartlarının ağırlığıdır. Akışın gerçek belirleyicisi ürün sayısı değil, kullanıcının niyeti. Aradığı belirli bir ürün yoksa, göz gezdirerek ilerliyorsa sonsuz kaydırma işe yarar. Bir vida ölçüsü arayan kullanıcı göz gezdirmiyor, eleme yapıyor. Onun listesinde akış yalnızca engel.

Akışı yine de kullanacaksanız iki şeyi karşılamanız gerekir. Sayfa altlığındaki teslimat ve iade bilgileri kaydırmayla sürekli kaçıyorsa o bilgiler başka bir yere taşınmalı, yoksa kimse ulaşamaz. İkincisi konum: kaydırma çubuğu sürekli uzadığı için kullanıcı listenin neresinde olduğunu göremez, "69 ürünün 30'u görüntüleniyor" gibi sabit bir sayaç bunu tek başına çözer.

Asıl sorun arayüzde değil, sorguda

Sonsuz kaydırmayı offset tabanlı sorguya bağlamam. LIMIT 40 OFFSET 80 mantığı, liste iki yükleme arasında hiç değişmiyorsa doğru sonuç verir. E-ticarette değişir: stok biter, ürün yayından kalkar, popülerliğe göre sıralamada bir ürün yukarı çıkar. Aradaki kayma yüzünden kullanıcı bir ürünü ikinci kez görür, başka bir ürünü hiç görmez, üstelik bunu fark etmez.

Cursor (keyset) mantığı bunu ortadan kaldırır. Son görünen kaydın sıralama değeri ve kimliği üzerinden devam edersiniz, WHERE (fiyat, id) > (son_fiyat, son_id) gibi; liste altınızda kaysa bile okunan pencere kaymaz. İkinci kazanç performans. OFFSET 5000 yazdığınızda veritabanı o 5000 satırı okuyup atar, yani maliyet liste derinliğiyle doğrusal büyür. Cursor'da derinlik maliyeti değiştirmez, dizin doğrudan başlangıç noktasına gider.

"Daha fazla göster" çoğu mağaza için doğru varsayılan

Butonlu yükleme, sonsuz kaydırmanın akıcılığını büyük ölçüde korur ama kontrolü kullanıcıda bırakır. Sayfa altlığı erişilebilir kalır, mobilde gereksiz veri çekilmez, listenin bir sonu vardır ve o son görülebilir.

Tek şartı, her tıklamada adres satırının güncellenmesi. 120 ürünü açıp bir ürüne giren, sonra geri dönen kullanıcı ilk 40 ürüne düşüyorsa buton da sonsuz kaydırma kadar sinir bozucudur. Durumu history.pushState ile adrese yazmak, geri dönüşte hem doğru sayıda ürünü hem de kaydırma konumunu geri getirmeye yeter. Yanına "333 üründen 80'i gösteriliyor" sayacını koyun; liste bittiğinde butonu kaldırıp bunu açıkça yazın.

Klasik sayfalama nerede kalır

Katalog binlerce ürüne çıktığında numaralı sayfalama hâlâ en doğrusu. Kullanıcı listenin ortasına atlayabilir, bir sayfayı yer imine ekleyebilir, bağlantıyı olduğu gibi gönderebilir. Amazon'un bu düzenden vazgeçmemesinin sebebi alışkanlık değil, bu üç davranış.

Arama motoru tarafı da buna bağlı. Yalnızca kaydırma olayıyla yüklenen ürünler, gerçek bir bağlantı üzerinden erişilebilir olmadıkça taranmaz; ilk 40 ürünün ötesi indekse hiç girmez. Akış ya da buton kullanacaksanız arkada /kategori?sayfa=2 biçiminde gezinilebilir adresler yine durmalı.

Karar

Seçim, katalog büyüklüğü ve kullanıcının listede ne yaptığıyla netleşir:

• Birkaç yüz ürüne kadar, göz gezdirmeye dayalı kategoriler: "daha fazla göster".
• Binlerce ürün ve yoğun filtre kullanımı: numaralı sayfalama, yanında düzgün filtre ve sıralama.
• Sonsuz kaydırma: yalnızca kullanıcının belirli bir hedefi olmadığı, keşfe dayalı akışlarda.

Hangisini seçerseniz seçin, sıralamayı cursor tabanlı kurun ve listenin durumunu adres satırında taşıyın. Bu ikisi olmadan üç seçenek de derin listelerde bozulur.