Project 04 · 3D publishingProje 04 · 3D yayın

FRAMEPORT

The scene is 8.3 MB. A phone on mobile data needs less. I measure which smaller version keeps the most of the picture.Sahne 8,3 MB. Mobil veriyle açan bir telefona daha azı gerekir. Hangi küçük sürümün görüntüyü en iyi koruduğunu ölçerek seçiyorum.

StatusDurum
Working prototype, 2026 · support projectÇalışan prototip, 2026 · destek projesi
RunsÇalıştığı yer
Pipeline on the PC; viewer in the browser (WebGL2)Hat bilgisayarda; görüntüleyici tarayıcıda (WebGL2)
ToolsAraçlar
SplatTransform 3.6.4 · PlayCanvas 2.22.4
My partBenim kısmım
Checks, crop study, candidates and scoring, budgets, decision screen, browser measurements, fallback filmDenetimler, kırpma çalışması, adaylar ve puanlama, bütçeler, karar ekranı, tarayıcı ölçümleri, yedek film

The project in four partsDört bölümde proje

01

ProblemProblem

A Gaussian splat scene of 661,466 splats arrives as an 8.3 MB package. Over a 20 Mbit/s line the first frame comes after about 3.5 seconds, and every move of the camera sorts all the splats again.

661.466 splattan oluşan bir Gaussian splat sahnesi 8,3 MB'lık bir paket olarak geliyor. 20 Mbit/sn'lik bir hatta ilk kare yaklaşık 3,5 saniye sonra geliyor; kameranın her hareketinde de bütün splatlar yeniden sıralanıyor.

02

ConstraintsKısıtlar

  • Static hosting: files are fetched as they are, with no server to adapt them.
  • Quality is compared with the source at fixed cameras.
  • The scene belongs to someone else, under CC BY 4.0: credit and changes are stated.
  • A browser without WebGL2 still gets to see the space.
  • Statik barındırma: dosyalar olduğu gibi indirilir, onları uyarlayan bir sunucu yok.
  • Kalite, sabit kameralarda kaynakla karşılaştırılır.
  • Sahne başkasına ait ve CC BY 4.0 lisanslı: emeğin sahibi ve değişiklikler belirtilir.
  • WebGL2 olmayan bir tarayıcı da mekânı görebilmeli.
03

DecisionKarar

Build a grid of candidates, render each from the same three cameras as the source, score them with SSIM and PSNR, and let the device budget choose. The crop is chosen the same way, by measurement.

Bir aday ızgarası kur; her adayı kaynakla aynı üç kameradan çiz, SSIM ve PSNR ile puanla, seçimi cihaz bütçesine bırak. Kırpma da aynı yolla, ölçerek seçilir.

04

SolutionÇözüm

A pipeline checks structure, values and orientation, measures five crops, decimates the scene into ten candidates, packs them as SOG and renders every comparison image. Three profiles are published, and the screen below shows the choice change with the budget.

Bir hat yapıyı, değerleri ve yönü denetler, beş kırpmayı ölçer, sahneden on aday üretir, SOG olarak paketler ve bütün kıyas görüntülerini çizer. Üç profil yayınlanır; aşağıdaki ekran bütçeyle birlikte seçimin nasıl değiştiğini gösterir.

Working demonstrationÇalışan gösterim

Choose a device budget. See what fits, and what it costs.Bir cihaz bütçesi seç. Neyin sığdığını ve bedelini gör.

The screen recommends the package with the best quality inside the budget and compares it with the source at the same camera: drag across the picture, or switch to the error map. Click any point or row to compare another package. Live 3D opens a published profile and times its first frame in your browser.

Ekran, bütçenin içindeki en kaliteli paketi önerir ve aynı kamerada kaynakla karşılaştırır: görüntünün üzerinde sürükle ya da fark haritasına geç. Başka bir paketi karşılaştırmak için grafikteki bir noktaya veya tablodaki bir satıra tıkla. Canlı 3D, yayınlanan bir profili açar ve ilk karesinin süresini senin tarayıcında ölçer.

