İçeriğe geç
TREN
Atlıhan Harita

LCC for Web Kullanım Kılavuzu

Görüntüleme Performansı İyileştirme Kılavuzu

Bölüm 02 / 07Kılavuz sürümü v0.6.4Türkçe

Bu kılavuz, SDK'yı farklı performans seviyelerindeki cihazlarda optimize etmenize ve akıcı bir 3DGS (3D Gaussian Splatting) görüntüleme deneyimi elde etmenize yardımcı olur.

1. Anti-Aliasing'i Devre Dışı Bırakın

Three.js WebGLRenderer varsayılan olarak anti-aliasing'i etkinleştirmez. Projenizde antialias: true etkinse, performansa duyarlı senaryolarda devre dışı bırakmayı düşünün:

const renderer = new THREE.WebGLRenderer({ antialias: false });

Neden devre dışı bırakılmalı? 3DGS'deki her Gaussian noktası doğası gereği yumuşak biçimde sönümlenen yarı saydam bir elipstir. Çok sayıda elips üst üste bindiğinde kenarlar, ek çoklu örnekleme anti-aliasing (MSAA) olmadan da doğal olarak yumuşak görünür. MSAA'yı devre dışı bırakmak GPU'nun piksel başına işlediği örnek sayısını azaltır (genellikle 4'ten 1'e) ve görüntüleme kare hızını artırır.

Cesium kullanıcıları: Cesium Viewer varsayılan olarak MSAA'yı etkinleştirmez, bu nedenle ek bir işlem gerekmez.

2. Görüntüleme Çözünürlüğünü Düşürün

Cihaz piksel oranını düşürerek GPU'nun işlemesi gereken toplam piksel sayısını orantılı olarak azaltabilirsiniz. Bu, GPU dolgu hızı darboğazları için en etkili yöntemdir.

Three.js:

// High-performance device: use native pixel ratio
renderer.setPixelRatio(window.devicePixelRatio);

// Mid-range device: cap pixel ratio
renderer.setPixelRatio(Math.min(window.devicePixelRatio, 1.5));

// Low-end device / mobile: fixed 1x rendering
renderer.setPixelRatio(1.0);

Cesium:

const viewer = new Cesium.Viewer('container', {
    // Control rendering resolution via resolutionScale
    resolutionScale: 1.0 // Use 1.0 for low-end devices; use window.devicePixelRatio for high-end
});

Performans karşılaştırma referansı (1080p mantıksal çözünürlüğe göre):

Piksel OranıGerçekte Görüntülenen PiksellerGöreli Maliyet
1.01920×1080 ≈ 2.07M1×
1.52880×1620 ≈ 4.66M2.25×
2.03840×2160 ≈ 8.29M4×
3.05760×3240 ≈ 18.66M9×

Yüksek DPI'lı ekranlar (ör. Retina) genellikle 2 veya 3 devicePixelRatio değerine sahiptir. Bu değeri 1.0'a düşürmek, daha bulanık bir görüntü çıktısı pahasına fragment işleme performansında 4–9 kat iyileşme sağlayabilir.

3. Görüntülenen Maksimum Splat Sayısını Sınırlayın — setMaxSplats

Bu, en önemli performans ayarı parametresidir. Her karede görüntülemeye katılan toplam Gaussian splat sayısının üst sınırını denetler.

lccObj.setMaxSplats(3000000); // Max 3 million splats per frame

SDK'nın LOD zamanlayıcısı her karede sahnenin uzamsal dizinini tarar ve mesafeye ile görüş alanına göre görüntülenecek düğümleri seçer. Toplam splat sayısı bu sınırı aştığında zamanlayıcı, uzak veya düşük öncelikli düğümlerden başlayarak toplam sayı sınıra uyana kadar düğümleri eler.

Referans değerler: PC: 900K – 10M, Mobil: 500K – 2.6M; cihaz performansına bağlıdır. Bu sayfanın sonundaki Cihaz Seviyesine Göre Önerilen Yapılandırmalar bölümüne bakın.

4. Düğüm Başına Maksimum Splat Sayısını Sınırlayın — setMaxNodeSplats

Her uzamsal düğüm için görüntülenen maksimum splat sayısını denetler. Bu eşiği aşan düğümler otomatik olarak daha kaba bir LOD seviyesine düşürülür.

