Performans genellikle bir aşama olarak planlanır: tasarla, kur, sonra “optimize et”. O aşama geldiğinde pahalı kararlar çoktan verilmiştir ve geriye yalnızca sıkıştırma kalır. Sonuç: bir ekip görsellerden kilobayt kırpmaya çalışırken, ilk ekranda kimsenin bilerek seçmediği üç yazı tipi yüklenir.
En pahalıya mal olan kararlar
Bir sayfayı yavaşlatan hemen her şey, tek satır kod yazılmadan önce kararlaştırılmıştır:
- Kaç yazı tipi, kaç ağırlıkta ve bunlardan biri ilk ekranda gerçekten gerekli mi.
- İlk ekran bir görsel mi, video mu, canvas mı, yoksa tipografi mi.
- Sayfanın ne kadarının etkileşimli olması gerekiyor; dolayısıyla tarayıcıya ne kadar JavaScript ulaşacak.
- Düzen, veri gelmeden çizilebiliyor mu, yoksa yalnızca geldikten sonra mı.
- Pazarlama ekibinin sonradan ekleyeceği üçüncü taraf araç sayısı.
Bunların her biri bir tasarım kararıdır. Bir mühendis hepsini iyi uygulayıp yine de yavaş bir sayfa yayınlayabilir; çünkü bütçe, dosya eline geçmeden harcanmıştır.
Bütçe bir tasarım kısıtıdır
Transfer boyutunu sütun genişliği gibi ele alın: başta üzerinde anlaşılan ve tasarımın içinde çalışmak zorunda olduğu bir sayı. Sonradan kovalanan bir puan değil, değerlendirme toplantısında ortaya çıkan bir hedef hiç değil. Bütçe, konuşmayı “bunu hızlandırabilir miyiz”den “bunu neye harcamak istiyoruz”a çevirir; bu bir tasarım sorusudur ve tasarım yanıtı vardır.
Performans bütçesi tasarımın üzerindeki bir kısıt değildir. Tıpkı sayfa boyutunun kitabın parçası olması gibi, tasarımın parçasıdır.
Ayrıca ödünleşmeleri hâlâ ucuzken görünür kılar. İkinci bir display yazı tipi, gerçek maliyeti olan gerçek bir seçimdir; hero videosu da öyle. İkisi de buna değebilir. Hiçbiri son haftada keşfedilmemelidir.
Pratikte neye benziyor
Bu sitede bütçe doğrudan tasarım sistemini biçimlendirdi. Üç yazı tipi; kendi sunucumuzda ve alt kümelenmiş, böylece Türkçe bir sayfa fazladan dosya yüklemiyor. Animasyon kütüphanesi yok; kademeli açılışlar ve çizilen iz, CSS ile tek bir küçük gözlemciden ibaret. Üretilen her grafik sunucuda oluşturulan deterministik SVG — sitede hiçbir stok fotoğrafın olmamasının sebebi de bu.
Bunların hiçbiri bir sayıyı tutturmak için verilmiş taviz değil. Tasarımın kendisi bunlar; sayı ise tasarımın bittiğini nereden bildiğimiz.
Asıl önemli ölçüm
Laboratuvar puanları bir geliştirme aracıdır. Ziyaretçinin yaşadığı şey saha verisidir: insanların elinde tuttuğu cihazlarda p75 LCP, INP ve CLS. Bir yapım laboratuvarda iyi puan alıp, eski telefonların ve kötü şebekenin olduğu bir pazarda yine de yavaş olabilir — ki çoğu işletmenin ulaşmaya çalıştığı pazar tam olarak orasıdır.
Performansın ve ölçümün aynı konuşmaya ait olmasının sebebi de bu: saha verisi olmadan bir laboratuvar için optimize edersiniz ve laboratuvar hiçbir şey satın almaz.