Scene: “SA3D_R&D_XP47” by Stephane Agullo, source (opens in a new tab), CC BY 4.0 (opens in a new tab). Changed here: rotated, far outliers cropped, decimated and re-packed. I did not capture it.Sahne: Stephane Agullo'nun “SA3D_R&D_XP47” çalışması, kaynak (yeni sekmede açılır), CC BY 4.0 (yeni sekmede açılır). Burada yapılan değişiklikler: döndürme, uzak aykırı noktaların kırpılması, seyreltme ve yeniden paketleme. Taramayı ben yapmadım.

ValidationDoğrulama

What was checked, and howNeyin, nasıl denetlendiği

TestsTestler · 12/12

  1. decision rule: best SSIM inside the budget, ties go to the smaller file, nothing fits gives nonekarar kuralı: bütçe içindeki en yüksek SSIM; eşitlikte küçük dosya; hiçbiri sığmıyorsa öneri yok1 ms
  2. decision rule: budgets from the screen are clamped and never NaNkarar kuralı: ekrandan gelen bütçeler sınırlanıyor, hiçbir zaman NaN olmuyor0 ms
  3. source checks: every column present, no non-finite values or empty rotations, floor under +Ykaynak denetimi: bütün sütunlar var, sonsuz/NaN değer ve boş dönüş yok, zemin +Y altında0 ms
  4. crop study: the chosen crop has the best mean SSIM and its counts add upkırpma çalışması: seçilen kırpma en yüksek ortalama SSIM'e sahip ve sayılar tutuyor0 ms
  5. candidates: counts follow the keep ratio; for uniform decimation size and quality fall togetheradaylar: sayılar tutma oranına uyuyor; tekdüze seyreltmede boyut ve kalite birlikte düşüyor0 ms
  6. profiles: each one is the decision rule applied to its budget, and the published file is that packageprofiller: her biri kendi bütçesine uygulanan karar kuralının sonucu; yayınlanan dosya o paketin kendisi404 ms
  7. repeatability: decimation gives the same bytes; packing gives the same picturetekrarlanabilirlik: seyreltme aynı baytları, paketleme aynı görüntüyü veriyor0 ms
  8. hard input: NaN values and empty rotations are found and removed, nothing else iszor girdi: NaN değerler ve boş dönüşler bulunup atılıyor, başka hiçbir şey atılmıyor437 ms
  9. hard input: an upside-down scene is caught by the floor checkzor girdi: baş aşağı bir sahne zemin denetiminde yakalanıyor480 ms
  10. hard input: a damaged package is refused instead of half readzor girdi: bozuk bir paket yarım okunmak yerine reddediliyor194 ms
  11. page assets: every comparison image and error map exists; the film and poster are theresayfa dosyaları: her kıyas görüntüsü ve fark haritası var; film ve kapak görseli yerinde3 ms
  12. browser measurements: every profile in every condition reached a sorted first frame; slower lines take longertarayıcı ölçümleri: her profil her koşulda sıralanmış ilk kareye ulaştı; yavaş hatlar daha uzun sürüyor0 ms

Node v24.20.0 · run 2026-10-08 · node --test lab/tests/frameport.test.mjsNode v24.20.0 · 2026-10-08 tarihinde çalıştırıldı · node --test lab/tests/frameport.test.mjs

The source, checked before anything elseHer şeyden önce denetlenen kaynak