lccObj.setMaxNodeSplats(1500000); // Max 1.5 million splats per node

Bu parametre neden gerekli? Büyük sahnelerde, bina kümeleri gibi yoğun alanlar en yüksek LOD seviyesinde tek bir düğümde milyonlarca Gaussian splat içerebilir. Bu sınır olmadan kamera böyle bir alana yaklaştığında tek bir düğüm tüm görüntüleme bütçesini tüketir ve diğer alanlara bütçe kalmaz. Bu parametre, görüntüleme bütçesinin dağılımını daha dengeli hale getirir.

Önerilen değerler: Sahne yoğunluğuna ve cihaz seviyesine bağlı olarak genellikle setMaxSplats değerinin 1/3 – 2/3 katı olarak ayarlanır. Bu sayfanın sonundaki Cihaz Seviyesine Göre Önerilen Yapılandırmalar bölümüne bakın.

5. Görüntüleme Başlangıç LOD Seviyesini Sınırlayın — setStartLod

En yüksek hassasiyet seviyesini belirler. LOD 0 en ince seviyedir; daha yüksek değerler daha düşük hassasiyet anlamına gelir.

lccObj.setStartLod(0); // Finest quality (desktop default)
lccObj.setStartLod(1); // Skip finest level (mobile default)
lccObj.setStartLod(2); // Skip first two levels (very low-end devices)

SDK, sahne içeriği için çok seviyeli LOD verisi oluşturur. LOD 0 tam hassasiyetli veriyi içerir, LOD 1'in splat sayısı LOD 0'ın yaklaşık 1/2'si kadardır ve sonraki her seviyede bu oran devam eder. setStartLod, zamanlayıcının seçebileceği en ince LOD seviyesini sınırlar: değeri 1 yaptığınızda kamera bir nesneye yakın olsa bile LOD 0 verisi yüklenmez.

Performans etkisi:

AyarlarYakın Plan KalitesiSplat Sayısında AzalmaKullanım Alanı
setStartLod(0)En Yüksek—Üst seviye PC
setStartLod(1)Orta~50%Orta seviye ve altı PC, tüm mobil cihazlar
setStartLod(2)Daha Düşük~75%Düşük seviye PC / Mobil

setEndLod genellikle yapılandırılmaz — SDK en yüksek LOD seviyesini otomatik olarak yönetir.

6. Maksimum Görüntüleme Mesafesini Sınırlama — setMaxDistance

Kameradan itibaren maksimum görüntüleme mesafesini metre cinsinden belirler. Bu mesafenin ötesindeki içerik indirilmez, açılmaz (decompress) ve görüntülenmez.

lccObj.setMaxDistance(200); // Desktop default
lccObj.setMaxDistance(100); // Mobile default

Maksimum mesafeyi azaltmak görünür düğüm sayısını düşürür; böylece ağ indirmeleri, CPU sıralaması ve GPU görüntülemesinden oluşan tüm işlem hattının maliyeti azalır. İç mekân veya yakın mesafe görüntüleme senaryoları için uygundur.

Not: SDK, yüksekliğe uyum sağlayan yerleşik bir mekanizmaya sahiptir — kamera 20 metrenin üzerine çıktığında mesafe sınırı otomatik olarak gevşetilir ve kuşbakışı görünümde daha uzağı görmek mümkün olur.

Referans değerler:

PlatformMenzil
PC100 – 240
Mobil80 – 110

Bu sayfanın sonundaki Cihaz Seviyesine Göre Önerilen Yapılandırmalar bölümüne bakın.

7. LOD Otomatik Optimizasyonu — setLodAutoLevelUp

Etkinleştirildiğinde, görüntüleme bütçesinde boş kapasite kaldığında SDK bazı düğümlerin hassasiyetini otomatik olarak artırır.

lccObj.setLodAutoLevelUp(true); // Enable (recommended for mid-to-high-end devices)
lccObj.setLodAutoLevelUp(false); // Disable (recommended for low-end devices or stable frame rate)

Görüntülenen gerçek splat sayısı setMaxSplats sınırının altında olduğunda (örneğin kamera açık bir alana baktığında), otomatik optimizasyon mekanizması kalan bütçeyi yakındaki düğümlere ayırır ve detayı artırmak için daha yüksek hassasiyetli LOD verisini otomatik olarak yükler.

