Tarayıcıda açık dünya oluşturmak, bölüm 4: Gösterişli araziden önce akış

Cinevva CTO'su ve Kurucu Ortağı Oleg Sidorkin tarafından

Burada yeni misiniz? Seri rehberine göz atın. Rehber, spike'ın ne olduğunu açıklıyor ve tüm bölümlere bağlantı veriyor.

Akış, "iyi görünüyor" denilen projelerin genellikle dağıldığı noktadır.

Durağan bir karede pek çok şeyi gizleyebilirsiniz. Bir parça sınırını geçerken oluşan 40 ms'lik takılmayı gizleyemezsiniz.

Gelişmiş arazi temsilini oluşturmadan önce akışı özellikle test ettik. Bu, yükleme ve kaldırma davranışları hakkında net veriler elde etmemizi sağladı.

Spike 6, basit parça içerikleriyle komşuluk değişimini doğruladı.

Spike 6'yı yeni sekmede aç ↗ · Kaynak kodunu görüntüle

Ardından Spike 11'de gerçek arazi yaklaşımına geçtik: worker tarafında kod çözme ve 17'den 33'e, ardından 65 örnekli ızgaralara uzanan aşamalı iyileştirmeyle yükseklik parçalarının akışı.

Spike 11'i yeni sekmede aç ↗ · Kaynak kodunu görüntüle

Sıralama, beklediğimizden daha önemliydi. Doğrudan sıkıştırılmış yükseklik parçalarıyla başlasaydık her takılmanın nedeni belirsiz kalacaktı. Kod çözme sorunu mu, doku yükleme sorunu mu, yoksa geometri güncelleme sorunu mu? Spike 6, Spike 11 karmaşıklık eklemeden önce bir belirsizlik katmanını ortadan kaldırdı.

Bu bölümden çıkardığımız pratik bir ders, sonraki spike'lara da taşındı. Yükleme kaynaklı duraklamalar, ortalama FPS'den çıkarım yapmak yerine doğrudan ölçülmelidir. Ortalama FPS, kare süresi sıçramalarını gizler; kullanıcıların gerçekten hissettiği şey de bu sıçramalardır.

5. bölümde bitki örtüsü, arazi gölgelendiricileri ve kademeli gölgelerin aynı kare bütçesi için yarıştığı görsel maliyet konusuna geçiyoruz.

Bu bölümde değinilen teknolojiler

Parça tabanlı akış. Dünya, bağımsız parçalardan oluşan bir ızgaraya bölünür (genellikle 64x64 metre). Oyuncu hareket ettikçe arkada kalan kenardaki parçalar kaldırılırken öndeki kenardaki parçalar akışla yüklenir. Skyrim'in hücre sistemi bu şekilde çalışır: Oyuncunun etrafında 5x5'lik bir hücre ızgarası yüklenir ve oyuncu hareket ettikçe hücreler değiştirilir. Tarayıcı sürümü bu denkleme ağ gecikmesini de eklediğinden, oyuncunun hızına dayalı öngörülü önceden getirme kritik önem taşır. Akış mimarisi rehberimize bakın.

Aşamalı yükseklik haritası iyileştirmesi. Araziyi önce düşük çözünürlükte gönderin, ardından iyileştirin. Izgara boyutları keyfî değildir: Her seviye bir $(2^k+1)\times (2^k+1)$ ızgarasıdır; dolayısıyla $17=2^4+1$, $33=2^5+1$, $65=2^6+1$. $+1$, komşuların hizalanması için her sınırda ortak bir örnek bulunmasını sağlar ve her adımda örnek sayısı yaklaşık dört katına çıkar (kenar uzunluğu iki katına çıktıkça $n^2$ büyür). 17x17'lik bir ızgara (4 m aralıklı 64 m'lik bir parça için gereken minimum boyut), sıkıştırılmış hâlde yaklaşık 200 bayttır ve anında görünür bir yüzey oluşturur. Ardından 33x33 iyileştirmeyi, sonrasında da tam 65x65 çözünürlüğü akışla yükleyin. Her seviye, önceki verilerin yerini almadan yeni örnekler ekler. Bu yaklaşım, uzaktaki arazinin düşük çözünürlüklü, yakındaki arazinin ise tam çözünürlüklü veriler kullandığı geometri clipmap LOD halkalarıyla doğrudan eşleşir. Aşamalı parça yüklemeye bakın.

Delta kodlama ve sıkıştırma. Komşu hücrelerin değerleri birbirine benzediği için yükseklik haritası verileri iyi sıkıştırılır. Delta kodlama, her hücrenin tahmin edilen değeriyle (komşularının ortalamasıyla) arasındaki farkı saklayarak değerleri sıfırın yakınında kümeler. Zlib veya brotli ile birlikte kullanıldığında 65x65'lik bir parça, ham hâlde 8,4 KB'den sıkıştırılmış hâlde 1-2 KB'ye düşer. Uzaktaki parçalar için azaltılmış hassasiyette (16 bit yerine 8 bit): 0,5-1 KB. Arazi verisi sıkıştırmaya bakın.

Öngörülü önceden getirme. Parçaları oyuncu ulaşmadan önce yüklemektir. Önden yükleme mesafesi, bir parça yüklenirken oyuncunun katettiği mesafeyi karşılamalıdır: $d_{\text{prefetch}}=v\cdot t_{\text{load}}$. Bu nedenle hıza göre ölçeklenir: Yürüme hızında (5 km/sa) 2 parça önden (128 m), koşma hızında (15 km/sa) ise 4 parça önden getirilir. Yükleme halkası, hız vektörünün yönüne göre kayar. Bir öncelik kuyruğu, bekleyen istekleri aciliyetlerine göre sıralar ve oyuncunun uzaklaştığı parçalara yönelik istekleri iptal eder. Öngörülü önceden getirmeye bakın.

---

12 bölümden 4.'sü.
Önceki: Bölüm 3 - Bizi kurtaran gösterişsiz spike'lar
Sonraki: Bölüm 5 - Görsel güzelliklerin bütçelenmesi
Seri rehberi: /tr/blog/2026-02-25-open-world-browser-series-guide