Format, splatsBiçim, splatSOG · 661,466661.466
ColumnsSütunlar14 · none missingeksik yok
Colour bands beyond the base colourTemel rengin ötesindeki renk bantları0
NaN · infinite · empty rotationsNaN · sonsuz · boş dönüş0 · 0 · 0
Splat size, median · 99th pct · largestSplat boyutu, medyan · 99. yüzdelik · en büyük3.63,6 cm · 0.480,48 m · 1.121,12 m
Floor plane after a 180° turn about XX ekseninde 180° döndürmeden sonra zemin düzlemi0.00,0° from +Y(+Y'ye göre) · 96.196,1% aboveüstünde

Structure and NaN counts from SplatTransform 3.6.4; rotations, sizes and the floor plane (RANSAC on opaque splats, then a least-squares fit) from NumPy 2.5.3. The limit for the floor is 5°.Yapı ve NaN sayıları SplatTransform 3.6.4 ile; dönüşler, boyutlar ve zemin düzlemi (opak splatlarda RANSAC, ardından en küçük kareler uydurması) NumPy 2.5.3 ile. Zemin için sınır 5°.

Crop study at full densityTam yoğunlukta kırpma çalışması

Room box grown byOda kutusu büyütmesiRemovedAtılanCourtyardAvluLiving roomSalonClose-upYakın planMeanOrtalama
no cropkırpma yok000.99590,99590.99590,99590.99210,99210.99460,9946
0 m7,3537.3530.99400,99400.97590,97590.99710,99710.98900,9890
3 m1,9751.9750.99710,99710.99380,99380.99650,99650.99580,9958
8 m · chosenseçilen1631630.99700,99700.99610,99610.99560,99560.99620,9962
20 m660.99630,99630.99620,99620.99250,99250.99500,9950

SSIM against the unpacked source at each camera. Each variant is packed as SOG at full density, so only the crop differs.Her kamerada paketlenmemiş kaynağa karşı SSIM. Her varyant tam yoğunlukta SOG olarak paketlendi; yalnızca kırpma farklı.

The published profiles in a browserYayınlanan profiller tarayıcıda

ProfileProfilPackagePaketSizeBoyutSSIMFirst frame, localİlk kare, yerel20 Mbit/s*20 Mbit/sn*5 Mbit/s*5 Mbit/sn*CPU ×4 slower*İşlemci ×4 yavaş*SortSıralamaGPU per frameKare başına GPU
DesktopMasaüstüfull scenetam sahne8.338,33 MB0.9960,996131 ms131 ms3.53 s3,53 sn13.63 s13,63 sn303 ms303 ms3.43,4 ms0.70,7 ms
PhoneTelefon45% · uniform%45 · tekdüze3.843,84 MB0.8450,84592 ms92 ms1.68 s1,68 sn6.36 s6,36 sn232 ms232 ms1.51,5 ms0.50,5 ms
PreviewÖnizleme12% · uniform%12 · tekdüze1.041,04 MB0.5830,58359 ms59 ms536 ms536 ms1.83 s1,83 sn190 ms190 ms0.50,5 ms0.40,4 ms

Measured: Chrome 154.0.8037.98 (headless, ANGLE on Direct3D 11), NVIDIA, AMD Ryzen 5 9600X 6-Core Processor, 1280x720 at device pixel ratio 1, cache off, median of 3 runs, 2026-10-08. * Emulated with Chrome DevTools on the same PC; the GPU is never slowed. First frame runs from the request to the first frame drawn after the first sort. Sorting runs in a worker while the camera turns; GPU time comes from WebGL timer queries. Displayed frames stayed at the screen's refresh interval (2.82,8 ms). Not measured: phones, real mobile networks.Ölçüm: Chrome 154.0.8037.98 (görünmez kip, Direct3D 11 üzerinde ANGLE), NVIDIA, AMD Ryzen 5 9600X 6-Core Processor, 1280x720, piksel oranı 1, önbellek kapalı, 3 çalıştırmanın medyanı, 2026-10-08. * Aynı bilgisayarda Chrome DevTools ile emüle edildi; GPU hiç yavaşlatılmadı. İlk kare, istekten ilk sıralamadan sonra çizilen ilk kareye kadar geçen süre. Sıralama, kamera dönerken bir iş parçacığında ölçüldü; GPU süresi WebGL zaman sorgularından geliyor. Gösterilen kareler ekranın tazeleme aralığında kaldı (2.82,8 ms). Ölçülmeyen: telefonlar, gerçek mobil ağlar.

Rebuilding gives the same resultYeniden üretim aynı sonucu veriyor

  1. Decimating the same base twice: identical bytes (SHA-256).Aynı tabanı iki kez seyreltmek: aynı baytlar (SHA-256).
  2. Packing the same input twice: different bytes, identical pixels at the close-up camera (PSNR at the 99 dB cap).Aynı girdiyi iki kez paketlemek: farklı baytlar, yakın plan kamerasında aynı pikseller (PSNR 99 dB üst sınırında).

Whole pipeline: 173 s on the PC: 5 crops, 10 candidates, 3 cameras, a 180-frame film. SplatTransform 3.6.4, Node v24.20.0, Python 3.14.7, GPU renders on NVIDIA GeForce RTX 5070.Bütün hat: bilgisayarda 173 sn: 5 kırpma, 10 aday, 3 kamera, 180 karelik bir film. SplatTransform 3.6.4, Node v24.20.0, Python 3.14.7, GPU çizimleri NVIDIA GeForce RTX 5070 üzerinde.

Decision notesKarar notları

Constraint, method, resultKısıt, yöntem, sonuç

The crop that hid the windowsPencereleri gizleyen kırpma

ConstraintKısıt
A room box from the 1st to 99th percentiles removed 7,353 splats, among them the space seen through the windows. At the living-room camera SSIM fell from 0.996 to 0.976.1. ve 99. yüzdeliklerden çizilen oda kutusu 7.353 splatı attı; pencereden görünen dış alan da bunların içindeydi. Salon kamerasında SSIM 0,996'dan 0,976'ya düştü.
MethodYöntem
Five crops are packed at full density and scored. The box grown by 8 m wins: it removes 163 far outliers, and the shorter range gives the packer finer positions.Beş kırpma tam yoğunlukta paketlenip puanlanır. 8 m büyütülmüş kutu kazanır: yalnızca 163 uzak aykırı noktayı atar, kısalan aralık da paketleyiciye daha ince konum hassasiyeti bırakır.
ResultSonuç
Mean SSIM at full density: 0.9946 without a crop, 0.9890 with the room box, 0.9962 with the chosen box.Tam yoğunlukta ortalama SSIM: kırpmasız 0,9946, oda kutusuyla 0,9890, seçilen kutuyla 0,9962.

Uniform here, adaptive notBurada tekdüze seyreltme

ConstraintKısıt
The tool recommends adaptive decimation for scenes that mix large and small splats, and this scene does.Araç, büyük ve küçük splatları karıştıran sahneler için uyarlamalı seyreltmeyi öneriyor; bu sahne de öyle.
MethodYöntem
Both were measured at equal splat counts. Adaptive scored lower at 45% (0.755 against 0.845) and at 20% (0.527 against 0.688), at all three cameras, so the profiles use uniform.İkisi eşit splat sayısında ölçüldü. Uyarlamalı yöntem %45'te (0,845'e karşı 0,755) ve %20'de (0,688'e karşı 0,527), üç kameranın hepsinde daha düşük çıktı; profiller tekdüze yöntemi kullanıyor.
ResultSonuç
The phone and preview profiles are uniform packages: 45% at SSIM 0.845 and 12% at 0.583.Telefon ve önizleme profilleri tekdüze paketler: %45, SSIM 0,845 ve %12, SSIM 0,583.