Dengeleme: Bunu etkinleştirmek görsel kaliteyi artırır, ancak ek veri indirmelerini ve açma işlemlerini tetikleyebilir; bu da düşük seviye cihazlarda ara sıra kare hızı dalgalanmalarına neden olabilir.

8. Küresel Harmonik Aydınlatma — useShcoef

Küresel harmonik aydınlatma (SH), Gaussian splat renklerinin bakış açısına göre değişmesini sağlar ve daha gerçekçi yansımalar ile parlak efektler üretir. SDK'da bu özellik varsayılan olarak kapalıdır.

// Check if data contains SH coefficients before enabling
if (lccObj.hasShcoef()) {
    lccObj.useShcoef(true, (percent) => {
        console.log('SH loading: ' + (percent * 100).toFixed(1) + '%');
    });
}

// Disable
lccObj.useShcoef(false, () => {});

Etkinleştirildiğinde:

  • Nesnelerdeki yüzey yansımaları ve parlaklık, bakış açısına göre doğal biçimde değişir
  • Özellikle metal, cam ve lake gibi malzemelerde görüntüleme kalitesi belirgin şekilde artar

Performans maliyeti:

  • Ek RGB küresel harmonik katsayılarını depolamak için GPU bellek kullanımı artar
  • 15 ek SH baz fonksiyonunu hesaplamak için GPU vertex shader işlem yükü artar
  • LCC formatında ek SH veri dosyalarının indirilmesi gerekir

Öneri: Yalnızca üst seviye masaüstü cihazlarda etkinleştirin. Mobil cihazlar için önerilmez.

9. Diğer Optimizasyon Seçenekleri

Yerel Önbellekleme (IndexedDB)

useIndexDB: true ile yerel veri önbelleklemeyi etkinleştirin (varsayılan olarak etkindir). Aynı sahneye sonraki ziyaretlerde veriler doğrudan yerel depolamadan yüklenir ve yükleme süreleri belirgin şekilde kısalır.

LOD Yumuşak Geçişi

LCC2, LOD yumuşak geçişlerini destekler (varsayılan olarak etkindir) ve LOD değişimleri sırasındaki görsel sıçramaları azaltır:

lccObj.setSmooth(true); // Enable (default)
lccObj.setSmooth(false); // Disable

Bu özellik, komşu uzamsal düğümler arasındaki LOD farklarını sınırlar ve hassasiyet kesintilerini ortadan kaldırır. CPU yükü çok düşüktür; özelliğin açık tutulması önerilir.


PC

SeviyesplatCountnodeSplatCountdistancestartLoddevicePixelRatio
Yüksek10,000,0006,000,0002400Yerel dpr
Orta-Yüksek4,200,0001,500,0002201Yerel dpr
Dengeli2,200,0001,000,0002001dpr > 1 ? 1.4 : dpr
Orta-Düşük1,800,000700,00015021
Düşük900,000400,0001002dpr > 1 ? 0.8 : 0.5

Mobil

SeviyesplatCountnodeSplatCountdistancestartLoddevicePixelRatio
Yüksek2,600,0001,000,0001101clamp(dpr, 1, 1.8)
Orta-Yüksek1,800,000800,0001001clamp(dpr * 0.9, 1, 1.8)
Dengeli1,000,000600,000901clamp(dpr * 0.8, 1, 1.2)
Orta-Düşük800,000400,000802clamp(dpr * 0.5, 0.5, 1)
Düşük500,000300,000802clamp(dpr * 0.4, 0.4, 0.8)

Bu bölüm XGRIDS'in resmî kullanım kılavuzundan Türkçeye çevrildi; ekran görüntüleri ve arayüz adları özgün haliyle İngilizcedir. İngilizce aslı (yeni sekmede açılır) · Güncelleme:

XGRIDS Türkiye

Kurulumda ve Sahada Yanınızdayız

Atlıhan Harita; cihaz kurulumu, firmware güncellemesi, yazılım kullanımı ve saha uygulamalarında eğitim ve teknik destek verir. Sorunuzu iletin, uzmanımız size dönsün.

+90 216 546 0804