Kategori

3B ve WebGL

Üç boyutlu sahneler ve WebGL arka planları. 3 araç, 3 tanesi ölçüldü.

Hat A: 3B sahne: Three.js (saf) ↔ React Three Fiber

Tasnora hero ürün sahnesi; ui-001 ve ui-002 demoları yan yana. Ölçüm tarihi 2026-11-12T01:05:19.712Z; değerler hat ölçümünün ortancasıdır.

Bu ölçümde R3F tarafı yaklaşık 30 satır daha az araç kodu taşıyor; tek hero sahnesi (~150 satır) için bu fark küçük ölçekte kalır. Çok bileşenli React ağacı ölçülmedi; ek bilgi olarak ayrı bir deney gerekir.

Hat A ölçümleri
Araç	JS+CSS gzip	İlk anlamlı boyama	Kurulum boyutu	Lisans	Tek kişilik şirket kullanabilir mi	Hüküm	Bağlantılar
React Three Fiber	532,7 kB5 koşu	785 ms5 koşu	23,1 MB1 koşu	MIT	serbest	Hat A hükmü	Canlı demo: React Three Fiber Araç sayfası: React Three Fiber
Three.js	472,8 kB5 koşu	678 ms5 koşu	20,1 MB1 koşu	MIT	serbest	Hat A hükmü	Canlı demo: Three.js Araç sayfası: Three.js

Hat E: Arka plan / gradyan

Hat sayfası

Tasnora hero gradyanı; ShaderGradient (WebGL) ↔ CSS gradyan animasyonu. Ölçüm tarihi 2026-11-12T00:33:13.768Z; değerler hat ölçümünün ortancasıdır.

Bu görevde JS+CSS aktarımı en küçük CSS gradyan (ShaderGradient 447,1 kB, CSS gradyan 150,7 kB).

Hat E ölçümleri
Araç	JS+CSS gzip	Kurulum boyutu	Lisans	Tek kişilik şirket kullanabilir mi	Hüküm	Bağlantılar
ShaderGradient	447,1 kB5 koşu	23,4 MB1 koşu	MIT	serbest	Hat E hükmü	Canlı demo: ShaderGradient Araç sayfası: ShaderGradient
CSS gradyankarşılaştırma tarafı	150,7 kB5 koşu	0,00 MB1 koşu	yok (araçsız CSS)	bilinmiyor	Hat E hükmü	Canlı demo: CSS gradyan