One scene, two coordinate framesTek sahne, iki eksen düzeni

ConstraintKısıt
SplatTransform shows a file rotated 180° about Z; the PlayCanvas engine shows it as stored. The first comparison renders came out as blurred close-ups from inside a wall.SplatTransform bir dosyayı Z ekseninde 180° döndürülmüş gösterir; PlayCanvas motoru olduğu gibi. İlk kıyas görüntüleri bir duvarın içinden çekilmiş bulanık yakın planlar olarak çıktı.
MethodYöntem
Every output is stored in the viewer's frame, floor under +Y (checked: 0.0°). The pipeline converts only where SplatTransform needs it: crop boxes and render cameras.Her çıktı görüntüleyicinin ekseninde saklanır, zemin +Y'nin altında (denetlendi: 0,0°). Hat yalnızca SplatTransform'un gerektirdiği iki yerde dönüştürür: kırpma kutuları ve çizim kameraları.
ResultSonuç
The comparison renders and the live view show the same picture from the same camera; the floor check reads 0.0°.Kıyas çizimleri ve canlı görünüm aynı kameradan aynı görüntüyü veriyor; zemin denetimi 0,0° okuyor.

Same picture, different bytesAynı görüntü, farklı baytlar

ConstraintKısıt
Packing the same input twice gives different SOG bytes, so a checksum cannot show that a rebuild matches.Aynı girdiyi iki kez paketlemek farklı SOG baytları veriyor; bir sağlama toplamı yeniden üretilen dosyanın aynı olduğunu gösteremez.
MethodYöntem
The recipe says so, and the check compares renders instead: the two packs give identical pixels. Decimation is byte-identical and is checked by checksum.Tarif bunu belirtiyor; denetim de görüntüleri karşılaştırıyor: iki paket piksel düzeyinde aynı görüntüyü veriyor. Seyreltme baytça aynı; o da sağlama toplamıyla denetleniyor.
ResultSonuç
Rebuild check: decimation byte-identical, the repacked SOG pixel-identical at the close-up camera.Yeniden üretim denetimi: seyreltme baytça aynı, yeniden paketlenen SOG yakın plan kamerasında piksel düzeyinde aynı.

