Tek sayfa uygulaması mı çok sayfalı site mi.

Birinde gezinmeyi uygulama yapar, ötekinde tarayıcı; belge-arası geçişten sonra «akıcı geçiş için uygulama gerekir» cümlesi artık doğru değil.

On yıl boyunca bu karşılaştırmanın cevabı belliydi: akıcı geçiş, korunan durum ve hızlı sayfa değişimi istiyorsan uygulama yazardın. O cevabın dayandığı teknik varsayım değişti. Tarayıcı artık iki ayrı belge arasında geçiş animasyonu kurabiliyor ve bunun için tek satır CSS yetiyor. Yani karşılaştırma yeniden açıldı.

Uygulamanın devraldığı işler

Tek sayfa uygulaması, tarayıcının yaptığı bir işi devralır: gezinme. Devralınan iş yalnız içeriği değiştirmek değildir — odak nereye gidecek, sayfa başlığı ne olacak, ekran okuyucuya ne duyurulacak, geri tuşu ne yapacak, kaydırma konumu korunacak mı? Bunların hepsi yazılır ve test edilir. Karşılığında gerçek bir kazanç vardır: durum bellekte kalır. Yarısı doldurulmuş bir form, çalan bir oynatıcı ya da açık bir harita, gezinme boyunca yaşamaya devam eder.

Çok sayfalı tarafın bugünkü hâli

Çok sayfalı bir sitede her adres kendi belgesidir ve gezinmeyi tarayıcı yapar. Yeni olan şey, bu gezinmenin artık görsel olarak da sürekli olabilmesi: belge-arası geçiş, eski sayfanın son karesiyle yeni sayfanın ilk karesi arasında bir animasyon kurar. Geçişin tanımı CSS’te durur, JavaScript gerekmez, ve desteklemeyen bir motorda gezinme yalnız animasyonsuz olur.

İkinci fark ölçümde: çok sayfalı sitede her gezinme kendi başına bir sayfa yüklemesidir, yani alan metrikleri her adres için ayrı ayrı toplanır. Tek sayfa uygulamasında yumuşak gezinmeler bugünkü metriklerin dışında kalır; ölçtüğün şey çoğunlukla ilk yüklemedir.

Ölçüm tuzağı: lab aracı gerçek tarayıcı değildir

Belge-arası geçişe katılan bir sayfayı ölçerken dikkat: lab araçlarının başlattığı tarayıcı, ziyaretçinin tarayıcısıyla aynı bayraklarla çalışmaz ve bu fark ilk kareyi saniyelerce geciktirebilir. Bu sitede ölçülen tam olarak buydu; ayrıntısı ayrı bir yazıda: Lighthouse neden 87 diyor, gerçek Chrome neden 98. Karar verirken lab skorunu tek kanıt saymamak gerekiyor — alan verisi ve gerçek tarayıcı ölçümü de masada olmalı.

Karar nasıl verilir

Soru «hangisi modern» değil, «durum nerede yaşıyor». Ziyaretçinin oturum boyunca taşıdığı bir durumu varsa (düzenlediği bir belge, doldurduğu uzun bir form, açık bir oynatıcı) uygulama tarafı işini kolaylaştırır. Sayfalar birbirinden bağımsız okunuyorsa, çok sayfalı taraf daha az kod, daha dar hata yüzeyi ve tarayıcının yerleşik davranışını bedava verir. Bu site ikinci gruptadır ve geçiş animasyonunu uygulama yazmadan kurar.

Sitenizin hızını ölçüp kök nedeni kaynağında düzeltmemizi isterseniz site hızı optimizasyonu gerçek kullanıcı verisiyle başlar ve LCP, INP ve CLS için bütçeli bir teslim yapar.

SIK SORULAN SORULAR

Belge-arası geçiş her tarayıcıda var mı?

Hayır, ve olmadığında bir şey bozulmaz: kural opt-in’dir, desteklemeyen motorda gezinme yalnız animasyonsuz olur. İçerik, adresler ve geri/ileri aynı çalışır.

Çok sayfalı sitede gezinme yavaş olmaz mı?

Ölçüye bağlı. HTML kenar önbelleğinden ya da ön-getirmeden geliyorsa gezinme bir belge indirmesi kadar sürer; bu sitede gerçek kullanıcıların en kötü ölçülen LCP’si 476 milisaniye. Yavaşlık mimarinin değil, kaçırılan önbelleğin ve ağır sayfanın sonucudur.

Tek sayfa uygulaması arama için kötü müdür?

Kötü değil, pahalıdır: içerik istemcide üretiliyorsa onu görecek tarafın ek bir adım atması gerekir ve o adımın her motorda aynı olduğunu varsayamazsın. Sunucuda önceden render edilmiş bir uygulama bu farkı büyük ölçüde kapatır — ama o noktada mimari zaten ikisinin karışımıdır.