WebGL2 viewer, film as fallbackWebGL2 görüntüleyici, yedek olarak film

ConstraintKısıt
SuperSplat 3.0 (September 2026) renders only on WebGPU: current Chrome and Edge, Safari 26 or later, Firefox where it is enabled. A visitor may not have it.SuperSplat 3.0 (Eylül 2026) yalnızca WebGPU ile çiziyor: güncel Chrome ve Edge, Safari 26 ve sonrası, WebGPU'nun açık olduğu Firefox. Ziyaretçide olmayabilir.
MethodYöntem
The page viewer uses WebGL2 through the PlayCanvas engine. Without WebGL2 it plays a 1.5 MB film rendered from the desktop package, with a JPEG poster.Sayfadaki görüntüleyici PlayCanvas motoru üzerinden WebGL2 kullanıyor. WebGL2 yoksa masaüstü paketinden çizilmiş 1,5 MB'lık bir film, JPEG kapak görseliyle oynatılıyor.
ResultSonuç
Tested in Chrome with WebGL2 switched off: the film and its poster take the viewer's place.WebGL2'si kapatılmış Chrome'da denendi: görüntüleyicinin yerini film ve kapak görseli alıyor.

Targets and measurements apartHedef ve ölçüm ayrı

ConstraintKısıt
Device budgets are assumptions, and no phone was measured.Cihaz bütçeleri varsayımdır ve hiçbir telefonda ölçüm yapılmadı.
MethodYöntem
Budgets are labelled as targets and can be changed on screen. Timings come from Chrome on one PC; network and CPU limits are DevTools emulation and are marked; the download time is a calculation.Bütçeler hedef olarak etiketli ve ekranda değiştirilebilir. Süreler tek bir bilgisayardaki Chrome'dan geliyor; ağ ve işlemci sınırları DevTools emülasyonu olarak işaretli; indirme süresi bir hesap.
ResultSonuç
Every number on the decision screen says whether it is measured, calculated or emulated. Phone measurements remain to be done.Karar ekranındaki her sayı ölçüm, hesap ya da emülasyon olduğunu söylüyor. Telefon ölçümleri henüz yapılmadı.

Built on, and what I addedÜzerine kurulduğu altyapı ve benim eklediklerim

Built onAltyapı

  • SplatTransform 3.6.4Reads and writes PLY and SOG, decimates, filters, renders still images on the GPU. PlayCanvas, MIT.PLY ve SOG okur ve yazar, seyreltir, filtreler, GPU'da sabit görüntü çizer. PlayCanvas, MIT.
  • PlayCanvas 2.22.4The engine behind the live view: splat rendering and the sorting worker. MIT.Canlı görünümün motoru: splat çizimi ve sıralama iş parçacığı. MIT.
  • Source sceneKaynak sahne“SA3D_R&D_XP47” by Stephane Agullo (sa3d.fr), CC BY 4.0.Stephane Agullo'nun (sa3d.fr) “SA3D_R&D_XP47” çalışması, CC BY 4.0.
  • NumPy · PillowReading PLY files, plane fitting, image metrics.PLY okuma, düzlem uydurma, görüntü ölçütleri.

Added in FRAMEPORTFRAMEPORT'ta eklenenler

  • ChecksDenetimlerStructure and values, floor plane against +Y, crop counts cross-checked in Python.Yapı ve değerler, +Y'ye göre zemin düzlemi, kırpma sayılarının Python ile çapraz denetimi.
  • Measured choicesÖlçülen seçimlerCrop study, ten candidates, SSIM and PSNR at fixed cameras, error maps, budget rule.Kırpma çalışması, on aday, sabit kameralarda SSIM ve PSNR, fark haritaları, bütçe kuralı.
  • Decision screenKarar ekranıBudgets, before and after, size against quality, live 3D on request, film fallback.Bütçeler, önce ve sonra, boyuta karşı kalite, istek üzerine canlı 3D, yedek film.
  • MeasurementsÖlçümlerFirst frame, sorting and GPU time in Chrome, with emulated network and CPU limits marked.Chrome'da ilk kare, sıralama ve GPU süresi; emüle edilmiş ağ ve işlemci sınırları işaretli.