Skip to content

Teknologi Dunia Terbuka 3D di Browser untuk Dunia Kreator Multipemain

Kami ingin menghadirkan para kreator kami dalam sebuah dunia terbuka bersama. Bukan lobi. Bukan galeri. Melainkan ruang 3D hidup tempat orang dapat menjelajah, membangun, dan secara tak sengaja menemukan karya satu sama lain. Sesuatu yang dapat dimuat di tab browser dan terasa seperti tempat yang layak dihuni.

Itu masalah yang sulit. Skyrim dan The Witcher 3 menghabiskan ratusan juta dolar untuk membangun dunia mereka, dan keduanya masih didistribusikan untuk perangkat keras khusus dengan data puluhan gigabita di penyimpanan. Target kami adalah sebuah tab browser, status bersama untuk ratusan pemain, dan dunia yang benar-benar dapat dibentuk ulang oleh para kreator.

Panduan ini mendokumentasikan temuan kami dari riset teknologi tersebut. Apa yang mungkin dilakukan saat ini, apa yang akan segera hadir, dan arsitektur seperti apa yang dapat mewujudkannya.

Pelajaran yang Dapat Kita Ambil dari Skyrim dan The Witcher

Sebelum memilih teknologi, ada baiknya memahami cara kerja dua dunia terbuka paling sukses. Teknik yang mereka gunakan ternyata sangat sesuai dengan keterbatasan browser.

Sistem Sel Skyrim

Dunia terbuka Skyrim melakukan streaming kisi sel 5x5 di sekitar pemain. Pegunungan di kejauhan merupakan penyaru beresolusi rendah. Anda tidak pernah menyadarinya.

Skyrim membagi dunianya menjadi kisi berisi 57x37 sel eksterior, masing-masing berukuran 4096x4096 unit gim (sekitar 59 meter). Mesin gim memuat kisi 5x5 sel di sekitar pemain setiap saat. Saat Anda berjalan, sel di sisi belakang dikeluarkan dari memori sementara sel di sisi depan dimuat melalui streaming. Ruang interior (ruang bawah tanah, bangunan) merupakan ruang dunia terpisah yang dimuat melalui pemicu pintu.

Cara ini dapat diterapkan secara langsung pada dunia di browser. Anda tidak memuat seluruh peta. Anda memuat area di sekitar pemain dan mengganti potongan dunia saat mereka bergerak. Wawasan utamanya: Skyrim tidak pernah membiarkan Anda melihat seluruh detail medan yang jauh. Gim ini menggunakan pendekatan multiresolusi.

Tingkatan LOD (Level of Detail/Tingkat Detail) di Skyrim:

  • Detail penuh dalam jarak 1-2 sel (area terdekat pemain)
  • Mesh yang disederhanakan pada jarak menengah (objek kehilangan geometri kecil)
  • Penyaru billboard untuk pohon dan batu di luar jarak menengah
  • LOD medan menggunakan mesh beresolusi rendah yang telah dipanggang untuk lanskap jauh
  • Jarak pemudaran objek disesuaikan per objek (rumput memudar lebih dahulu, bangunan paling akhir)

Lanskap Skyrim menggunakan medan berbasis heightmap dengan petak 32x32 verteks per sel. Setiap petak dapat memiliki tekstur berbeda yang dipadukan dengan alpha map. Data seperti ini ringan untuk disimpan dan dirender. Data medan satu sel dihitung dalam kilobita, bukan megabita.

Yang dapat kita terapkan: Streaming berbasis potongan, medan heightmap, LOD agresif, pemisahan interior/eksterior, serta gagasan bahwa medan yang jauh tidak perlu akurat secara geometris—cukup meyakinkan secara visual.

Arsitektur Streaming The Witcher 3

Dunia The Witcher 3 seluas 136 km2 menggunakan streaming yang sadar konten. Pohon yang berjarak lebih dari 200 m merupakan penyaru datar. Bangunan dimuat melalui streaming secara terpisah dari medan.

Dunia The Witcher 3 lebih luas daripada Skyrim (sekitar 136 km2 di seluruh wilayah) dan menggunakan sistem streaming yang lebih canggih. CD Projekt RED membangun mesin khusus (REDengine 3) yang membagi dunia menjadi sektor-sektor streaming, bukan kisi yang kaku.

Setiap sektor memuat hierarki lapisan konten:

  • Medan dimuat melalui streaming sebagai petak dengan 4 tingkat LOD
  • Vegetasi menggunakan instancing GPU dengan culling berbasis jarak
  • Geometri statis (bangunan, batu) dimuat melalui streaming secara terpisah dari medan
  • Objek alur permainan (NPC, item, pemicu) dimuat berdasarkan status misi dan jarak

Renderer menggunakan deferred shading dengan material berbasis fisika. Salah satu trik yang sangat relevan: The Witcher 3 menggunakan penyaru secara agresif. Pohon yang berjarak 200 meter bukanlah model 3D dengan cabang dan daun. Pohon itu berupa bidang segi empat bertekstur datar yang selalu menghadap kamera. Mesin gim melakukan pra-render penyaru ini dari beberapa sudut, lalu menggantinya saat kamera bergerak. Anda tidak pernah menyadarinya karena objek tersebut berada cukup jauh.

Komposisi dunia: Dunia terbuka The Witcher 3 dibangun dalam sejumlah lapisan oleh tim-tim terpisah yang bekerja secara bersamaan. Tim medan membentuk lanskap. Tim seni lingkungan menempatkan struktur. Tim misi menghubungkan pemicu dan jalur NPC. Sistem komposisi berlapis ini memungkinkan tim besar bekerja tanpa saling mengganggu.

Yang dapat kita terapkan: Komposisi dunia berlapis (sangat penting untuk platform kreator), rendering penyaru untuk objek jauh, deferred rendering untuk banyak sumber cahaya, serta wawasan bahwa streaming harus sadar konten (jangan muat interior yang tidak dapat dilihat, jangan munculkan NPC yang tidak berada di dekat pemain).

Mesin Kimia Breath of the Wild

BotW berjalan pada perangkat keras kelas tablet dan terlihat memukau. Gaya cel-shaded, kabut jarak bergaya cat air, serta interaksi sistemis alih-alih konten berskrip. Standar emas untuk dunia terbuka bergaya.

Pendekatan Nintendo terhadap desain dunia terbuka membalik formula pada umumnya. Alih-alih memenuhi dunia dengan konten berskrip, mereka membangun aturan sistemis dan membiarkan pemain menemukan perilaku emergen. Api menjalar ke rumput. Logam menghantarkan listrik saat badai petir. Angin membawa objek. Segala sesuatu berinteraksi dengan yang lain melalui lapisan fisika/kimia yang konsisten.

Hal ini penting bagi dunia kreator karena menunjukkan bahwa dunia itu sendiri dapat lebih menarik daripada objek mana pun yang ditempatkan di dalamnya. Jika kreator dapat menentukan properti material dan aturan interaksi (bukan sekadar menempatkan mesh statis), dunia akan memperoleh perilaku emergen yang membuat penjelajahan tetap menarik, bahkan di area yang tidak dirancang secara khusus oleh siapa pun.

Pelajaran teknis dari BotW:

  • Jumlah poligon dan resolusinya relatif rendah (900p saat Switch terpasang ke dok). Tampilan cel-shaded yang bergaya menyamarkan fidelitas rendah tersebut. Dunia di browser saat ini dapat mencapai kualitas visual serupa.
  • Rendering jarak jauh menggunakan kabut toon-shaded yang memudar menjadi skybox bergaya cat air. Murah untuk dirender, tetapi indah dalam praktiknya. Perspektif atmosfer seperti ini pada dasarnya tidak membutuhkan biaya tambahan dalam fragment shader.
  • Luas dunianya sekitar 84 km2, tetapi renggang. Sebagian besar peta berupa medan yang dapat dilintasi dengan titik-titik menarik yang tersebar di seluruh wilayah. Konten padat dikhususkan untuk kota dan kuil. Pendekatan "renggang tetapi menarik" ini secara drastis mengurangi kebutuhan aset dibandingkan dengan Novigrad di The Witcher 3 yang padat penduduk.
  • Objek fisika memiliki tag material (kayu, logam, makanan, bahan peledak) yang menentukan interaksinya. Jumlah aturan sebenarnya sedikit (mungkin 20-30 jenis interaksi), tetapi semuanya berpadu dengan cara yang terasa tak terbatas.

Pelapisan Dunia GTA V

Los Santos di GTA V terasa hidup berkat sistem ambien berlapis: lalu lintas, pejalan kaki, waktu, dan cuaca. Bangunan di kejauhan merupakan foto komposit, bukan model 3D.

Pendekatan Rockstar terhadap Los Santos mengajarkan pelajaran yang berbeda. Dunia GTA V terasa hidup berkat sistem ambien berlapis, bukan karena setiap NPC memiliki misi.

Kota tersebut memiliki sistem lalu lintas yang menyimulasikan ratusan kendaraan di jaringan jalan. Pejalan kaki menyusuri rute, bereaksi terhadap pemain, dan berinteraksi satu sama lain. Waktu mengubah kepadatan populasi, jenis NPC yang hadir, dan aktivitas ambien. Cuaca memengaruhi fisika berkendara dan perilaku NPC.

Bagi dunia kreator, wawasannya adalah bahwa kehidupan ambien menentukan perbedaan antara dunia yang terasa seperti museum dan dunia yang terasa seperti tempat sungguhan. Bahkan perilaku sederhana (burung yang terbang di atas kepala, ombak yang menyapu pantai, NPC yang berjalan di antara bangunan) menciptakan ilusi dunia yang hidup.

Pelajaran teknis dari GTA V:

  • Luas petanya 75 km2 dan menggunakan LOD agresif yang dipadukan dengan sistem streaming berbasis kecepatan (berkendara cepat akan memuat area lebih jauh di depan daripada berjalan kaki).
  • GTA Online menempatkan 30 pemain secara bersamaan di dunia ini. Bahkan dengan 30 pemain, Rockstar menyadari bahwa mereka memerlukan pengelolaan relevansi spasial: Anda menerima pembaruan mendetail tentang pemain di sekitar dan pembaruan yang lebih jarang tentang pemain jauh. Prinsip yang sama berlaku untuk target kami yang mencapai 200 pemain.
  • Pipeline aset GTA V merupakan salah satu yang paling efisien yang pernah dibuat. Seluruh gim hanya berukuran sekitar 80 GB berkat kompresi tekstur ekstrem, penggunaan bersama mesh, dan detail prosedural. Interior bangunannya banyak menggunakan kembali komponen modular.
  • Gim ini menggunakan sistem penyaru canggih yang membuat bangunan jauh sebenarnya berupa foto-foto datar yang dikomposisikan bersama. Pemain tidak pernah menyadarinya karena jarak transisi disesuaikan dengan sudut pandang tertentu.

Dunia Terbuka Tanpa Jeda Elden Ring

Peta Elden Ring seluas 79 km2 memadukan medan terbuka yang renggang dengan ruang bawah tanah padat buatan tangan. Aset lingkungan yang sama muncul di mana-mana dalam susunan berbeda. Pengulangan tidak terasa ketika komposisi dan pencahayaannya bervariasi.

FromSoftware membangun Elden Ring dengan mesin yang sama seperti Dark Souls, tetapi memperluas skalanya menjadi dunia terbuka. Hasilnya menarik karena menunjukkan cara tim yang relatif kecil (dibandingkan dengan Rockstar atau CD Projekt) dapat membangun dunia terbuka yang luas.

Triknya adalah variasi kepadatan. Peta Elden Ring sangat luas (sekitar 79 km2), tetapi sebagian besar wilayahnya berupa medan terbuka dengan musuh dan titik menarik yang tersebar. Konten padat buatan tangan (Legacy Dungeon seperti Stormveil Castle) ditanamkan dalam dunia terbuka dan menggunakan pemisahan interior/eksterior yang sama seperti Skyrim.

Pelajaran teknis dari Elden Ring:

  • Dunia dimuat melalui streaming dalam petak-petak besar. Saat menunggang kuda, Anda dapat melihat sangat jauh, tetapi medan di kejauhan sangat disederhanakan. Dari dekat, detailnya sebanding dengan Dark Souls 3.
  • Layar pemuatan hanya muncul ketika melakukan perjalanan cepat atau memasuki ruang bawah tanah tertentu. Dunia terbukanya sendiri dimuat melalui streaming tanpa gangguan.
  • Gim ini menggunakan kembali aset lingkungan secara ekstensif. Model pohon, formasi batu, dan komponen reruntuhan yang sama muncul di seluruh peta dalam susunan berbeda. Dengan variasi susunan dan pencahayaan yang cukup, pengulangannya tidak terasa. Hal ini dapat diterapkan secara langsung pada dunia kreator, tempat pustaka komponen modular dapat menghasilkan variasi tanpa batas.
  • Mode multipemainnya berbasis sesi (memanggil pemain lain ke dunia Anda), bukan persisten. Namun, fitur asinkron (pesan, noda darah, dan bayangan pemain lain) menciptakan kesan hidup bersama tanpa beban jaringan dari server persisten. Fitur multipemain ambien seperti ini dapat ditambahkan ke dunia browser dengan biaya rendah.

No Man's Sky: Semuanya Prosedural

18 kuintiliun planet dihasilkan dari seed bersama. Setiap pemain melihat alam semesta yang sama tanpa menyimpannya di server. Data pembangunan markas sangat ringkas: ID komponen beserta transformasinya.

No Man's Sky merupakan contoh ekstrem generasi prosedural. Ada 18 kuintiliun planet yang dihasilkan dari seed bersama, sehingga setiap pemain melihat alam semesta yang sama tanpa perlu menyimpan semua itu di server.

Pipeline generasinya bekerja secara bertahap: seed tingkat galaksi menentukan posisi bintang, seed bintang menentukan jumlah dan jenis planet, sedangkan seed planet menggerakkan pembuatan medan (noise multioktaf), penetapan bioma, spesies flora/fauna, palet warna, dan distribusi sumber daya. Semuanya dihitung secara deterministik dari seed, sehingga dua pemain yang mengunjungi koordinat yang sama akan melihat planet yang sama tanpa bertukar data planet apa pun. Pelajaran teknis dari No Man's Sky:

  • Pembuatan medan menggunakan marching cubes berbasis voxel dengan serangkaian fungsi noise. Pendekatan ini memungkinkan gua, tonjolan, dan pulau terapung yang tidak dapat direpresentasikan oleh medan berbasis heightmap. Konsekuensinya adalah biaya komputasi per chunk yang lebih tinggi, tetapi hasilnya berupa medan yang lebih menarik secara visual.
  • Sistem pembangunan markasnya paling mendekati apa yang kami bayangkan. Pemain menempatkan struktur yang tersimpan secara persisten di server dan terlihat oleh pemain lain. Data markasnya ringkas (daftar bagian beserta posisi dan rotasinya) dan dialirkan sesuai permintaan saat seseorang mengunjungi planet tersebut.
  • Gim ini awalnya dikritik karena kontennya repetitif meskipun memiliki variasi tak terbatas. Pembuatan berbasis seed dapat menghasilkan medan tak terbatas, tetapi hanya sedikit kejutan. Pelajarannya: pembuatan prosedural cocok untuk menyediakan kanvas, tetapi konten yang ditempatkan kreatorlah yang membuat suatu tempat terasa dirancang dan memiliki tujuan.
  • Hello Games menambahkan multipemain bertahun-tahun setelah peluncuran. Hingga 32 pemain berbagi satu sesi dengan fitur pembangunan dan penjelajahan penuh. Model jaringannya sederhana: satu pemain menjadi host, sementara yang lain terhubung. Untuk dunia browser dengan status persisten, model server-authoritative lebih cocok, tetapi No Man's Sky membuktikan bahwa dunia prosedural bersama dapat diwujudkan.

Minecraft: Cetak Biru Dunia Kreator

300 juta kopi terjual. Tekstur piksel 16x16. Medan dapat diedit sepenuhnya. Dibuat tanpa batas. Multipemain. Referensi terpenting untuk dunia kreator. Klona berbasis browser membuktikan konsep ini berfungsi di WebGL.

Minecraft adalah acuan terpenting bagi apa yang sedang kami bangun, bahkan lebih penting daripada gim AAA mana pun dengan grafis canggih. 300 juta kopi terjual. Dunianya dibuat tanpa batas, dapat dihancurkan sepenuhnya, dan mendukung multipemain. Kreator tidak sekadar menempatkan objek di Minecraft. Mereka membentuk ulang medannya sendiri.

Pelajaran teknis dari Minecraft:

  • Dunia dibagi menjadi chunk blok berukuran 16x16x384. Hanya chunk di dekat pemain yang dimuat (jarak render dapat dikonfigurasi). Ini adalah pola streaming chunk yang sama seperti Skyrim, tetapi dengan medan yang dapat diedit sepenuhnya.
  • Setiap chunk disimpan sebagai array ID blok yang dikompresi dengan palet. Chunk yang hanya memiliki 5 jenis blok berbeda menyimpan indeks palet 4-bit per blok, bukan ID blok lengkap. Ini membuat data chunk sangat ringkas (biasanya 10–50 KB per chunk setelah kompresi).
  • Protokol multipemain Minecraft terdokumentasi dengan baik dan relatif sederhana. Server mengirimkan data chunk saat pemain bergerak. Perubahan blok disiarkan sebagai pembaruan delta kecil (posisi + jenis blok baru). Inilah model yang akan kami gunakan untuk suntingan kreator.
  • Gim ini berjalan di Java dan kini memiliki Bedrock Edition dalam C++. Terdapat klona Minecraft berbasis browser (ClassiCube, eaglercraft) yang membuktikan bahwa konsep intinya berfungsi di WebGL. Klona tersebut biasanya mampu menangani jarak render 8–12 chunk pada 60fps, yang menghasilkan jarak pandang sekitar 200–400 meter.
  • Ekosistem modding Minecraft adalah keunggulan kompetitifnya yang sesungguhnya. Mod menambahkan blok, entitas, bioma, dan sistem permainan baru. Untuk dunia kreator, hal ini menunjukkan bahwa ekstensibilitas sama pentingnya dengan pengalaman dasar. Jika kreator dapat menentukan jenis interaksi baru (bukan sekadar menempatkan objek), dunia akan semakin kaya seiring waktu.
  • Redstone (sistem perkabelan dalam gim Minecraft) menunjukkan bahwa kreator akan membangun sistem kompleks jika diberi komponen dasar yang sederhana dan dapat dirangkai. Gerbang logika, pertanian otomatis, kalkulator. Kumpulan aturan sederhana menghasilkan kompleksitas luar biasa. Ini adalah pelajaran yang sama dengan mesin kimia BotW.

Pola Umum di Berbagai Dunia Terbuka AAA

Jika melihat semua judul ini, pola yang sama terus bermunculan:

Partisi spasial digunakan secara universal. Baik berupa cell (Bethesda), sector (CD Projekt), chunk (Mojang/Rockstar), maupun tile (FromSoftware), setiap dunia terbuka membagi ruang menjadi unit-unit yang dapat dimuat. Tidak ada engine yang mencoba menyimpan seluruh dunia di dalam memori.

Segalanya memiliki banyak resolusi. Medan, mesh, tekstur, bahkan audio memiliki beberapa tingkat kualitas. Resolusi yang diperoleh bergantung pada seberapa dekat jaraknya dan seberapa penting objek tersebut.

Occlusion culling lebih penting daripada throughput segitiga mentah. Tidak merender apa yang tak terlihat menghemat lebih banyak performa dibandingkan mengoptimalkan apa yang terlihat. Skyrim menggunakan sistem sederhana berbasis jarak. The Witcher 3 menggunakan software occlusion dengan occluder besar (bangunan, tebing). Engine modern seperti Nanite milik UE5 mengembangkan pendekatan ini lebih jauh dengan hardware occlusion query.

Pemuatan asinkron menyamarkan transisi. Gim-gim ini tidak menampilkan layar pemuatan untuk dunia terbuka (hanya untuk perjalanan cepat atau transisi ke interior). Konten dimuat melalui thread latar belakang, didekompresi secara paralel, lalu konten baru dimasukkan secara bertahap.

Arahan artistik lebih penting daripada jumlah poligon. Skyrim diluncurkan pada 2011 dengan grafis yang bahkan saat itu tergolong sederhana. BotW berjalan pada cip kelas tablet dan tetap terlihat indah. Minecraft menggunakan tekstur piksel 16x16 dan merupakan salah satu gim paling mudah dikenali secara visual sepanjang masa. Bagi dunia browser, hal ini sangat penting. Gaya visual yang terarah dengan fidelitas lebih rendah akan selalu mengungguli dunia yang maju secara teknis tetapi hambar secara artistik.

Desain sistemik mengungguli konten berskrip. Mesin kimia BotW, interaksi blok Minecraft, dan sistem lalu lintas GTA V sama-sama menciptakan perilaku emergen dari aturan sederhana. Pendekatan ini lebih murah untuk dibuat, lebih murah untuk dijalankan, dan menghasilkan lebih banyak cerita pemain dibandingkan rangkaian skrip buatan tangan. Untuk dunia kreator, desain sistemik berarti dunia tetap menarik, bahkan di area yang tidak pernah dirancang secara khusus oleh siapa pun.

Konten yang ditempatkan kreator membutuhkan persistensi dan visibilitas. Markas Minecraft, markas No Man's Sky, dan properti GTA Online tetap tersimpan lintas sesi serta terlihat oleh pemain lain. Model data untuk konten kreator selalu ringkas (ID bagian + transform), sementara representasi visualnya kaya (klien mengembangkan data tersebut menjadi adegan 3D lengkap).

Rendering: Apa yang Sebenarnya Dapat Dilakukan Browser?

Three.js

Three.js adalah fondasinya. Three.js memiliki komunitas terbesar (lebih dari 100 ribu bintang GitHub), contoh terbanyak, dan kompatibilitas terluas. Library ini mengabstraksikan WebGL 2 dan memiliki dukungan WebGPU eksperimental melalui WebGPURenderer.

Untuk dunia terbuka, Three.js menyediakan:

  • Rendering instans untuk vegetasi, bebatuan, dan geometri berulang (InstancedMesh)
  • Sistem LOD bawaan (THREE.LOD menukar mesh berdasarkan jarak)
  • Frustum culling otomatis per objek
  • Medan melalui BufferGeometry khusus atau PlaneGeometry berbasis heightmap
  • Material PBR melalui MeshStandardMaterial dan MeshPhysicalMaterial
  • Pascapemrosesan melalui EffectComposer (bloom, SSAO, tone mapping)
  • Shadow map, dengan cascaded shadow mapping yang dapat diterapkan melalui kode khusus
  • glTF/GLB sebagai format aset utama (ringkas dan siap untuk GPU)

Three.js juga memiliki ekosistem aktif berisi alat-alat yang penting bagi dunia terbuka. three-mesh-bvh mempercepat raycasting dan kueri spasial pada mesh kompleks. postprocessing (oleh vanruesc) menyediakan rangkaian pascapemrosesan yang lebih berperforma daripada rangkaian bawaan Three. three-gpu-pathtracing memungkinkan rendering berkualitas referensi.

Keterbatasan untuk dunia terbuka: Three.js tidak memiliki scene graph bawaan yang menangani streaming, pengelolaan LOD, atau partisi spasial dalam skala besar. Anda harus membuatnya sendiri. Tidak ada entity component system (ECS), fisika, atau sistem medan bawaan. Three.js adalah renderer, bukan engine. Hal ini sebenarnya menjadi keunggulan bagi dunia terbuka khusus karena Anda dapat mengendalikan tata letak memori dan strategi pemuatan, tetapi konsekuensinya adalah lebih banyak pekerjaan di awal.

typescript
const lod = new THREE.LOD();
lod.addLevel(highDetailMesh, 0);
lod.addLevel(mediumDetailMesh, 50);
lod.addLevel(lowDetailMesh, 200);
lod.addLevel(impostorSprite, 500);
scene.add(lod);

Babylon.js

Babylon.js adalah kandidat utama lainnya. Dengan dukungan Microsoft, Babylon.js memiliki fitur bawaan yang lebih mendalam daripada Three.js untuk kebutuhan spesifik dunia terbuka.

Fitur bawaan yang relevan:

  • Partisi adegan berbasis octree untuk culling adegan besar secara efisien
  • Solid Particle System untuk rendering instans dalam jumlah masif
  • Medan dari heightmap dengan LOD dan multi-texture splatting bawaan
  • Node Material Editor untuk pembuatan shader secara visual
  • Dukungan WebGPU (lebih matang daripada Three.js karena Babylon berinvestasi lebih awal)
  • Integrasi fisika Havok (dikompilasi ke Wasm dan berkualitas produksi)
  • Streaming glTF dengan pemuatan progresif

Ekstensi DynamicTerrain milik Babylon menghasilkan chunk medan secara dinamis dari data heightmap, menangani LOD secara otomatis, dan mendukung texture splatting. Fitur ini jauh lebih mendekati pendekatan Skyrim dibandingkan apa pun yang disediakan Three.js secara langsung.

typescript
const terrain = new BABYLON.DynamicTerrain("terrain", {
  terrainSub: 100,
  mapData: heightmapData,
  mapSubX: 1000,
  mapSubZ: 1000,
}, scene);
terrain.LODLimits = [4, 3, 2, 1];

Komprominya: Babylon.js adalah library yang lebih besar (build lengkapnya sekitar 1–2 MB setelah minifikasi, dibandingkan Three.js yang sekitar 600 KB). Namun, untuk dunia terbuka, kemungkinan besar Anda akan menambahkan cukup banyak kode khusus ke Three.js sehingga perbedaan ukurannya menjadi tidak berarti. Babylon juga memiliki sistem Node Material, inspector, dan alat pengembang sendiri yang mempercepat iterasi.

Babylon.js 8.0 (dirilis Maret 2025) makin memperkuat posisinya sebagai pilihan untuk inti engine di sini. Semua shader inti engine kini tersedia dalam GLSL dan WGSL, sehingga WebGPU dapat digunakan tanpa lapisan konversi dan ukuran bundel WebGPU menjadi sekitar setengah dari sebelumnya. Rilis yang sama menghadirkan pengontrol karakter Havok lengkap ke dalam engine, area light, engine audio yang dibangun ulang, serta peningkatan Gaussian splatting (format SPZ dan PLY terkompresi, spherical harmonics, serta penggunaan memori/CPU yang lebih rendah).

PlayCanvas

PlayCanvas patut disebutkan karena merupakan engine 3D yang sejak awal dirancang untuk web dan paling terbukti dalam produksi. Snap, Facebook, dan banyak klien periklanan telah meluncurkan pengalaman 3D kompleks dengannya. Engine ini berukuran sekitar 1 MB, dimuat dengan cepat, dan editor cloud-nya memungkinkan pembangunan dunia secara kolaboratif.

Khusus untuk dunia terbuka, PlayCanvas menawarkan batch group untuk mengoptimalkan draw call, lightmapper bawaan, dan dukungan Gaussian splatting (relevan untuk lingkungan dunia nyata yang direkam melalui fotogrametri). Runtime-nya ringkas dan dioptimalkan dengan baik untuk browser seluler.

WebGPU: Pembuka Potensi Performa

WebGPU mengubah perhitungan untuk dunia terbuka berbasis browser. Dua fitur yang paling penting:

Compute shader memungkinkan pembuatan medan, penempatan vegetasi, simulasi partikel, bahkan fisika sederhana di sisi GPU. Dalam dunia WebGL, semua ini berjalan pada CPU melalui JavaScript. Dengan WebGPU, Anda dapat menghasilkan petak medan sepenuhnya di GPU, menghitung transisi LOD di GPU, dan menjalankan tahap culling di GPU. Hal ini membebaskan CPU untuk jaringan, logika gim, dan streaming konten.

Rendering tidak langsung memungkinkan GPU menentukan apa yang perlu digambar berdasarkan output compute shader. Anda mengirimkan satu draw call, lalu GPU menentukan jumlah instans yang harus dirender untuk setiap tingkat LOD berdasarkan jarak. Beginilah engine modern menangani jutaan helai rumput atau pohon. Tanpa rendering tidak langsung (yang tidak didukung WebGL), CPU harus mengurutkan dan mengelompokkan semuanya, sehingga menjadi hambatan pada adegan yang padat.

WebGPU kini tersedia di setiap browser utama. Chrome dan Edge telah mendukungnya sejak versi 113, Firefox menambahkannya di Windows (141) dan macOS dengan Apple Silicon (145), sedangkan Safari 26 menghadirkannya ke macOS, iOS, iPadOS, dan visionOS pada akhir 2025. Hal ini membuat dukungan globalnya mencapai sekitar 82%, termasuk perangkat seluler (Chrome untuk Android dan Samsung Internet juga menyediakannya). Anda tetap perlu menyediakan fallback WebGL 2 untuk browser dan perangkat lama yang belum mengaktifkan WebGPU, tetapi kesenjangannya telah menyusut dengan cepat.

wgsl
@compute @workgroup_size(64)
fn generateTerrain(@builtin(global_invocation_id) id: vec3<u32>) {
    let worldPos = vec2<f32>(f32(id.x), f32(id.y)) * cellSize + worldOffset;
    let height = fbmNoise(worldPos, octaves, persistence);
    heightmap[id.x + id.y * width] = height;
}

Stack Rendering yang Direkomendasikan

Untuk dunia terbuka berbasis browser yang menargetkan kreator di desktop:

Utama: Three.js atau Babylon.js dengan renderer WebGPU jika tersedia dan fallback WebGL 2. Babylon memiliki komponen dasar dunia terbuka bawaan yang lebih kuat. Three.js memiliki komunitas lebih besar dan fleksibilitas lebih tinggi.

Pilihan kami: Babylon.js sebagai inti engine karena memiliki LOD medan bawaan, octree culling, fisika Havok (Wasm), dan dukungan WebGPU yang matang. Gunakan alat dari ekosistem Three.js jika Babylon tidak menyediakannya (misalnya mesh BVH untuk kueri spasial). Bungkus semuanya dalam lapisan streaming dunia khusus.

Arsitektur Streaming Dunia

Inilah bagian tersulitnya. Tab browser mendapat sekitar 2–4 GB memori di desktop (batas yang diberlakukan browser), sekitar 1 GB di perangkat seluler, dan tidak memiliki akses langsung ke disk. Semuanya dikirim melalui jaringan. Anda membutuhkan arsitektur yang menjaga bagian dunia yang terlihat tetap berada dalam memori sambil mengalirkan konten sedikit lebih awal ke arah pergerakan pemain.

Grid Dunia Berbasis Chunk

Seperti sistem cell Skyrim, bagi dunia menjadi grid chunk reguler. Setiap chunk merupakan unit independen yang dapat dimuat, dirender, dan dikeluarkan secara terpisah.

Ukuran chunk sangat penting. Terlalu kecil dan Anda akan terus memuat serta mengeluarkan data dengan overhead tinggi. Terlalu besar dan setiap chunk membutuhkan waktu terlalu lama untuk diunduh. Untuk dunia browser dengan koneksi broadband pada umumnya:

  • Chunk 64x64 meter pada permukaan tanah
  • Setiap chunk berisi: petak heightmap (2–4 KB), texture splat map (16–32 KB terkompresi), mesh statis sebagai referensi instans (1–50 KB data instans), objek yang ditempatkan kreator sebagai manifest (1–10 KB)
  • Radius pemuatan: 5x5 chunk pada detail penuh (jarak pandang 320 m), 9x9 pada LOD menengah, 17x17 untuk medan saja
  • Target: data detail penuh setiap chunk di bawah 200 KB, sehingga area 5x5 berukuran kurang dari 5 MB

Pipeline Pemuatan Progresif

Jangan memuat semua data tentang suatu chunk sekaligus. Gunakan antrean prioritas:

  1. Geometri medan terlebih dahulu (hanya peta ketinggian, 2-4 KB per chunk). Pemain melihat permukaan tanah dalam 100 md.
  2. Tekstur medan (splat map, mulai dari resolusi rendah lalu ditingkatkan). Permukaan tanah memiliki warna dalam 200 md.
  3. Struktur utama (bangunan, batu besar). Siluet muncul dalam 500 md.
  4. Objek detail (vegetasi, properti kecil, item kreator). Dunia terisi dalam 1-2 detik.
  5. Tekstur resolusi tinggi ditingkatkan terakhir. Tak seorang pun menyadari jika tekstur bangunan yang jauh memerlukan satu detik tambahan.

Ini sesuai dengan cara kerja mata manusia. Kita menyadari ketiadaan permukaan tanah dan struktur besar. Kita tidak menyadari ketiadaan rumput.

Manajemen Memori

Memori peramban terbatas dan pengumpul sampah adalah musuh Anda. Satu jeda GC dapat menurunkan performa dari 60 fps menjadi 10 fps selama satu frame.

Object pooling wajib digunakan. Alokasikan pool terlebih dahulu untuk objek umum (pohon, batu, petak rumput), lalu gunakan kembali saat chunk dimuat/dibongkar. Jangan pernah membuat instans THREE.Mesh atau BABYLON.Mesh baru di hot path. Sebagai gantinya, tukar referensi geometri dan material pada objek yang berada dalam pool.

Atlas tekstur mengurangi draw call sekaligus fragmentasi memori. Kemas semua tekstur medan ke dalam beberapa atlas besar. Kemas tekstur unggahan kreator ke dalam atlas per chunk di server, lalu streaming sebagai satu gambar.

Kompresi geometri dengan Draco atau Meshopt mengurangi ukuran unduhan hingga 5-10 kali lipat, dan dekompresi berjalan di Web Worker agar tidak memblokir thread utama. Khusus untuk medan, peta ketinggian terkuantisasi (nilai 16-bit yang dikompresi dengan pengodean delta sederhana) berukuran lebih kecil daripada format mesh serbaguna mana pun.

Transfer kepemilikan ArrayBuffer antara worker dan thread utama menghindari penyalinan. Saat worker mendekompresi mesh, transfer buffer ke thread utama tanpa penyalinan menggunakan postMessage dengan objek yang dapat ditransfer.

Pengiriman Aset

CDN dengan caching edge untuk data dunia statis. Chunk medan, mesh dasar, dan atlas tekstur yang jarang berubah harus di-cache secara agresif (Cache-Control: max-age=31536000, immutable).

Penyimpanan berbasis alamat konten berarti setiap versi aset mendapatkan hash unik dalam URL-nya. Saat kreator memodifikasi chunk, versi baru memperoleh hash baru dan versi lama tetap berada di cache bagi siapa pun yang masih melihatnya. Tidak perlu melakukan invalidasi cache.

Tekstur KTX2 dengan kompresi Basis Universal. Tekstur ini didekompresi ke format GPU apa pun yang didukung perangkat (BC7, ASTC, ETC2, atau fallback RGBA). Tekstur medan 1024x1024 berkurang dari 4 MB tanpa kompresi menjadi sekitar 150 KB dalam KTX2. Untuk dunia dengan ribuan tekstur unik, kompresi ini menentukan apakah proyek tersebut layak diwujudkan atau tidak.

glTF Binary (GLB) untuk semua aset 3D. Ini adalah JPEG-nya dunia 3D. Setiap mesin peramban dapat memuatnya, formatnya ringkas, serta dapat menyematkan tekstur, material, dan animasi dalam satu file. Gunakan ekstensi Draco atau Meshopt untuk kompresi mesh. Aset unggahan kreator diproses di sisi server menjadi GLB yang dioptimalkan sebelum dimasukkan ke dunia.

Jaringan Multipemain

Menempatkan ratusan kreator dalam dunia yang sama memerlukan arsitektur jaringan yang menangani pergerakan waktu nyata, status dunia persisten, dan pengeditan kreator tanpa kewalahan.

Arsitektur Server

Server otoritatif untuk status dunia. Peramban tidak dapat dipercaya. Semua tindakan penting (menempatkan objek, memodifikasi medan, berpindah antar-chunk) divalidasi di sisi server. Klien melakukan prediksi secara lokal dan menyelaraskannya dengan status server.

Sharding spasial membagi dunia di antara beberapa instans server. Setiap shard mengelola wilayah persegi panjang pada grid dunia. Saat kepadatan pemain berubah, shard dapat dibagi atau digabungkan. Beginilah EVE Online menangani ribuan pemain dalam satu semesta, dan prinsip yang sama berlaku pada skala yang lebih kecil.

Untuk dunia kreator yang sebagian besar interaksinya bersifat lokal (Anda membangun di area Anda dan tetangga dapat melihatnya), sharding spasial bekerja secara alami. Pemain yang berdiri di batas shard melihat konten dari kedua shard, yang memerlukan kueri visibilitas lintas shard, tetapi masalah ini sudah memiliki solusi yang mapan.

Pilihan teknologi untuk server:

TeknologiKeunggulanKasus Penggunaan
Cloudflare Durable ObjectsDiterapkan di edge, penskalaan otomatis, persistensi bawaan, dukungan WebSocketStatus shard dunia, otoritas per chunk
Hathora / RivetHosting server gim terkelola, perlindungan DDoS, penerapan globalInstans server gim khusus
ColyseusKerangka kerja server gim sumber terbuka untuk Node.js, sinkronisasi status berbasis skemaMultipemain berbasis ruang dengan pencatatan perbedaan status
PartyKitDiterapkan di edge, WebSocket + WebRTC, berbasis Cloudflare WorkersKolaborasi waktu nyata, multipemain ringan
Custom Rust/GoKendali maksimum, performa terbaik per instansShard berkepadatan tinggi yang memerlukan fisika berlatensi rendah

Konteks kami (infrastruktur Cloudflare): Durable Objects sangat cocok digunakan. Setiap chunk dunia menjadi Durable Object yang menyimpan status otoritatif untuk konten chunk tersebut. Pemain terhubung melalui WebSocket ke Durable Object yang bertanggung jawab atas chunk mereka saat ini. Saat berpindah ke chunk yang bersebelahan, mereka terhubung ke DO chunk tersebut. Durable Objects mempertahankan status ke disk secara otomatis, sehingga data dunia tetap tersedia setelah server dimulai ulang.

Komunikasi Klien-Server

WebSocket untuk pesan berurutan yang andal (obrolan, pengeditan dunia, inventaris, status gim). Satu koneksi per shard aktif yang dapat dilihat pemain (biasanya 1-4 koneksi).

WebRTC DataChannel untuk pesan tak berurutan yang tidak memerlukan jaminan pengiriman (posisi pemain, animasi, efek sementara). WebRTC mendukung koneksi peer-to-peer, tetapi untuk dunia dengan banyak pemain, Anda perlu menjalankannya melalui SFU (Selective Forwarding Unit) guna menghindari koneksi N2. Cloudflare Calls atau LiveKit dapat berfungsi sebagai SFU.

Sinkronisasi status menggunakan kompresi delta. Server melacak apa yang telah dilihat setiap klien dan hanya mengirim perubahan. Hal ini sangat penting bagi dunia kreator karena status dunia (objek apa yang ada, lokasi objek, dan properti yang dimilikinya) berubah jauh lebih jarang daripada posisi pemain. Anda dapat mengirim pembaruan status dunia pada frekuensi 2-5 Hz, sementara posisi pemain diperbarui pada 20-30 Hz.

typescript
interface WorldChunkState {
  version: number;
  terrain: TerrainPatch;
  objects: PlacedObject[];
  creators: CreatorPresence[];
}

interface DeltaUpdate {
  chunkId: string;
  fromVersion: number;
  toVersion: number;
  addedObjects: PlacedObject[];
  removedObjectIds: string[];
  modifiedObjects: Partial<PlacedObject>[];
  creatorMoves: CreatorPosition[];
}

Penyelesaian Konflik untuk Pengeditan Kreator

Saat dua kreator memodifikasi area yang sama secara bersamaan, Anda memerlukan strategi penyelesaian konflik. Di sinilah pemilihan model kolaborasi waktu nyata menjadi penting.

Penulisan terakhir yang berlaku adalah pendekatan paling sederhana. Setiap objek hanya memiliki satu pemilik pada satu waktu. Jika Anda sedang mengedit bangunan, orang lain tidak dapat mengeditnya hingga Anda melepaskannya. Sederhana dan tanpa konflik, tetapi membatasi kolaborasi.

Operational Transform (OT) adalah metode yang digunakan Google Docs. Operasi ditransformasikan berdasarkan operasi bersamaan untuk menghasilkan hasil yang konsisten. Metode ini cocok untuk teks, tetapi menjadi rumit untuk operasi spasial 3D. Figma menggunakan variasi metode ini untuk kanvas 2D mereka.

CRDT (Conflict-free Replicated Data Types) memungkinkan pengeditan bersamaan yang selalu menyatu menjadi status yang sama tanpa koordinasi. Untuk dunia dengan objek terpisah (masing-masing memiliki ID dan properti), Last-Writer-Wins Register per properti yang digabungkan dengan Add-Wins Set untuk koleksi objek memberi Anda konvergensi otomatis. Yjs dan Automerge adalah pustaka CRDT berkualitas produksi untuk JavaScript.

Rekomendasi kami: Gunakan CRDT untuk status objek dunia (apa yang ada, lokasi objek, dan properti yang dimilikinya), serta server otoritatif untuk validasi spasial (tidak ada dua objek di tempat yang sama dan objek tetap berada dalam batas dunia). CRDT menangani kolaborasi. Server menangani fisika.

Menangani Skala: Berapa Banyak Pemain?

MMO peramban sudah ada saat ini. Hordes.io menjalankan lebih dari 200 pemain dalam satu adegan di peramban. BrowserQuest (eksperimen Mozilla) menangani ratusan pemain dengan dunia berbasis petak yang sederhana. Pertanyaannya bukan apakah peramban mampu menangani multipemain, melainkan tingkat fidelitas visual yang dapat dipertahankan saat jumlah pemain meningkat.

Anggaran rendering pemain: Setiap pemain yang terlihat memerlukan mesh, animasi, dan kemungkinan tampilan yang disesuaikan kreator. Pada 60 fps, Anda memiliki 16 md per frame. Anggaran yang masuk akal:

  • 50 pemain dengan animasi penuh dalam jarak dekat: ~2 md untuk animasi + skinning
  • 200 pemain pada jarak menengah (animasi disederhanakan, menggunakan instancing): ~1 md
  • Lebih dari 500 pemain sebagai titik/ikon pada minimap: dapat diabaikan

Ini memberi Anda populasi terlihat sebanyak ~250 pemain dalam satu tampilan, yang lebih dari cukup untuk dunia kreator. Ibu kota di World of Warcraft jarang merender lebih dari 200 karakter dalam satu tampilan sekaligus.

Anggaran jaringan: Setiap pemain yang mengirim posisi pada 20 Hz menggunakan sekitar 40 byte * 20 = 800 byte/detik. Dengan 200 pemain dalam tampilan: 160 KB/detik data posisi. Tambahkan status dunia, obrolan, dan tindakan kreator, maka kebutuhan data menjadi 200-500 KB/detik per klien. Masih berada dalam kemampuan koneksi pita lebar, tetapi tetap layak dikompresi.

Sistem Medan

Medan adalah fondasi setiap dunia terbuka. Medan juga merupakan bagian yang paling terdampak oleh keterbatasan peramban karena harus tersedia di mana-mana dan selalu terlihat.

Medan Berbasis Peta Ketinggian

Seperti Skyrim, gunakan peta ketinggian. Grid 2D berisi nilai ketinggian menghasilkan medan 3D melalui vertex shader. Pendekatan ini jauh lebih ringkas daripada medan berbentuk mesh arbitrer.

Peta ketinggian 4096x4096 dengan presisi 16-bit berukuran 32 MB tanpa kompresi. Namun, Anda tidak pernah memuat semuanya sekaligus. Setiap chunk 64 m menggunakan bagian peta ketinggian berukuran 65x65 (sekitar 8,4 KB pada 16-bit). Kompresikan bagian tersebut dengan pengodean delta dan zlib, maka ukurannya menjadi kurang dari 2 KB per chunk.

Texture splatting mewarnai beberapa material medan (rumput, batu, tanah, pasir) menggunakan peta campuran. Setiap chunk memiliki splat map RGBA 4 kanal, dengan setiap kanal mengontrol bobot campuran satu material. Dengan 4 tekstur per splat map dan kemampuan untuk memvariasikan splat map per chunk, Anda mendapatkan variasi visual di seluruh dunia.

Renderer medan modern menggunakan tekstur virtual (juga disebut megatexture, yang berasal dari teknologi id Software dalam Rage). Alih-alih melakukan splatting saat runtime, Anda melakukan pra-render terhadap tekstur medan campuran pada resolusi tinggi, lalu melakukan streaming petaknya saat kamera bergerak. Pendekatan ini menukar kapasitas penyimpanan dengan performa runtime. Compute shader WebGPU dapat menangani umpan balik dan pengelolaan tabel halaman yang diperlukan oleh tekstur virtual.

Clipmap atau Geoclipmapping

Untuk merender medan luas di peramban, pendekatan CDLOD (LOD karya C. Dick) atau geoclipmapping bekerja dengan baik. Medan dirender sebagai serangkaian cincin konsentris di sekitar kamera, dengan setiap cincin memiliki setengah resolusi dari cincin sebelumnya. Di dekat kamera, Anda melihat medan beresolusi penuh. Di kejauhan, Anda melihat versi yang lebih kasar. Transisinya mulus karena geometri bertransformasi di antara level.

Teknik ini ramah GPU (satu draw call per cincin), menangani medan tak terbatas dengan penggunaan memori konstan, dan berfungsi di WebGL 2. Teknik ini digunakan pada tingkat tertentu oleh Flight Simulator dan sebagian besar gim dunia terbuka modern.

Medan yang Dimodifikasi Kreator

Jika kreator dapat memahat medan, Anda memerlukan cara untuk menyimpan dan melakukan streaming modifikasi di atas peta ketinggian dasar. Ada dua pendekatan:

Peta ketinggian delta menyimpan selisih antara medan dasar dan medan yang dimodifikasi. Sebagian besar dunia tidak dimodifikasi (nilai delta adalah nol), sehingga pendekatan ini menghasilkan kompresi yang sangat baik. Saat memuat chunk, terapkan delta di atas data dasar.

Overlay voxel untuk modifikasi yang lebih dramatis (gua, tonjolan, lengkungan). Peta ketinggian tidak dapat merepresentasikan medan saat satu titik memiliki dua ketinggian. Grid voxel renggang yang hanya disimpan dalam chunk termodifikasi dapat menanganinya. Marching cubes atau dual contouring digunakan untuk menghasilkan mesh. Pendekatan ini lebih mahal, tetapi memungkinkan pengeditan medan bergaya Minecraft.

Pembuatan Dunia Berbasis AI

Di sinilah kemampuan AI generatif Cinevva yang sudah ada menjadi pengganda kekuatan. Alih-alih membuat setiap batu dan pohon secara manual, kreator dapat mengarahkan AI untuk mengisi dunia.

Pembuatan Medan dengan Neural Field

Penelitian terbaru tentang pembuatan medan neural (GET3D dari NVIDIA, mode jaringan neural Terragen, dan makalah seperti "Terrain Generation Using Procedural Models") menunjukkan bahwa model terlatih dapat menghasilkan medan yang meyakinkan dari perintah teks atau masukan sketsa. Kreator dapat menggambar garis pantai kasar dan mengatakan "perbukitan berhutan yang bertemu dengan pantai berbatu", lalu mendapatkan peta ketinggian dengan erosi, mask vegetasi, dan penetapan material yang sesuai.

Untuk pengiriman melalui peramban, Anda akan menjalankan proses pembuatan di sisi server dan melakukan streaming hasilnya. Model generasi tidak perlu berjalan di peramban. Model tersebut menghasilkan peta ketinggian dan splat map yang dapat dirender peramban menggunakan pipeline medan standar.

Pembuatan Aset 3D

Model seperti Hunyuan3D, Meshy, Tripo, dan Rodin dapat menghasilkan mesh 3D dari teks atau gambar. Alur kerja untuk dunia kreator:

  1. Kreator mendeskripsikan atau membuat sketsa yang diinginkan ("gerbang batu berlumut" atau "tiang lampu futuristis")
  2. Server menjalankan model generasi dan menghasilkan mesh berpoligon tinggi
  3. Server melakukan pemrosesan otomatis: mengurangi jumlah poligon agar sesuai untuk web, menghasilkan LOD, memanggang tekstur ke atlas, dan mengekspor sebagai GLB dengan kompresi Draco
  4. Aset muncul dalam inventaris kreator dan siap ditempatkan di dunia

Bagian-bagian pipeline ini sudah tersedia di Cinevva. Bagian yang belum ada adalah tahap LOD/optimasi dan sistem penempatan dunia.

Pengisian Prosedural

Bahkan dengan aset yang dihasilkan AI, menempatkan setiap pohon di hutan secara manual tetap melelahkan. Aturan penyebaran prosedural memungkinkan kreator menentukan zona ("area ini adalah hutan lebat", "lereng ini berupa timbunan batu"), lalu sistem mengisinya secara otomatis.

Compute shader GPU dapat menjalankan penyebaran ini di peramban. Dengan peta kepadatan dan serangkaian aturan (jarak minimum, batasan kemiringan, rentang ketinggian), satu compute pass menghasilkan posisi instans untuk seluruh chunk dalam waktu kurang dari 1 md. Ubah peta kepadatan, dan vegetasi akan dibuat ulang seketika.

Entity Component System (ECS)

Dunia terbuka dengan ribuan objek membutuhkan sistem pengelolaan entitas yang efisien. Pola ECS (populer di mesin gim sejak DOTS milik Unity dan Bevy) sangat cocok diterapkan pada JavaScript.

bitECS adalah ECS berperforma tinggi untuk JavaScript yang menggunakan typed array dan operasi bitwise. Entitas berupa bilangan bulat biasa. Komponen berupa typed array yang bersebelahan (satu untuk setiap jenis komponen). Sistem mengiterasi array secara berurutan, sehingga ramah cache bahkan dalam JavaScript.

typescript
import { createWorld, defineComponent, Types, defineQuery, addEntity, addComponent } from 'bitecs';

const Position = defineComponent({ x: Types.f32, y: Types.f32, z: Types.f32 });
const Velocity = defineComponent({ x: Types.f32, y: Types.f32, z: Types.f32 });
const ChunkRef = defineComponent({ chunkX: Types.i16, chunkZ: Types.i16 });

const world = createWorld();
const movingQuery = defineQuery([Position, Velocity]);

function movementSystem(world) {
  const entities = movingQuery(world);
  for (let i = 0; i < entities.length; i++) {
    const eid = entities[i];
    Position.x[eid] += Velocity.x[eid] * dt;
    Position.y[eid] += Velocity.y[eid] * dt;
    Position.z[eid] += Velocity.z[eid] * dt;
  }
  return world;
}

Untuk dunia terbuka, ECS menangani semuanya: karakter pemain, objek yang ditempatkan, NPC, partikel, pemicu, dan properti dunia. Saat sebuah chunk dibongkar, entitasnya dihapus dari ECS. Saat sebuah chunk dimuat, entitas ditambahkan. ECS tidak memedulikan pengaturan spasial. ECS hanya memproses komponen.

Fisika

Fisika di peramban telah berkembang sangat baik berkat WebAssembly.

Rapier (Rust -> Wasm)

Rapier adalah mesin fisika yang ditulis dalam Rust dan dikompilasi ke WebAssembly. Rapier menangani rigid body, collider, joint, pengontrol karakter, dan raycasting. Untuk beban kerja gim pada umumnya, performanya berada dalam kisaran 2–3 kali performa Bullet/PhysX native.

Untuk dunia terbuka, Rapier menangani:

  • Pengontrol karakter pemain (berjalan di medan, menaiki anak tangga, meluncur di lereng)
  • Tabrakan antarobjek (objek yang ditempatkan, proyektil)
  • Raycasting untuk interaksi pemain (mengeklik objek untuk memilihnya)
  • Volume pemicu (memasuki area, memicu peristiwa)

Rapier berjalan di Web Worker, sehingga simulasi fisika tidak menghambat rendering. Anda mengirimkan posisi ke renderer setiap frame dan menerima kembali peristiwa input.

Havok untuk Web (melalui Babylon.js)

Jika memilih Babylon.js, fisika Havok sudah disertakan sebagai modul Wasm. Havok adalah mesin fisika di balik sebagian besar gim AAA (Half-Life 2, Skyrim, Breath of the Wild). Build Wasm-nya berkualitas produksi dan dioptimalkan untuk scene graph Babylon.

Tabrakan Medan

Mesin fisika membutuhkan geometri tabrakan untuk medan. Membuat trimesh beresolusi penuh untuk seluruh medan yang terlihat akan membutuhkan biaya besar. Sebagai gantinya, buat heightfield tabrakan hanya untuk chunk di dekat pemain (3x3 atau 5x5 chunk terdekat) dan gunakan tabrakan yang disederhanakan untuk yang lainnya. Collider heightfield Rapier dirancang tepat untuk kasus penggunaan ini.

Audio

Suara mengubah ruang 3D dari demo visual menjadi sebuah tempat. Web Audio API menyediakan semua yang dibutuhkan untuk audio spasial di peramban.

Audio spasial dengan HRTF (Head-Related Transfer Function) menempatkan suara dalam ruang 3D. Air terjun di sebelah kiri akan terdengar seolah berada di sebelah kiri. Berjalanlah mendekat dan suaranya menjadi lebih keras. Berjalanlah ke belakang bangunan dan suaranya menjadi teredam (dengan pemrosesan tambahan).

Zona suasana bekerja seperti texture splatting untuk audio. Tentukan wilayah (hutan, gua, pantai, kota) dan lakukan crossfade di antara bentang suara sekitar saat pemain berpindah dari satu wilayah ke wilayah lain. Dengan cara inilah Skyrim membuat hutannya terdengar hidup. Lapisi suara angin, burung, gemerisik dedaunan, dan hewan di kejauhan. Tidak ada satu pun yang rumit. Semuanya bersifat spasial.

Performa Web Audio cukup baik untuk puluhan sumber spasial secara bersamaan. Hambatannya biasanya adalah ukuran aset, bukan pemrosesan. Gunakan Opus atau AAC untuk audio terkompresi, streaming trek suasana yang panjang, dan muat terlebih dahulu efek suara pendek (langkah kaki, interaksi).

Air, Cuaca, dan Atmosfer

Setiap dunia terbuka yang berkesan memiliki air dan cuaca. Sistem-sistem ini membentuk suasana dan membuat dunia terasa hidup. Keduanya juga ternyata sangat mungkin diwujudkan di peramban.

Rendering Air

Air dalam 3D di peramban memiliki tiga tingkat kompleksitas, dan Anda dapat merilis tingkat paling sederhana terlebih dahulu lalu meningkatkannya nanti.

Tingkat 1: Bidang reflektif. Mesh datar pada ketinggian air dengan material reflektif/refraktif. Render adegan secara terbalik ke sebuah tekstur (refleksi planar), padukan dengan semburat biru, lalu tambahkan normal map yang bergerak untuk menciptakan gerakan ombak. Inilah yang dilakukan shader air dasar Skyrim. Di Three.js, contoh Water dalam repositori resmi mengimplementasikan teknik ini. Di Babylon.js, WaterMaterial menyediakannya secara bawaan. Biaya: satu render pass tambahan untuk refleksi (setengah resolusi sudah cukup), ditambah penggambaran permukaan air. Pada GPU kelas menengah, ini menambah 2–3 md per frame.

Tingkat 2: Refleksi screen-space + efek berbasis kedalaman. Alih-alih menggunakan render pass refleksi terpisah, ambil sampel frame buffer yang sudah ada untuk refleksi (SSR). Tambahkan penyerapan warna berbasis kedalaman (air semakin gelap saat semakin dalam), buih di garis pantai menggunakan perbandingan kedalaman, dan kaustik yang diproyeksikan ke medan bawah air. Inilah yang digunakan The Witcher 3. SSR tersedia dalam stack pascapemrosesan Three.js maupun pipeline rendering Babylon.js. Biaya: 1–2 md untuk SSR, sedangkan efek kedalaman dapat diabaikan.

Tingkat 3: Simulasi laut FFT. Untuk laut terbuka, gunakan Fast Fourier Transform guna menyimulasikan spektrum gelombang pada GPU. Makalah Jerry Tessendorf, "Simulating Ocean Water" (2001), adalah fondasi yang digunakan oleh setiap mesin gim besar. FFT berjalan sebagai compute shader di WebGPU, menghasilkan displacement map dan normal map pada setiap frame. Hasil lautnya tampak sangat meyakinkan. Inilah yang digunakan Sea of Thieves, Assassin's Creed Black Flag, dan Uncharted 4. Di WebGPU, laut FFT 256x256 berjalan dalam waktu kurang dari 1 md pada GPU desktop.

wgsl
@compute @workgroup_size(16, 16)
fn fftOceanDisplacement(@builtin(global_invocation_id) id: vec3<u32>) {
    let k = vec2<f32>(f32(id.x) - N/2.0, f32(id.y) - N/2.0);
    let omega = sqrt(length(k) * gravity);
    let phase = omega * time;
    let h = spectrum[id.xy] * vec2<f32>(cos(phase), sin(phase));
    displacement[id.xy] = h;
}

Untuk dunia kreator, mulailah dengan Tingkat 1 (bidang reflektif), lalu tingkatkan ke Tingkat 2 saat renderer semakin matang. Tingkat 3 hanya diperlukan jika dunia tersebut memiliki laut terbuka.

Sistem Cuaca

Cuaca di Skyrim dan BotW dikendalikan oleh state machine dengan transisi. Cerah > Berawan > Hujan > Badai > Cerah. Setiap keadaan mengubah beberapa sistem secara bersamaan: skybox, kerapatan kabut, warna cahaya sekitar, efek partikel (hujan/salju), audio (angin, hujan), dan properti gameplay (permukaan basah menjadi licin di BotW).

Untuk dunia di peramban, sistem cuaca memiliki tiga lapisan:

Rendering langit. Shader langit prosedural lebih murah dan fleksibel daripada tekstur skybox. Model langit Preetham atau Hosek-Wilkie menghitung warna langit yang masuk akal secara fisik hanya dari posisi matahari. Tambahkan lapisan awan menggunakan noise 3D yang digulirkan melintasi sebuah bidang. Babylon.js memiliki material langit prosedural bawaan. Three.js memiliki contoh Sky. Keduanya menghasilkan tampilan meyakinkan dengan biaya GPU yang dapat diabaikan (hanya sebuah quad layar penuh).

Efek partikel. Hujan adalah sistem partikel dengan ribuan quad tipis yang jatuh dari atas. Salju serupa, tetapi memiliki lintasan lebih lambat dan melayang. Kabut adalah pass pascapemrosesan yang memadukan adegan menuju warna kabut berdasarkan kedalaman. Semua ini merupakan efek WebGL standar. Biayanya bergantung pada jumlah partikel: 10.000 partikel hujan menambah sekitar 0,5 md per frame.

Respons lingkungan. Permukaan basah meningkatkan refleksi spekular. Akumulasi salju menambahkan warna putih pada permukaan yang menghadap ke atas. Genangan muncul di medan cekung. Ini adalah trik shader, bukan perubahan geometri. Uniform "wetness" mengubah kekasaran material. Uniform "snow cover" memadukan warna putih pada permukaan yang normalnya mengarah ke atas. GTA V dan The Witcher 3 menggunakan pendekatan yang sama persis.

Cuaca tersinkronisasi. Dalam dunia multipemain, cuaca harus konsisten di semua klien. Pendekatan paling sederhana: server menyiarkan status cuaca (termasuk progres transisi) pada frekuensi 1 Hz. Klien melakukan interpolasi secara lokal. Karena cuaca berubah perlahan (transisi dari cerah ke hujan memerlukan 30–60 detik), bahkan pembaruan yang tertunda tetap tampak mulus.

Perspektif Atmosfer

Ini adalah teknik visual paling efektif untuk membuat dunia terasa luas, dan biayanya nyaris nol. Objek di kejauhan tampak lebih berkabut, lebih biru, dan memiliki kontras lebih rendah karena hamburan cahaya di atmosfer. Setiap dunia terbuka menggunakan teknik ini.

Dalam fragment shader, padukan piksel yang jauh menuju warna atmosfer berdasarkan kedalaman:

glsl
float fogFactor = 1.0 - exp(-distance * fogDensity);
vec3 finalColor = mix(objectColor, atmosphereColor, fogFactor);

BotW membawa teknik ini lebih jauh dengan kabut bergaya lukisan yang bertransisi menjadi jarak bergaya cat air. Warna kabut berubah mengikuti waktu dan cuaca. Efek shader tunggal ini memberikan kesan skala yang lebih besar daripada detail medan sebanyak apa pun.

Untuk dunia peramban dengan arahan seni bergaya, perspektif atmosfer adalah efek visual pertama yang perlu diterapkan. Teknik ini menyembunyikan transisi LOD (objek jauh dengan detail lebih rendah tetap terlihat baik melalui kabut), mengurangi pop-in konten streaming yang terlihat, dan membuat tangkapan layar tampak bagus bahkan sebelum dunia terisi sepenuhnya.

Sistem Avatar

Pemain membutuhkan tubuh. Dalam dunia kreator, avatar merupakan bentuk utama ekspresi diri selain karya yang Anda bangun. Sistemnya harus cukup fleksibel untuk personalisasi sekaligus menjaga biaya rendering tetap cukup rendah untuk 200+ pemain yang terlihat.

Arsitektur Avatar

Mesh dasar + lapisan kustomisasi. Mulailah dengan mesh dasar humanoid bersama (1.500–3.000 segitiga untuk tubuh). Kustomisasi dilakukan melalui:

  • Variasi warna/tekstur (warna kulit, warna rambut) melalui perubahan uniform. Tanpa geometri tambahan.
  • Bagian mesh yang dapat ditukar (gaya rambut, pakaian, aksesori) untuk menggantikan bagian dari mesh dasar. Setiap bagian merupakan mesh kecil terpisah (200–500 segitiga).
  • Variasi properti material (zirah logam vs. tunik kain) melalui perubahan parameter material.

Beginilah Roblox, Fortnite, dan VRChat menangani avatar. Biaya dasarnya tetap konstan terlepas dari kustomisasi.

Ready Player Me dan Avaturn menawarkan pembuatan avatar berbasis peramban yang menghasilkan model glTF kompatibel dengan mesin 3D apa pun. Keduanya menangani pemindaian wajah dari foto, proporsi tubuh, dan pakaian. Model keluarannya dioptimalkan untuk rendering waktu nyata (biasanya 10K–20K segitiga, yang dapat dikurangi menjadi 3K–5K untuk rendering jarak jauh).

Animasi Skeletal di Peramban

Setiap pemain yang terlihat membutuhkan animasi: diam, berjalan, berlari, melompat, dan emote. Animasi skeletal menggerakkan mesh melalui serangkaian transformasi tulang pada setiap frame.

GPU skinning wajib digunakan demi performa. Three.js dan Babylon.js sama-sama melakukan skinning pada GPU secara bawaan. Matriks tulang diunggah sebagai uniform buffer atau tekstur, lalu vertex shader menerapkan transformasi tulang. Biaya CPU berasal dari penghitungan transformasi tulang berdasarkan klip animasi. Untuk skeleton 60 tulang pada 30 fps, biayanya sekitar 0,01 md per karakter. Untuk 200 karakter: total 2 md. Masih dapat diterima.

Animation blending mencampurkan beberapa animasi (berjalan + melambaikan tangan, diam + melihat sekeliling) menggunakan bobot pencampuran. Three.js (AnimationMixer) dan Babylon.js (AnimationGroup) sama-sama mendukungnya. Pencampuran terjadi di CPU (menginterpolasi transformasi tulang) sebelum hasil campurannya dikirim ke GPU.

Animasi terinstansiasi adalah kunci untuk merender banyak karakter secara efisien. Alih-alih menggambar setiap karakter sebagai mesh terpisah, bake frame animasi ke dalam tekstur (vertex animation texture, atau VAT). Setiap baris tekstur menyimpan transformasi tulang untuk satu frame. Compute shader atau vertex shader membaca baris yang benar berdasarkan waktu animasi karakter. Ini memungkinkan ratusan karakter dirender dengan satu instanced draw call. The Witcher 3 dan Assassin's Creed menggunakan teknik ini untuk rendering kerumunan.

Di WebGPU, karakter animasi terinstansiasi tampak seperti ini:

wgsl
@vertex
fn vs_main(@builtin(instance_index) instanceIdx: u32, @location(0) position: vec3<f32>) -> @builtin(position) vec4<f32> {
    let animFrame = instances[instanceIdx].animationFrame;
    let boneIdx = vertexBoneIndices[vertexIdx];
    let boneTransform = textureLoad(animTexture, vec2<i32>(i32(boneIdx), i32(animFrame)), 0);
    let worldPos = instances[instanceIdx].transform * boneTransform * vec4<f32>(position, 1.0);
    return viewProjection * worldPos;
}

Untuk pemain yang jauh (lebih dari 50 meter), beralihlah ke impostor billboard: quad datar yang menampilkan sprite karakter yang telah dirender sebelumnya dari sudut pandang saat ini. Ini adalah trik yang sama dengan yang digunakan Skyrim untuk pepohonan jauh, tetapi diterapkan pada karakter. Transisinya tidak terlihat dari kejauhan.

Inverse Kinematics untuk Interaksi

Saat karakter mengambil objek, meraih gagang pintu, atau menunjuk sesuatu, IK prosedural membuat tindakannya terlihat alami. FABRIK (Forward And Backward Reaching Inverse Kinematics) adalah solver IK sederhana dan cepat yang bekerja dengan baik secara waktu nyata. Three.js (melalui CCDIKSolver) dan Babylon.js (melalui BoneIKController) sama-sama memiliki dukungan IK bawaan.

Untuk dunia kreator, IK memungkinkan karakter berinteraksi secara alami dengan objek yang ditempatkan: duduk di kursi yang ditempatkan kreator, bersandar pada pagar, dan mengambil barang. Interaksi tersebut tidak memerlukan animasi khusus per objek. Sistem IK menyesuaikan pose karakter dengan posisi objek.

Jaringan Tingkat Lanjut

Arsitektur dasar (WebSocket + WebRTC) telah dibahas sebelumnya. Berikut detail lebih mendalam mengenai protokol, kompresi, dan opsi transportasi yang lebih baru.

Protokol Pesan Biner

JSON melalui WebSocket memboroskan bandwidth 10 kali lipat dibandingkan encoding biner. Untuk dunia multipemain waktu nyata, setiap pesan harus berbentuk biner. FlatBuffers (dari Google) adalah pilihan terbaik untuk jaringan gim. Tidak seperti Protocol Buffers, FlatBuffers menyediakan akses zero-copy ke data yang telah diserialisasi. Anda tidak perlu mendekode pesan menjadi objek JavaScript. Anda membaca field langsung dari buffer. Ini menghilangkan alokasi dan tekanan GC yang akan ditimbulkan Protocol Buffers pada jalur kritis. FlatBuffers memiliki generator kode JavaScript/TypeScript.

Contoh pembaruan posisi pemain dalam FlatBuffers:

typescript
// Schema: PlayerUpdate { id: uint16, x: float32, y: float32, z: float32, yaw: float16, pitch: float16, animState: uint8 }
// Total: 17 byte per pembaruan pemain
// vs JSON: {"id":42,"x":103.5,"y":12.3,"z":-47.8,"yaw":1.57,"pitch":0.2,"animState":3} = 80+ byte

Untuk 200 pemain pada 20 Hz, perbedaannya adalah 200 * 17 * 20 = 68 KB/dtk (biner) dibandingkan 200 * 80 * 20 = 320 KB/dtk (JSON). Biner 4,7 kali lebih kecil dan menghindari alokasi JSON.parse dalam loop kritis.

MessagePack lebih sederhana daripada FlatBuffers (tanpa skema, tanpa pembuatan kode), tetapi masih 30–50% lebih kecil daripada JSON. Ini adalah pilihan tengah yang baik jika Anda menginginkan format biner tanpa perlu mengelola skema.

Kuantisasi Posisi dan Kompresi Delta

Posisi pemain tidak memerlukan presisi float 32-bit. Jika dunia Anda berukuran 4 km x 4 km, integer tanpa tanda 16-bit memberi Anda presisi 6 cm (4000 m / 65536). Untuk sebagian besar gim, hasilnya tidak dapat dibedakan dari presisi penuh. Ini mengurangi ukuran data posisi hingga separuhnya.

Kompresi delta hanya mengirimkan perbedaan dari state terakhir yang telah dikonfirmasi. Jika seorang pemain bergerak 0,5 meter sejak pembaruan terakhir, deltanya berupa angka kecil yang dapat dikompresi dengan baik. Jika digabungkan dengan encoding panjang variabel (delta yang lebih kecil menggunakan lebih sedikit byte), pembaruan posisi terkompresi delta biasanya berukuran 3–6 byte, bukan 12.

Dead reckoning mengurangi frekuensi pembaruan. Alih-alih mengirim posisi pada 20 Hz, kirim posisi + kecepatan. Klien mengekstrapolasi posisi di antara pembaruan. Koreksi hanya dikirim ketika posisi aktual menyimpang dari posisi prediksi melebihi ambang batas. Ini dapat mengurangi bandwidth pembaruan posisi sebesar 60–80% untuk pemain yang bergerak lurus (yang mencakup sebagian besar pergerakan).

RuneScape menggunakan versi ekstrem dari teknik ini: pergerakan pemain berbasis petak, jadi perintah bergerak hanya berisi petak tujuan. Klien menganimasikan jalur berjalan secara lokal. Untuk dunia 3D kontinu, Anda akan menggunakan dead reckoning yang mulus, tetapi prinsipnya sama.

WebTransport

WebTransport adalah protokol lebih baru yang dapat menggantikan WebSocket dan WebRTC DataChannel untuk jaringan gim. Protokol ini berjalan di atas HTTP/3 (QUIC) dan menyediakan:

  • Stream terurut yang andal (seperti WebSocket, tetapi dimultipleks sehingga kemacetan pada satu stream tidak memblokir stream lainnya)
  • Datagram yang tidak andal (seperti UDP, untuk pembaruan posisi yang langsung kedaluwarsa jika terlambat)
  • Stream multipleks (stream terpisah untuk obrolan, state dunia, dan posisi, tanpa pemblokiran head-of-line)

Inilah yang benar-benar dibutuhkan jaringan gim. WebSocket memberi Anda komunikasi andal dan terurut (tetapi pemblokiran head-of-line merusak latensi pembaruan posisi). WebRTC DataChannel memberi Anda komunikasi tidak andal (tetapi penyiapannya rumit dan memerlukan ICE/STUN). WebTransport memberi Anda keduanya melalui satu koneksi.

Dukungan peramban: Chrome, Edge, dan Firefox telah mendukung WebTransport selama beberapa waktu, sementara Safari 26.4 menambahkannya pada Maret 2026. Langkah tersebut membawa WebTransport ke status Baseline, yang berarti kini berfungsi di semua peramban utama, termasuk di iOS, tempat semua peramban menggunakan WebKit. Fallback WebSocket tetap layak dipertahankan untuk versi Safari yang lebih lama, tetapi WebTransport secara luas sudah dapat digunakan saat ini.

Cloudflare mendukung WebTransport melalui Workers, yang sesuai dengan infrastruktur kita.

Pengelolaan Area Relevan dalam Skala Besar

Tantangan jaringan dengan 200+ pemain bukanlah bandwidth per pemain. Masalahnya adalah pertumbuhan kuadrat: jika setiap pemain mengirim pembaruan kepada setiap pemain lain, 200 pemain berarti 200 * 199 = 39.800 pesan pembaruan per tick. Server perlu melakukan penyaringan.

Pengelolaan Area of Interest (AOI) berarti setiap pemain hanya menerima pembaruan tentang entitas dalam jangkauan pandangnya. Implementasinya menggunakan grid spasial yang sama dengan sistem chunk: ketika posisi pemain dipetakan ke chunk (3, 7), mereka menerima pembaruan dari chunk (2-4, 6-8), yaitu lingkungan 3x3. Entitas di luar jangkauan ini tidak dikirimkan.

Pembaruan berbasis prioritas di dalam AOI memberikan lebih banyak bandwidth kepada entitas penting. Pemain yang berlari ke arah Anda mendapat pembaruan 20 Hz. Pemain yang diam sejauh 200 meter mendapat pembaruan 2 Hz. NPC yang tidak melakukan apa pun mendapat pembaruan 0,5 Hz. Server mempertahankan antrean prioritas per klien dan mengalokasikan bandwidth berdasarkan relevansi entitas (jarak, kecepatan, potensi interaksi).

Dormansi. Entitas yang statenya tidak berubah selama N detik akan menjadi dorman dan berhenti menghasilkan lalu lintas jaringan sepenuhnya. Klien menyimpan state terakhir yang diketahui hingga menerima peristiwa pengaktifan. Dalam dunia kreator yang sebagian besar objeknya statis, dormansi menghilangkan mayoritas potensi lalu lintas jaringan.

Tick rate variabel Slither.io (5 Hz untuk objek jauh dibandingkan 30 Hz untuk objek dekat) adalah versi sederhana dari teknik ini. "Dilatasi waktu" EVE Online adalah versi ekstremnya (ketika terlalu banyak pemain berada di satu area, server memperlambat tick rate gim demi mempertahankan konsistensi). Untuk kasus penggunaan kita, AOI berbasis prioritas dengan dormansi menawarkan keseimbangan yang tepat.

Gaussian Splatting dan Teknologi Rendering yang Lebih Baru

Rendering mesh tradisional (segitiga + tekstur) bukan lagi satu-satunya pilihan untuk 3D di peramban. Beberapa teknik yang lebih baru mulai layak digunakan dalam produksi.

3D Gaussian Splatting

3D Gaussian Splatting (SIGGRAPH 2023): rekonstruksi adegan fotorealistis dari foto, yang dirender secara real-time di peramban. Kreator dapat memindai objek dunia nyata dengan ponsel dan menempatkannya langsung di dalam dunia.

3D Gaussian Splatting (3DGS) merekonstruksi adegan 3D dari foto dengan merepresentasikan adegan sebagai jutaan Gaussian 3D berwarna (elipsoid berwarna dan berorientasi). Renderer mengurutkan dan merasterisasi splat tersebut, bukan segitiga.

Alasan teknik ini penting bagi dunia kreator:

  • Pengambilan fotogrametri menjadi sangat mudah. Kreator mengambil 50 foto objek atau lokasi dunia nyata dengan ponsel. Pemrosesan di sisi server (melalui alat seperti Nerfstudio atau gsplat) menghasilkan adegan Gaussian splat dalam hitungan menit. Adegan tersebut dimuat di peramban dan tampak fotorealistis dari sudut mana pun.
  • Rendering di peramban sudah terpecahkan. Sejumlah implementasi sumber terbuka merender Gaussian splat dalam WebGL dan WebGPU. PlayCanvas memiliki rendering splat bawaan. Luma AI memiliki penampil yang kompatibel dengan Three.js. gsplat.js adalah pustaka mandiri. Performanya bagus: 1–3 juta splat dapat dirender pada 30–60 fps di GPU desktop.
  • Format datanya ringkas. Adegan Gaussian splat sebuah ruangan mungkin berukuran 10–30 MB setelah dikompresi. Objek individual berukuran 1–5 MB. Ini sebanding dengan aset mesh bertekstur.

Komprominya: adegan splat bersifat statis. Anda tidak dapat menganimasikan atau memodifikasinya dengan mudah. Teknik ini cocok untuk dekorasi lingkungan (pohon fotorealistis, patung dunia nyata yang direkam, fasad bangunan yang dipindai), tetapi tidak untuk objek gim interaktif. Pendekatan hibrida menggunakan splat untuk detail lingkungan dan mesh tradisional untuk objek interaktif.

Untuk dunia kreator: Izinkan kreator merekam objek dunia nyata melalui foto ponsel, memprosesnya menjadi Gaussian splat di sisi server, lalu menempatkannya di dalam dunia. Ini menjembatani kesenjangan antara aset buatan AI dan objek dunia nyata. Kreator dapat memindai karya seni, furnitur, atau arsitektur mereka sendiri dan menempatkannya langsung ke dalam dunia bersama.

Neural Radiance Fields (NeRF) menjadi Mesh

NeRF merepresentasikan adegan sebagai jaringan saraf yang menghasilkan warna dan densitas untuk setiap titik 3D. Teknik ini menghasilkan kualitas visual luar biasa dari foto, tetapi mahal untuk dirender (satu forward pass penuh jaringan saraf per piksel per frame).

Pendekatan praktis untuk peramban: latih NeRF dari foto, lalu ekstrak mesh menggunakan marching cubes pada medan densitas. Hasilnya adalah mesh segitiga tradisional dengan tekstur baked yang dapat dirender oleh mesin peramban apa pun. Alat seperti Instant-NGP, Nerfstudio, dan Neuralangelo mengotomatiskan pipeline ini. Kualitasnya tidak setinggi rendering NeRF secara langsung, tetapi kompatibel dengan pipeline rendering standar.

Ini adalah jalur lain bagi kreator untuk memasukkan objek dunia nyata ke dalam dunia peramban tanpa keterampilan pemodelan.

Mesh Shader dan Rendering Bergaya Nanite

Sistem Nanite UE5 merender miliaran segitiga dengan menggunakan mesh shader, rendering yang dikendalikan GPU, dan geometri virtual (streaming segitiga pada tingkat per-cluster berdasarkan cakupan layar). WebGPU belum mendukung mesh shader, tetapi prinsip dasarnya (rendering berbasis GPU dengan culling berbasis compute dan pemilihan LOD) dapat diimplementasikan.

Compute shader WebGPU dapat:

  1. Membaca semua bounding box cluster mesh (kelompok berisi sekitar 64 segitiga)
  2. Menguji setiap cluster terhadap view frustum dan buffer oklusi
  3. Memilih tingkat LOD yang sesuai berdasarkan ukuran dalam ruang layar
  4. Menulis cluster yang terlihat ke dalam indirect draw buffer
  5. Satu indirect draw call merender semuanya

Pendekatan "geometri virtual" ini menangani jutaan segitiga dengan biaya CPU konstan (CPU mengirimkan satu draw call tanpa memandang kompleksitas adegan). Inilah cara rendering peramban pada akhirnya akan menangani dunia terbuka berukuran besar. Implementasinya rumit, tetapi komponen dasarnya sudah tersedia di WebGPU saat ini.

Teknik Shader untuk Dunia Terbuka Bergaya

Arahan seni bergaya memerlukan teknik shader tertentu. Berikut adalah teknik yang memberikan dampak visual terbesar untuk setiap siklus GPU.

Animasi Angin pada Vegetasi

Pohon dan rumput yang bergoyang tertiup angin membuat dunia terasa hidup. Tekniknya sederhana: dalam vertex shader, geser posisi vertex menggunakan kombinasi gelombang sinus yang didasarkan pada posisi dunia dan waktu.

glsl
vec3 windOffset = vec3(
    sin(worldPos.x * 0.5 + time * 2.0) * windStrength,
    0.0,
    cos(worldPos.z * 0.3 + time * 1.5) * windStrength
);
float heightFactor = localPos.y / meshHeight;
finalPos += windOffset * heightFactor * heightFactor;

heightFactor memastikan pangkal pohon tetap menapak, sementara bagian atasnya bergoyang paling kuat. Penggunaan posisi dunia dalam fungsi sinus membuat pohon-pohon yang berdekatan bergoyang pada fase yang sedikit berbeda sehingga menciptakan efek gelombang alami di seluruh hutan. BotW, Skyrim, dan setiap dunia terbuka dengan vegetasi menggunakan teknik ini.

Untuk rumput, prinsip yang sama berlaku, tetapi dengan frekuensi lebih tinggi dan panjang gelombang lebih pendek. Bilah rumput yang di-instance oleh GPU (ribuan quad tipis) dengan offset fase acak per instance menghasilkan padang rumput yang meyakinkan dengan biaya minimal. Compute shader WebGPU dapat menghasilkan posisi dan orientasi bilah rumput dari peta densitas, dengan efek angin yang dimasukkan ke dalam transformasi instance setiap frame.

Toon/Cel Shading

Jika arahan seninya bergaya (dan bukti yang ada menunjukkan memang seharusnya demikian), cel shading adalah teknik intinya. Gagasannya: kuantisasi pencahayaan menjadi beberapa tingkat diskret, bukan gradien halus.

glsl
float NdotL = dot(normal, lightDir);
float toonShading = step(0.3, NdotL) * 0.5 + step(0.6, NdotL) * 0.5;
vec3 color = baseColor * (ambient + toonShading);

Ini menghasilkan tampilan dua nada atau tiga nada yang klasik. Tambahkan pass garis luar (render back-face yang sedikit diperbesar, atau gunakan post-process deteksi tepi dalam ruang layar) untuk menghasilkan efek komik.

Shading BotW lebih bernuansa daripada cel shading murni. Teknik ini menggunakan gradien halus dengan sedikit peralihan tegas pada batas bayangan, ditambah pergeseran warna hangat-ke-sejuk (bayangan bersemu biru, area yang terkena cahaya bernuansa hangat). Pendekatan hibrida ini terlihat lebih alami daripada toon shading yang ketat, tetapi tetap terbaca sebagai gaya visual stilistis. Ini dapat dicapai dengan shader khusus di mesin 3D peramban mana pun.

Shader Air Bergaya

Air dalam dunia bergaya tidak memerlukan simulasi gelombang realistis. Kombinasi normal map yang bergulir, deteksi buih tepi, dan warna berbasis kedalaman memberikan hasil yang secara visual konsisten dengan arahan seni bergaya BotW.

glsl
float depth = texture(depthTexture, screenUV).r - fragDepth;
vec3 shallowColor = vec3(0.2, 0.7, 0.8);
vec3 deepColor = vec3(0.05, 0.15, 0.3);
vec3 waterColor = mix(shallowColor, deepColor, saturate(depth * 2.0));

float foam = step(0.05, depth) * (1.0 - step(0.15, depth));
foam *= texture(foamNoise, worldUV * 3.0 + time * 0.1).r;
waterColor = mix(waterColor, vec3(1.0), foam * 0.8);

Ini memberikan pewarnaan berbasis kedalaman (air dangkal berwarna lebih terang), buih garis pantai yang dianimasikan dengan noise, dan seluruhnya berjalan dalam satu pass fragment shader.

Screen-Space Ambient Occlusion (SSAO)

SSAO menggelapkan sudut, celah, dan area tempat permukaan saling bertemu. Teknik ini menambah kedalaman dan membuat objek terasa lebih menyatu dengan adegan tanpa global illumination yang mahal. Three.js dan Babylon.js sama-sama memiliki implementasi SSAO bawaan.

Untuk dunia bergaya, SSAO bahkan lebih penting daripada dalam rendering realistis karena shading datar tidak menampilkan bayangan kontak secara alami. Pass SSAO ringan (setengah resolusi sudah cukup) menambahkan petunjuk kedalaman yang hilang. Biaya: 1–2 md pada GPU desktop.

Pembuatan Dunia yang Lebih Mendalam

Artikel dasar membahas terrain prosedural pada tingkat tinggi. Berikut detail algoritmisnya.

Fungsi Noise untuk Terrain

Semua terrain prosedural dimulai dengan noise. Fungsi noise menghasilkan nilai pseudoacak yang berubah secara mulus dalam ruang. Lapiskan beberapa oktaf (frekuensi) untuk memperoleh hasil yang tampak alami.

Perlin noise adalah pilihan klasik. Simplex noise lebih cepat dan memiliki lebih sedikit artefak arah. OpenSimplex 2 adalah varian modern dengan performa yang baik dalam JavaScript. Untuk compute shader WebGPU, mengimplementasikan simplex noise dalam WGSL cukup mudah (sekitar 50 baris matematika).

Fractal Brownian Motion (fBm) melapiskan beberapa oktaf noise:

height = 0
amplitude = 1.0
frequency = baseFrequency
for each octave:
    height += amplitude * noise(position * frequency)
    frequency *= lacunarity (typically 2.0)
    amplitude *= persistence (typically 0.5)

Dengan 6-8 oktaf, fBm menghasilkan medan yang memiliki formasi pegunungan berskala besar, perbukitan berskala menengah, dan kekasaran berskala halus, sangat menyerupai medan nyata. Parameter persistence mengontrol tingkat kekasaran medan (0,3 menghasilkan perbukitan landai yang mulus, sedangkan 0,7 menghasilkan pegunungan bergerigi).

Domain warping menggunakan keluaran dari satu fungsi noise sebagai koordinat masukan bagi fungsi lainnya. Teknik ini menghasilkan medan yang tampak tererosi dan organik, bukan bergelombang secara seragam. Terapkan 2-3 lapisan domain warping dan medan mulai terlihat seolah-olah dibentuk oleh proses geologis.

Simulasi Erosi Hidraulis

Medan noise mentah tampak seperti kertas kusut. Medan nyata tampak seperti kertas kusut yang diguyur hujan selama sejuta tahun. Simulasi erosi hidraulis mengubah medan yang dihasilkan dari noise menjadi sesuatu yang tampak masuk akal secara geologis.

Algoritmanya:

  1. Jatuhkan partikel air pada posisi acak di heightmap
  2. Partikel mengalir menuruni lereng (mengikuti gradien medan)
  3. Pada setiap langkah, partikel mengangkut sedimen dari medan berdasarkan kecepatan dan kemiringan
  4. Ketika partikel melambat (medan lebih datar, terbentuk genangan), partikel mengendapkan sedimen
  5. Ulangi untuk 100.000-500.000 partikel

Hasilnya adalah medan dengan lembah sungai, kipas aluvial, garis punggung bukit yang tampak alami, serta lereng mulus dengan transisi yang logis. Algoritma ini berjalan pada heightmap 1024x1024 dalam waktu sekitar 2-5 detik di JavaScript, atau kurang dari 100 md dalam compute shader WebGPU.

Implementasi Sebastian Lague (tersedia di GitHub) merupakan referensi standar bagi pengembang game. Implementasi tersebut menghasilkan medan yang mampu menyaingi hasil pahatan manual. Untuk dunia kreator, menjalankan erosi pada medan buatan AI selama tahap pemrosesan sisi server akan membuat lanskap yang dihasilkan secara prosedural tampak dibuat dengan tangan.

Penetapan Bioma

Dunia nyata memiliki bioma: hutan, gurun, tundra, dan rawa. Penetapan bioma memetakan parameter iklim ke wilayah medan.

Pendekatan Minecraft dapat dijadikan acuan: tentukan bioma pada grid 2D menggunakan sumbu suhu dan kelembapan. Suhu menurun seiring bertambahnya ketinggian dan garis lintang. Kelembapan bervariasi berdasarkan kedekatan dengan air dan arah angin dominan. Setiap sel grid memperoleh penetapan bioma (hutan, gurun, tundra, dan sebagainya) yang menentukan tekstur medan, jenis dan kepadatan vegetasi, audio sekitar, serta pola cuaca.

Untuk dunia kreator, batas bioma harus dapat dilukis. Sistem menghasilkan bioma bawaan berdasarkan karakteristik medan, tetapi kreator dapat mengganti penetapan tersebut dengan melukis zona bioma di petak milik mereka. Pendekatan hibrida ini memberikan tampilan bawaan yang alami pada dunia sekaligus memungkinkan kreator mewujudkan visi mereka.

Wave Function Collapse untuk Struktur

Wave Function Collapse (WFC) menghasilkan struktur (bangunan, dungeon, jalan) dari sekumpulan tile dengan batasan ketetanggaan. Dengan sekumpulan komponen bangunan modular dan aturan mengenai komponen mana yang dapat saling terhubung, WFC dapat menghasilkan seluruh desa, tata letak kastel, atau peta dungeon.

Untuk dunia kreator, WFC memungkinkan:

  • Desa yang dihasilkan secara otomatis untuk mengisi dunia dengan konten dasar sebelum kreator menyesuaikannya
  • Pembangunan berbantuan tempat kreator menempatkan beberapa komponen dan WFC mengisi celahnya (seperti Townscaper, tetapi dengan blok bangunan 3D)
  • Pembuatan dungeon untuk pengalaman interaktif yang dapat dikonfigurasi oleh kreator (atur tema, tingkat kesulitan, dan ukuran, lalu WFC menghasilkan tata letaknya)

Oskar Stalberg (kreator Townscaper dan Bad North) telah menunjukkan bahwa pembuatan berbasis WFC terasa ajaib bagi pengguna. Mereka menempatkan beberapa blok dan sistem menghasilkan struktur yang selaras secara estetis di sekelilingnya. Inilah prinsip "alat sederhana, hasil kaya" yang berhasil di platform kreator.

Arsitektur Moderasi Konten

Dalam dunia tempat kreator dapat menempatkan konten 3D apa pun yang dapat dilihat orang lain, moderasi bukanlah sesuatu yang opsional. Moderasi merupakan komponen infrastruktur inti.

Pipeline Pemeriksaan Otomatis

Setiap aset yang masuk ke dunia melewati pipeline bertahap sebelum dapat dilihat oleh pemain lain:

  1. Analisis geometri. Pindai mesh untuk mendeteksi bentuk anatomi eksplisit menggunakan classifier terlatih. Langkah ini menangkap sebagian besar model 3D yang jelas-jelas tidak pantas. Beberapa API komersial (Azure Content Safety, Google Cloud Vision for 3D) dapat menanganinya. Classifier dijalankan pada siluet mesh dari berbagai sudut, yang secara komputasi ringan.

  2. Analisis tekstur. Jalankan setiap tekstur melalui API moderasi konten gambar standar (API yang sama dengan yang digunakan untuk foto unggahan). Langkah ini menangkap gambar tidak pantas yang diterapkan sebagai tekstur pada geometri yang sebenarnya tidak bermasalah.

  3. Deteksi teks. Jika objek berisi teks (baik dalam tekstur maupun sebagai mesh teks 3D), jalankan OCR dan periksa kesesuaiannya dengan kebijakan konten. Langkah ini menangkap ujaran kebencian, kata-kata hinaan, dan pelanggaran berbasis teks lainnya.

  4. Persetujuan otomatis. Jika semua pemeriksaan lolos, aset langsung dapat dilihat. Jika pemeriksaan mana pun menandai aset tersebut, aset masuk ke antrean peninjauan.

  5. Peninjauan manusia. Aset yang ditandai ditinjau oleh moderator. Untuk platform kecil, tim internal dapat melakukannya. Dalam skala besar, gunakan layanan moderasi kontrak (layanan yang sama dengan yang memoderasi konten media sosial).

Moderasi Spasial

Selain aset individual, susunan spasial objek dapat menjadi tidak pantas meskipun setiap objeknya sendiri tidak bermasalah. Hal ini lebih sulit dideteksi secara otomatis. Pendekatan praktisnya:

  • Pelaporan pemain. Setiap pemain dapat melaporkan suatu lokasi. Laporan menyertakan tangkapan layar (diambil secara otomatis pada koordinat yang dilaporkan) dan akun pemain pelapor. Laporan memicu peninjauan manusia.
  • Pemetaan panas. Lacak area mana yang menghasilkan laporan. Jika petak milik seorang kreator terus-menerus menghasilkan laporan, eskalasikan untuk ditinjau. Jika seorang kreator berulang kali terbukti melakukan pelanggaran, batasi izin penyuntingannya.
  • Rating persil. Seperti Second Life, izinkan kreator memberi rating sendiri pada persil mereka. Tampilan bawaan menyembunyikan persil dengan rating di atas "Umum". Pemain harus memilih untuk melihat konten dewasa. Ini tidak mencegah pelanggaran, tetapi mengurangi paparan.

Pertimbangan Latensi

Jika pemeriksaan otomatis membutuhkan waktu 5-10 detik per aset, akan ada jeda yang terasa antara saat kreator menempatkan objek dan saat objek tersebut muncul bagi pemain lain. Pilihannya:

  • Tampilan lokal optimistis. Kreator langsung melihat objek yang ditempatkannya. Pemain lain melihatnya setelah disetujui. Jika aset ditolak, aset tersebut menghilang dan kreator diberi tahu.
  • Pustaka aset yang telah disetujui. Sebagian besar penempatan menggunakan aset yang telah diperiksa dari pustaka platform (termasuk aset buatan AI yang diperiksa selama proses pembuatan). Unggahan kustom menjalani pemeriksaan. Artinya, sebagian besar penempatan berlangsung seketika.
  • Jalur cepat berbasis reputasi. Kreator dengan riwayat konten yang disetujui memperoleh persetujuan otomatis untuk penempatan baru. Kreator baru atau kreator yang ditandai menjalani pemeriksaan lengkap.

Performa 3D Browser: Angka Nyata

Anggaran teoretis memang berguna. Performa aktual yang terukur jauh lebih berguna. Berikut angka nyata dari scene 3D browser yang berjalan pada perangkat produksi.

Tolok Ukur Rendering

Scene Three.js dengan 10.000 objek hasil instancing (pohon, batu, masing-masing 500 segitiga):

  • MacBook Pro M1 (Chrome, WebGL2): 58-60fps
  • Desktop RTX 3060 (Chrome, WebGL2): stabil pada 60fps
  • Laptop Intel UHD 620 (Chrome, WebGL2): 25-35fps
  • iPhone 13 (Safari, WebGL2): 30-40fps

Scene Three.js dengan 100.000 helai rumput hasil instancing (masing-masing 6 segitiga, total 600K segitiga):

  • M1 MacBook: 55fps
  • RTX 3060: 60fps
  • Intel UHD 620: 12fps
  • iPhone 13: 15fps

Medan Babylon.js dengan 1 juta segitiga, 4 tingkat LOD, fisika Havok:

  • M1 MacBook (WebGPU): 60fps
  • M1 MacBook (WebGL2): 45fps
  • RTX 3060 (WebGPU): 60fps
  • RTX 3060 (WebGL2): 55fps

Scene Gaussian splat, 2 juta splat (melalui gsplat.js):

  • M1 MacBook (WebGL2): 30fps
  • RTX 3060 (WebGL2): 45fps
  • RTX 3060 (WebGPU): 60fps

Pengukuran Memori

Scene minimal Three.js (skybox, medan, 100 objek): memori GPU 80-120 MB, heap JS 150-200 MB Babylon.js dengan fisika Havok: memori GPU 200-300 MB, heap JS 250-350 MB (Havok Wasm menambahkan sekitar 50 MB) Batas memori tab browser (berdasarkan pengukuran, bukan dokumentasi):

  • Chrome desktop: biasanya crash pada sekitar 4 GB
  • Chrome Android: biasanya crash pada sekitar 1-1,5 GB
  • Safari iOS: biasanya crash pada sekitar 1 GB
  • Firefox desktop: biasanya crash pada sekitar 3-4 GB

Pengukuran Jaringan

Latensi bolak-balik WebSocket (browser ke edge Cloudflare):

  • Benua yang sama: 10-30md
  • Antar-benua: 80-200md
  • Dengan Cloudflare Durable Objects: tambahkan 5-10md untuk aktivasi DO pada permintaan pertama

Latensi WebRTC DataChannel (browser ke browser melalui TURN):

  • Kota yang sama: 5-15md
  • Benua yang sama: 20-50md
  • Antar-benua: 100-250md

Latensi WebTransport (HTTP/3 QUIC) sebanding dengan WebSocket, tetapi tanpa head-of-line blocking, sehingga latensi P99 jauh lebih baik (tidak ada kemacetan akibat satu paket yang hilang).

Pengukuran Waktu Muat

Scene kosong Three.js (hanya pustaka): 350md hingga frame pertama Scene kosong Babylon.js: 500md hingga frame pertama Model GLB 1 MB melalui fetch + parse: 200-400md pada broadband Tekstur KTX2, 1024x1024, Basis Universal: 50-100md untuk didekode di GPU Mesh terkompresi Draco, 50K segitiga: 30-80md untuk didekode di Web Worker

Angka-angka ini menegaskan bahwa anggaran performa dalam bagian arsitektur dapat dicapai. Desktop kelas menengah dapat merender scene dunia terbuka yang kompleks pada 60fps. Perangkat seluler menjadi kendalanya: Anda memerlukan LOD agresif dan jarak pandang yang lebih pendek untuk mempertahankan 30fps di ponsel.

Stack Lengkap

Dengan menggabungkan semuanya, berikut arsitektur untuk dunia terbuka kreator multipemain berbasis browser:

Klien (Browser)

LapisanTeknologiPeran
RendererBabylon.js (WebGPU + fallback WebGL2)Rendering scene, medan, LOD, pascapemrosesan
MedanSistem heightmap kustom + Babylon DynamicTerrainMedan streaming berbasis chunk dengan splatting
FisikaRapier (Wasm) atau Havok (melalui Babylon)Pengontrol karakter, tabrakan, raycasting
ECSbitECSPengelolaan entitas untuk semua objek dunia
JaringanWebSocket + WebRTC DataChannelSinkronisasi state, pembaruan posisi, obrolan suara
StateYjs (CRDT)Penyuntingan dunia kolaboratif, resolusi konflik
AudioWeb Audio APIAudio spasial, suasana, musik
UIOverlay HTML/CSSHUD, inventaris, obrolan, alat kreator
WorkerWeb WorkersDekompresi aset, fisika, pembuatan medan

Server

LapisanTeknologiPeran
Shard duniaCloudflare Durable ObjectsState otoritatif per chunk, endpoint WebSocket
Penyimpanan asetCloudflare R2Model GLB, tekstur KTX2, heightmap, audio
CDN asetCloudflare CDN (bucket publik R2)Pengiriman aset dunia yang di-cache di edge
Pembuatan AIInstans GPU (Hetzner/Lambda/RunPod)Pembuatan model 3D, medan, dan tekstur
Pipeline asetCloudflare Queue + WorkersPembuatan LOD, optimasi mesh, konversi format
AutentikasiAuth0Identitas kreator, izin
DatabaseCloudflare D1Metadata dunia, inventaris kreator, izin
Real-timeCloudflare Durable Objects + Pub/SubKehadiran pemain, obrolan, penyiaran peristiwa

Alur Data

  1. Pemain membuka dunia di browser mereka
  2. Klien melakukan autentikasi, lalu terhubung ke Durable Object terdekat untuk chunk tempat mereka muncul
  3. DO mengirimkan state chunk terkini (medan + objek + pemain di sekitar)
  4. Klien mulai merender dan meminta chunk yang berdekatan dari R2/CDN
  5. Saat pemain bergerak, klien terhubung ke DO yang berdekatan dan memutuskan koneksi dari DO yang jauh
  6. Kreator menempatkan objek: klien mengirimkan penyuntingan ke DO, DO memvalidasi lalu menyiarkannya ke semua klien yang terhubung melalui delta CRDT
  7. DO menyimpan state chunk ke penyimpanan pada setiap penyuntingan (dengan debounce)
  8. Pemain lain melihat objek baru muncul dalam 100-200md

Anggaran Performa

Untuk pengalaman 60fps pada desktop kelas menengah (RTX 3060 / M1 Mac / RAM 16GB):

Sumber DayaAnggaranCatatan
Draw call< 500 per frameBatching, instancing, LOD
Segitiga< 2 juta per frameLOD menjaga jumlahnya tetap terkendali
Memori tekstur< 512 MBKompresi KTX2, streaming, pooling atlas
Memori geometri< 256 MBBuffer bersama, pooling, pelepasan agresif
Heap JavaScript< 512 MBECS menggunakan typed array, bukan objek
Jaringan< 500 KB/dtk berkelanjutanKompresi delta, pemfilteran relevansi spasial
Pemuatan awal< 10 MB, < 5 detikPemuatan progresif, medan terlebih dahulu
Pemuatan chunk< 200 KB, < 200mdPra-ambil chunk yang berdekatan

Game Browser Sukses dan Hal yang Dibuktikannya

Game browser bukanlah pasar khusus. Game browser merupakan salah satu pasar game terbesar. Poki melayani lebih dari 100 juta pemain bulanan. CrazyGames, Newgrounds, dan itch.io melayani jutaan pemain lainnya. Game yang berhasil di browser memiliki pola arsitektur tertentu yang layak dipelajari.

Game 3D Browser yang Tersedia Saat Ini

Hordes.io: lebih dari 200 pemain dalam MMO browser 3D persisten. WebGL kustom, gaya low-poly, dimuat dalam waktu kurang dari 5 detik. Dibuat oleh satu pengembang.
**Hordes.io** adalah MMO browser yang paling relevan. Dibuat oleh pengembang solo menggunakan rendering WebGL kustom, game ini menempatkan lebih dari 200 pemain dalam dunia 3D persisten dengan pertarungan waktu nyata, guild, kelas, dan PvP. Seluruh game dimuat dalam waktu kurang dari 5 detik. Dunianya dibagi menjadi beberapa zona dengan culling agresif. Model pemainnya sederhana (low-poly dengan flat shading), tetapi efek partikel dan animasinya membuat pertarungan terasa responsif. Hordes.io membuktikan tiga hal: MMO browser dapat menangani ratusan pemain serentak dalam satu scene, pengembang solo dapat membuatnya, dan grafis bergaya memiliki performa lebih baik daripada grafis realistis di browser.
Krunker.io: 10 juta pemain bulanan, dibuat dengan Three.js, dilengkapi editor peta lengkap di dalam browser dan marketplace konten buatan pengguna.

Krunker.io pernah mencapai lebih dari 10 juta pemain bulanan dan kemudian diakuisisi oleh FRVR. Ini adalah FPS berbasis browser dengan editor peta lengkap, mode permainan kustom, konten buatan pengguna, dan marketplace. Dibuat dengan Three.js, game ini berjalan pada 60fps+ bahkan di perangkat kelas bawah berkat gaya visual kotak-kotak dan optimasi agresif. Editor levelnya sangat relevan. Pemain membuat peta menggunakan sistem blok mirip voxel, membagikannya di marketplace, lalu pemain lain memainkannya. Ini adalah siklus dunia kreator dalam skala kecil: buat sesuatu, bagikan, lalu biarkan orang lain mengalaminya. Krunker membuktikan bahwa konten 3D buatan pengguna dapat berfungsi di browser jika alat pembuatannya cukup sederhana.

ev.io adalah FPS browser yang dibuat dengan Babylon.js. Game ini berjalan baik di sebagian besar perangkat, mendukung peta kustom, dan menunjukkan bahwa renderer WebGL milik Babylon dapat menangani aksi 3D bertempo cepat di tab browser. Game ini menggunakan kompresi tekstur agresif dan lingkungan low-poly agar tetap sesuai dengan batas anggaran performa.

Shell Shockers (lebih dari 5 juta pemain bulanan) adalah shooter multipemain 3D tempat Anda bermain sebagai telur. Dibuat dengan Three.js, game ini menangani multipemain waktu nyata dengan deteksi tembakan yang responsif di browser. Gaya visual kartunnya menjaga kebutuhan aset tetap minimal sekaligus tetap terlihat rapi.

Townscaper: klik untuk menempatkan bangunan, lalu sistem secara otomatis menghasilkan jalan, lengkungan, dan tangga. Tanpa menu, tanpa tujuan. Terjual lebih dari 1 juta kopi berkat kegembiraan berkreasi semata.

Townscaper bukanlah game browser, tetapi pendekatannya terhadap pembangunan dunia sangat relevan. Pemain mengeklik untuk menempatkan bangunan di atas permukaan air. Game ini secara otomatis menghasilkan detail arsitektur, jalan, lengkungan, dan tangga berdasarkan pola penempatan. Tanpa menu, tanpa pengaturan, tanpa tujuan. Cukup klik dan bangun. Game ini terjual lebih dari 1 juta kopi. Pelajarannya: terkadang alat kreasi yang paling sederhana menghasilkan pengalaman yang paling menarik. Jika kita dapat membuat penempatan objek di dunia terasa selangsung Townscaper, kreator akan menghabiskan waktu berjam-jam untuk membangun.

Pengalaman A-Frame / 8th Wall. A-Frame (dibuat dengan Three.js) mendukung ribuan pengalaman 3D berbasis web. 8th Wall, platform WebAR veteran yang diakuisisi Niantic, menunjukkan bahwa AR kompleks berbasis kamera dapat berjalan di browser seluler tanpa plugin, meskipun Niantic mengumumkan pada akhir 2025 bahwa layanan tersebut sedang dihentikan secara bertahap (pengalaman yang di-host akan tetap aktif hingga 2027). Ini bukan game, tetapi semuanya menunjukkan bahwa rendering 3D kompleks dengan fisika dan interaksi dapat berjalan di tab browser tanpa plugin. Banyak dari pengalaman ini dimuat dalam 2–3 detik dan berjalan di ponsel kelas menengah.

Vuntra City: Laboratorium Kota Prosedural Aktif

Vuntra City adalah proyek native UE5, bukan game browser, sehingga bukan tolok ukur performa langsung untuk stack kita. Meski demikian, ini tetap menjadi salah satu studi kasus publik yang paling berguna bagi arsitektur dunia terbuka kita karena devlog-nya menjelaskan secara sangat spesifik kompromi desain sistem di bawah tekanan produksi nyata.

Salah satu pelajaran kuatnya adalah kebijakan detail yang mempertimbangkan kecepatan. Dalam video transportasi dan optimasi, pergerakan berkecepatan tinggi dialihkan ke atas atap, sementara detail dunia dikurangi seiring meningkatnya kecepatan agar pengelola streaming tidak kewalahan oleh pergantian interior (transportasi cepat, teknik optimasi). Ini sangat sesuai dengan rencana browser kita, di mana kecepatan harus secara langsung mengontrol radius prefetch, jangkauan aktivasi interior, dan anggaran spawn per frame.

Pelajaran lainnya adalah pemisahan tegas antara data topologi dan objek yang dirender. Implementasi peta dan alamat menggunakan pengontrol topologi global yang dapat menjawab kueri lokasi dan alamat untuk wilayah yang belum dimuat (peta dan alamat). Inilah pola yang kita perlukan untuk routing otoritatif server, pencarian POI, dan kueri tingkat dunia yang tidak boleh bergantung pada apa yang sedang dimiliki satu klien di memori.

Pengerjaan NPC-nya juga sangat relevan. Sistem sejuta NPC menghitung status jadwal kasar secara global, lalu hanya menyimulasikan perilaku mahal di ruang yang berdekatan dengan pemain (sejuta NPC persisten, di balik layar). Bagi kita, hal ini memperkuat model simulasi dua tingkat: status medan jauh yang murah dan deterministik, serta perilaku medan dekat yang kaya di dalam AOI.

Terakhir, desain lingkungan Vuntra City menegaskan sesuatu yang mudah dilupakan dalam perencanaan teknis: desain distribusi adalah desain konten. Proyek ini menghindari penempatan acak yang seragam, menggunakan pencilan berbobot untuk menghasilkan kejutan, dan mendorong eksplorasi melalui peta serta alamat diegetik alih-alih penanda minimap yang selalu hadir (lingkungan prosedural tidak harus membosankan, ke tujuan kita, kita tidak akan membutuhkan minimap).

Game Browser yang Menjadi Sangat Besar

Agar.io (2015) membuktikan bahwa multipemain browser dapat menjangkau jutaan orang. Pada puncaknya, game ini memiliki lebih dari 100.000 pemain serentak di berbagai server. Game ini berbentuk 2D dan secara mekanis sederhana (tumbuh dengan menyerap sel yang lebih kecil), tetapi arsitektur jaringannya menangani konkurensi masif melalui partisi spasial. Setiap server menjalankan satu wilayah dunia game. Pemain hanya menerima pembaruan tentang entitas yang berada dalam pandangan mereka. Ini adalah pola pengelolaan relevansi yang sama dengan yang dibutuhkan dunia terbuka 3D, hanya saja dalam 2D.

Slither.io mengembangkan keberhasilan Agar.io dan membuktikan bahwa model tersebut dapat diskalakan. Pada puncaknya, game ini memiliki 67 juta pengguna aktif bulanan. Game ini menggunakan WebSocket untuk sinkronisasi posisi waktu nyata dan partisi spasial guna membatasi lalu lintas jaringan. Satu detail yang patut diperhatikan: deteksi tabrakan sisi server Slither.io berjalan pada tick rate yang lebih rendah untuk pemain jauh (5 Hz) dibandingkan pemain di sekitar (30 Hz). Tick rate variabel berdasarkan jarak ini dapat diterapkan pada dunia terbuka 3D.

Surviv.io adalah battle royale berbasis browser yang mencapai 50 juta pemain bulanan sebelum diakuisisi oleh Kongregate. Game ini menjalankan pertandingan battle royale penuh berisi 80 pemain sepenuhnya di browser, lengkap dengan fisika berjaringan waktu nyata, lingkungan yang dapat dihancurkan, dan pengambilan item. Petanya disusun secara prosedural dari templat bangunan yang telah dirancang sebelumnya, sebuah pola yang dapat kita gunakan untuk struktur yang ditempatkan kreator.

Zombs Royale menjalankan battle royale 100 pemain di browser dengan waktu muat cepat dan jaringan responsif. Seperti Surviv.io, game ini membuktikan bahwa jumlah pemain besar dalam game browser waktu nyata layak secara komersial, bukan sekadar memungkinkan secara teknis.

Benang merah dari semua game browser sukses ini: semuanya dimuat dengan cepat (kurang dari 5 detik), berfungsi di perangkat apa pun, memiliki gaya visual sederhana tetapi konsisten, dan menggunakan jaringan yang dioptimalkan untuk gameplay spesifiknya (partisi spasial, laju pembaruan variabel, serta culling agresif terhadap status yang jauh).

RuneScape: MMO yang Beralih ke Browser

RuneScape: MMO lengkap dengan konten selama lebih dari 20 tahun yang berjalan di tab browser. Protokol biner kustom, streaming berbasis tile, 2.000 pemain serentak per server. Bukti bahwa MMO browser berfungsi dalam skala besar.

RuneScape adalah studi kasus terpenting untuk dunia terbuka berbasis browser karena hal ini benar-benar telah dilakukan. Jagex memindahkan seluruh MMO dengan konten selama 20 tahun ke browser.

RuneScape awalnya berjalan sebagai applet Java. Ketika browser menghentikan dukungan Java, Jagex membangun ulang kliennya dalam C++ dan juga merilis klien HTML5/WebGL yang berfungsi penuh. Old School RuneScape (versi retro) kini berjalan sepenuhnya di browser melalui klien yang dikompilasi dengan Emscripten ke WebAssembly. Game ini menangani dunia persisten yang luas, multipemain waktu nyata dengan ratusan pemain per server, ekonomi dengan grand exchange (balai lelang) yang berfungsi, serta 23 skill dengan sistem progresi mendalam.

Detail teknis yang penting:

  • Dunia dibagi menjadi petak peta (wilayah berukuran 64x64 tile). Klien memuat grid wilayah 13x13 di sekitar pemain (104x104 tile terlihat). Wilayah di luar grid ini di-cull sepenuhnya.
  • Medannya berbasis tile dengan nilai ketinggian di setiap sudut tile. Overlay medan (jalur, tepian air, transisi pantai) menggunakan sistem bentuk dengan 12 varian rotasi untuk setiap bentuk. Ini lebih terbatas daripada heightmap, tetapi sangat ringkas dan cepat untuk di-stream.
  • Protokol jaringannya berupa biner kustom melalui WebSocket. Setiap jenis paket memiliki struktur yang ditentukan. Pembaruan posisi pemain menggunakan 2 byte untuk koordinat petak peta dan encoding panjang variabel untuk jenis pergerakan. Peristiwa obrolan, perdagangan, dan pertarungan memiliki format biner ringkasnya sendiri. Seluruh protokol sangat dioptimalkan untuk meminimalkan bandwidth.
  • Rendering objek menggunakan sistem model, tempat server mengirimkan ID model dan klien merender model yang telah di-cache. Sebagian besar model dimuat sekali lalu digunakan kembali. Artinya, dunia di-stream sebagai metadata (model apa ditempatkan di mana), bukan dengan streaming geometri.
  • Setiap instance server menangani 2.000 pemain serentak di seluruh dunia game. Dunia ini tidak di-shard secara spasial. Satu proses server mengelola semua pemain, semua NPC, dan seluruh logika game pada game tick 600ms. Ini berfungsi karena logika game per tick sederhana: memproses tindakan pemain, memperbarui AI NPC, menyelesaikan pertarungan, dan menyiarkan perubahan status.

Yang dibuktikan RuneScape bagi kasus kita: MMO lengkap dengan status dunia persisten, ribuan pemain, sistem game kompleks, dan ekonomi nyata dapat berjalan di tab browser. Unduhan kliennya berukuran kurang dari 50 MB, dimuat dalam beberapa detik, dan berjalan di laptop. Jika MMO Java berusia 20 tahun dapat melakukan transisi tersebut, dunia browser yang sengaja dirancang untuk platform ini akan memiliki lebih sedikit kendala.

Bagian pendekatan RuneScape yang tidak cocok: Rendering RuneScape bersifat isometrik dengan kamera tetap, bukan 3D orang pertama/ketiga. Fidelitas visualnya rendah menurut standar modern. Dunianya juga tidak dapat diedit oleh kreator. Namun, arsitektur jaringan, streaming berbasis tile, dan bukti bahwa MMO browser dapat mempertahankan pemain selama puluhan tahun semuanya sangat relevan.

Habbo Hotel: Ruang Sosial yang Bertahan Selama 25 Tahun

Habbo Hotel diluncurkan pada tahun 2000 dan masih berjalan hingga sekarang. Ini adalah dunia sosial isometrik 2D tempat pengguna membuat dan mendekorasi ruangan, mengunjungi ruangan milik orang lain, dan bersosialisasi. Pada puncaknya, Habbo memiliki 9 juta pengguna bulanan. Seluruh pengalaman ini berjalan di Flash (kini HTML5 setelah Flash dihentikan).

Habbo penting karena keberhasilannya mempertahankan komunitas kreator dalam waktu lama. Sistem ruangannya pada dasarnya adalah versi 2D dari apa yang sedang kita bangun: pengguna menempatkan objek furnitur pada grid, menyesuaikan tata letak, dan mengundang orang lain untuk berkunjung. Model ekonominya (pengguna membeli furnitur virtual dengan uang sungguhan) telah menghasilkan lebih dari $1 miliar dalam pendapatan sepanjang masa.

Pelajaran dari Habbo:

  • Ruang berbasis ruangan dengan interior buatan pengguna dapat berfungsi sebagai platform sosial selama puluhan tahun jika alat kreasinya sederhana dan fitur sosialnya kuat.
  • Ekonomi furnitur virtual mempertahankan keterlibatan jangka panjang. Pengguna membeli, memperdagangkan, dan mengoleksi item. Item tersebut tidak memiliki kegunaan gameplay. Semuanya murni untuk ekspresi diri dan status.
  • Moderasi di ruang sosial memerlukan investasi berkelanjutan. Habbo telah mengalami beberapa krisis moderasi. Penyaringan konten otomatis, moderator manusia, dan pelaporan komunitas merupakan pendekatan minimum yang layak.
  • Transisi dari Flash ke HTML5 (selesai sekitar 2020–2021) membuktikan bahwa dunia sosial besar dapat memigrasikan teknologi rendering tanpa kehilangan komunitasnya. Pengguna peduli pada ruangan dan teman mereka, bukan teknologi yang mendasarinya.

Among Us dan Game Sosial Spasial

Among Us bukanlah dunia terbuka, tetapi kesuksesannya mengungkapkan sesuatu yang penting tentang ruang multipemain: pemain ingin berada di suatu tempat bersama-sama, bukan sekadar berada dalam game yang sama. Mod obrolan berbasis kedekatan spasial yang menjadi viral menunjukkan bahwa berada di ruangan virtual yang sama dengan audio terarah mengubah multipemain dari mekanik game menjadi pengalaman sosial. Fitur sosial spasial yang meningkatkan kualitas dunia kreator:

  • Obrolan suara berbasis kedekatan dengan volume yang meredup seiring bertambahnya jarak. Dekati seseorang untuk berbicara. Menjauhlah dan suaranya akan memudar. Ini menciptakan kelompok sosial alami tanpa memerlukan pengelolaan saluran suara.
  • Sistem emote dan gestur memungkinkan pemain mengekspresikan diri tanpa suara. Lambaian tangan, tarian, gestur menunjuk. Fitur-fitur ini murah untuk diimplementasikan (animasi pada avatar pemain) dan meningkatkan interaksi sosial secara tidak proporsional.
  • Aktivitas bersama yang berlangsung di dalam dunia (bukan melalui menu) mengubah sebuah ruang menjadi tempat berkegiatan. Jika dua kreator dapat duduk di meja virtual dan melihat model 3D bersama-sama, dunia tersebut memiliki alasan untuk hadir selain sekadar menampilkan konten statis.

Game Browser yang Berhasil Berkembang di Poki dan CrazyGames

Poki dan CrazyGames secara kolektif melayani lebih dari 150 juta pemain setiap bulan. Game yang berkinerja terbaik di platform-platform ini memberikan wawasan tentang hal-hal yang secara khusus berhasil di browser.

Pola berkinerja terbaik di portal game browser:

  • Dapat langsung dimainkan (kurang dari 3 detik hingga interaktif). Tidak perlu masuk akun. Tidak perlu tutorial. Game harus dapat dipahami dalam waktu 5 detik setelah halaman dibuka.
  • Durasi sesi yang fleksibel. Pemain dapat bergabung selama 2 menit atau 2 jam. Game mengakomodasi keduanya. Untuk dunia kreator, ini berarti dunia harus dapat dijelajahi tanpa komitmen terhadap suatu sesi. Berjalan-jalan, melihat hal-hal menarik, lalu pergi. Atau tetap tinggal dan membangun selama berjam-jam.
  • Kompatibilitas seluler. Lebih dari 60% lalu lintas Poki berasal dari perangkat seluler. Dunia browser yang hanya berfungsi di desktop akan kehilangan mayoritas calon pengunjung.
  • Fitur sosial yang tidak mengharuskan pemain memiliki teman. Papan peringkat, reaksi terhadap konten pemain lain, dan fitur asinkron (melihat apa yang dibangun pemain lain tanpa harus online pada waktu yang sama).

Game 3D paling sukses di portal-portal ini (seperti Shell Shockers, 1v1.LOL, dan Smash Karts) mempertahankan jumlah poligon yang rendah, tekstur yang sederhana, dan laju bingkai yang tinggi. Game-game tersebut membuktikan bahwa pemain menerima grafis sederhana jika pengalamannya mulus dan responsif.

Platform Kreator Berbasis Browser

Hubs dari Mozilla (kini dikelola komunitas). Ruang 3D multipengguna di browser yang dibangun menggunakan Three.js dan A-Frame. Mendukung obrolan suara, avatar, dan objek bersama. Bukan dunia terbuka (berbasis ruangan), tetapi arsitektur jaringan dan rendering-nya relevan. Mozilla menjadikannya sumber terbuka sebelum menghentikan layanan hosting-nya, sehingga seluruh basis kode tersedia untuk dipelajari. GitHub.

Hyperfy. Platform metaverse berbasis web yang berjalan sepenuhnya di browser. Menawarkan rendering Three.js, multipemain, kustomisasi avatar, dan pembangunan dunia. Lebih mendekati target kita daripada Hubs karena menekankan alat kreator. Dunia dimuat di tab browser tanpa perlu mengunduh apa pun. hyperfy.io.

Ethereal Engine (sebelumnya XREngine). Mesin sumber terbuka untuk dunia multipengguna yang dibangun menggunakan Three.js dan bitECS. Mendukung WebXR, audio spasial, dan penyuntingan dunia. Memiliki arsitektur ECS, lapisan jaringan, dan alat editor bawaan. Ini adalah proyek sumber terbuka yang paling mendekati hal yang sedang kita gambarkan. Layak dipelajari untuk melihat cara mereka mengintegrasikan bitECS dengan Three.js dalam pengelolaan entitas serta cara jaringan mereka menangani status spasial. GitHub.

Dusk (sebelumnya Rune). SDK game multipemain untuk game web. Menangani lapisan jaringan sehingga pengembang dapat berfokus pada gameplay. Pendekatan sinkronisasi statusnya menggunakan status terprediksi dengan rekonsiliasi server, yang merupakan model standar untuk multipemain yang responsif. SDK ini menyembunyikan kompleksitas netcode rollback. Layak dipelajari dari sisi pengalaman pengembangnya.

Niantic Studio. Editor visual berbasis browser dan mesin game web (penerus perangkat 8th Wall) untuk membangun pengalaman 3D dan XR yang dapat dikunjungi orang lain melalui browser. Platform ini menunjukkan bahwa kreator nonteknis dapat membangun adegan 3D di browser jika alatnya mudah digunakan. (Niantic memisahkan pekerjaan geospasialnya menjadi Niantic Spatial dan menjual bisnis gamenya, termasuk Pokemon GO, kepada Scopely pada 2025.)

PlayCanvas Editor. Bukan game, tetapi editor 3D berbasis cloud milik PlayCanvas menunjukkan bahwa alat pembangunan dunia kolaboratif dapat berjalan di browser. Beberapa anggota tim dapat menyunting adegan yang sama secara bersamaan. Editor menyampaikan perubahan melalui lapisan sinkronisasi waktu nyata. Inilah model kreasi kolaboratif yang kita perlukan, tetapi dengan dunia kita sebagai kanvas, bukan editor game.

Platform Kreator Native (Pelajaran untuk Browser)

Platform-platform ini berjalan sebagai aplikasi native, tetapi keputusan desainnya mengenai alat kreator, persistensi dunia, dan dinamika sosial dapat diterapkan secara langsung.

Roblox: lebih dari 80 juta pengguna harian, $740 juta dibayarkan kepada kreator pada 2023. Kreasi dilakukan di dalam mesin. Penemuan konten bersifat sosial. Model bisnis yang membuktikan bahwa platform kreator dapat menopang dirinya sendiri.

Roblox adalah referensi terpenting untuk sebuah dunia kreator. Lebih dari 80 juta pengguna aktif harian. Kreator membangun pengalaman 3D lengkap (game, ruang sosial, toko) yang dikunjungi pemain lain. Platform ini menangani hosting, jaringan, penemuan konten, dan monetisasi.

Hal-hal yang dilakukan Roblox dengan benar:

  • Kreasi dilakukan di dalam mesin. Roblox Studio adalah lingkungan yang sama dengan yang dialami pemain. Kreator dapat langsung menguji karya mereka. Tidak ada siklus ekspor/unggah/tunggu. Untuk dunia browser, editornya harus berupa dunia itu sendiri.
  • Scripting mudah diakses. Lua (bahasa scripting Roblox) cukup sederhana untuk dipelajari anak-anak. Perilaku kompleks dimungkinkan, tetapi tidak wajib. Hambatan awalnya rendah dan batas kemampuannya tinggi.
  • Penemuan konten bersifat sosial. Anda menemukan pengalaman karena teman sedang memainkannya. Halaman beranda menampilkan pengalaman yang sedang tren. Untuk dunia browser, dunia itu sendiri adalah sarana penemuan. Anda menjelajah dan menemukan berbagai hal dengan berjalan-jalan.
  • Monetisasi berhasil. Kreator memperoleh uang sungguhan (Roblox membayarkan $740 juta kepada kreator pada 2023). Ini menarik upaya kreatif yang serius. Tanpa insentif ekonomi, platform kreator berubah menjadi proyek hobi yang perlahan ditinggalkan.
  • Mesin rendering Roblox dibuat khusus dan berjalan di aplikasi native, bukan browser. Namun, anggaran aset per pengalaman tergolong sederhana menurut standar modern (maksimum yang direkomendasikan adalah 100 MB). Sebagian besar pengalaman Roblox yang sukses menggunakan seni low-poly bergaya, yang selaras dengan keterbatasan rendering browser.

Fortnite Creative / UEFN (Unreal Editor for Fortnite). Epic menghadirkan editor lengkap Unreal Engine bagi kreator Fortnite. Hasilnya adalah platform tempat orang membangun pulau (dunia mandiri) menggunakan alat kelas profesional. Fortnite menangani hosting, multipemain, dan distribusi.

Wawasan yang relevan:

  • Alat profesional menarik konten profesional. UEFN menghasilkan pengalaman visual yang memukau karena kreator memiliki akses ke seluruh kemampuan UE5. Konsekuensinya adalah kompleksitas. UEFN memiliki kurva pembelajaran yang curam.
  • Instancing berbasis pulau (setiap kreasi merupakan dunia terpisah) menghindari masalah moderasi dan konflik yang muncul dalam satu dunia bersama. Namun, ini juga berarti kreator tidak menemukan karya satu sama lain secara alami melalui penjelajahan. Anda mengunjungi pulau melalui menu, bukan dengan berjalan kaki.
  • Model bisnisnya berhasil. Program kreator Fortnite membayar berdasarkan interaksi. Kreator teratas menghasilkan jutaan dolar per tahun. Sekali lagi, insentif ekonomi mendorong kualitas.

Dreams (Media Molecule / PlayStation). Dreams memberi pemain konsol rangkaian alat kreasi 3D lengkap (pemodelan, animasi, musik, logika, desain level) serta platform untuk membagikan kreasi. Dalam hal kedalaman alat, ini adalah platform kreator paling ambisius yang pernah dibuat.

Wawasan yang relevan:

  • Pemodelan berbasis pahatan, bukan penyuntingan poligon. Kreator membentuk volume lunak menggunakan alat pindah/pegang/haluskan, mirip ZBrush tetapi lebih intuitif. Kurva pembelajarannya landai. Pendekatan ini sangat cocok untuk kreasi di browser karena tidak mengharuskan pengguna memahami vertex dan peta UV.
  • Semuanya merupakan aset bersama. Jika seseorang membuat model pohon, siapa pun dapat menggunakannya dalam kreasi mereka sendiri (dengan atribusi). Ini menciptakan ekosistem kreatif majemuk, tempat setiap kreasi menambah nilai platform.
  • Dreams kesulitan secara komersial meskipun mendapat pujian kritis. Masalahnya adalah distribusi: platform ini terbatas pada PlayStation, dan alat kreasinya begitu mendalam sehingga kebanyakan pemain tidak pernah beranjak dari sekadar mengonsumsi konten. Pelajarannya: alat kreasi harus cukup sederhana agar mayoritas pengguna mau mencobanya, meskipun hanya sebagian kecil yang menjadi pembangun serius.

Core (Manticore Games). Platform gratis untuk membuat dan memainkan game multipemain, dibangun menggunakan Unreal Engine dengan editor yang disederhanakan. Editor Core berjalan sebagai aplikasi native, tetapi filosofinya relevan. Templat dan skrip bersama dari komunitas memungkinkan pemula merakit game dari komponen siap pakai. Kreator tingkat lanjut dapat menulis skrip Lua untuk perilaku khusus. Core kesulitan menjangkau audiens besar, salah satunya karena game harus dimainkan melalui peluncur Core. Versi berbasis browser tidak akan mengalami hambatan ini.

VRChat dan Rec Room adalah platform sosial tempat kreator membangun ruang yang dikunjungi orang lain. VRChat menggunakan Unity dan berjalan di PC/VR. Rec Room berjalan di semua perangkat, termasuk seluler. Keduanya membuktikan bahwa dunia 3D buatan pengguna dapat mempertahankan komunitas besar. VRChat lebih mengesankan secara teknis (shader khusus, avatar kompleks). Rec Room lebih mudah diakses (alat kreasi dalam aplikasi, grafis lebih sederhana, dukungan platform lebih luas). Untuk dunia browser, pendekatan Rec Room berupa alat kreasi sederhana dalam aplikasi lebih dapat diterapkan daripada alur kerja VRChat yang mengandalkan alat eksternal.

Second Life: diluncurkan pada 2003, masih beroperasi dengan lebih dari 200 ribu pengguna harian. Sepenuhnya dibuat oleh pengguna. Kepemilikan berbasis persil, ekonomi virtual bernilai sekitar $500 juta per tahun. Pelajaran selama 20 tahun tentang persistensi dan moderasi.

Second Life adalah pelopor dari semua dunia kreator. Diluncurkan pada 2003, platform ini masih beroperasi dengan lebih dari 200.000 pengguna aktif harian. Seluruh dunianya dibuat oleh pengguna. Lahan dimiliki dan diperdagangkan. Kreator menjual objek, pakaian, dan bangunan. Bahasa scripting dalam dunianya (LSL) memungkinkan konten interaktif.

Hal-hal yang diajarkan Second Life setelah lebih dari 20 tahun:

  • Persistensi lebih penting daripada grafis. Visual Second Life sudah ketinggalan zaman, tetapi dunianya tetap bertahan. Kreasi tetap berada di tempat Anda meletakkannya. Hubungan dan sejarah terus terakumulasi. Persistensi inilah yang membuat orang terus kembali.
  • Ekonomi mendorong kreasi. PDB Second Life diperkirakan mencapai $500 juta per tahun. Kreator membangun karena mereka dapat menjual hasilnya. Tanpa insentif ekonomi, volume dan kualitas konten kreator akan menurun.
  • Konten buatan pengguna memerlukan infrastruktur moderasi. Second Life telah menghadapi tantangan moderasi selama 20 tahun. Platform apa pun yang memungkinkan pengguna menempatkan konten arbitrer di ruang bersama memerlukan pemindaian otomatis, alat pelaporan, dan peninjauan manusia.
  • Organisasi spasial berbasis lahan berhasil. Second Life membagi dunianya menjadi persil yang dimiliki pengguna. Setiap persil memiliki batas prim (objek). Ini secara alami mencegah satu kreator menghabiskan seluruh sumber daya. Untuk dunia browser, pola yang setara adalah kepemilikan berbasis chunk dengan anggaran objek per chunk.

Analisis Perbandingan: Hal yang Diajarkan Setiap Game kepada Kita

GamePelajaran UtamaTeknologi yang Dapat DiterapkanRisiko Jika Diabaikan
SkyrimStreaming berbasis chunk dengan kisi selMedan heightmap, tingkatan LOD, pemisahan interior/eksteriorDunia tidak muat dalam memori browser
The Witcher 3Komposisi dunia berlapis oleh tim-tim terpisahStreaming sadar konten, rendering impostorKreator tidak dapat bekerja secara independen
Breath of the WildAturan sistemik lebih unggul daripada konten berskripSistem interaksi material, gameplay berbasis fisikaDunia terasa statis dan mati
GTA VKehidupan sekitar membuat dunia terasa nyataSistem perilaku NPC, lalu lintas, waktu dalam sehariDunia kreator terasa seperti museum kosong
Elden RingVariasi kepadatan dan penggunaan ulang asetPustaka aset modular, zona renggang + padatTerlalu kosong atau terlalu mahal untuk diisi
No Man's SkyGenerasi prosedural untuk kanvas, konten kreator untuk jiwanyaMedan berbasis seed, model data markas yang ringkasMedan tanpa batas tetapi membosankan
MinecraftDunia yang sepenuhnya dapat diedit, alat sederhana, kedalaman tanpa batasStreaming chunk, kompresi palet, protokol pengeditan blokKreator tidak dapat membentuk ulang dunia itu sendiri
RobloxPembuatan berlangsung di dalam engine, ekonomi mendorong kualitasEditor dalam dunia, monetisasi kreatorTidak ada yang membangun karena tidak ada alasannya
Krunker.ioUGC browser dapat berjalan dalam skala besar dengan alat sederhanaRendering Three.js, editor berbasis voxel, marketplaceAlat pembuatan terlalu rumit bagi kreator kasual
Hordes.io200+ pemain dalam 3D di browser, layak dikembangkan oleh satu orangWebGL kustom, spatial culling, gaya visual stilistisMerekayasa lapisan multipemain secara berlebihan
Vuntra City (referensi native)Streaming sadar kecepatan dan simulasi dunia dua tingkat menjaga kota prosedural yang sangat luas tetap koherenKebijakan LOD yang digabungkan dengan kecepatan, lapisan kueri topologi, simulasi jadwal medan jauh + perilaku medan dekatPergerakan berkecepatan tinggi menyebabkan pop-in dan lonjakan simulasi
Agar.io / Slither.ioPartisi spasial memungkinkan konkurensi masifTick rate yang berubah berdasarkan jarak, pengelolaan area relevansiJaringan kolaps pada skala besar
Second LifePersistensi dan ekonomi menopang komunitas selama 20 tahunKepemilikan berbasis persil, anggaran objek, marketplaceTidak ada retensi jangka panjang
DreamsPembuatan berbasis pahatan lebih intuitif daripada pengeditan poligonPemodelan berbasis volume, pustaka aset bersamaAlat pembuatan terasa seperti program CAD
Fortnite CreativeAlat profesional menarik konten profesionalKemampuan editor lengkap di dalam platformBatas atas kualitas konten terlalu rendah
RuneScapeMMO lengkap berjalan di browser melalui Wasm dan protokol binerEmscripten, protokol WebSocket biner kustom, streaming tileMeremehkan kemampuan browser
Habbo HotelPembuatan ruangan sederhana menopang komunitas selama 25 tahunPenempatan berbasis kisi, ekonomi furnitur virtualMembuat alat pembuatan terlalu rumit

Game yang paling penting untuk kasus khusus kita (berbasis browser, berfokus pada kreator, multipemain) adalah Minecraft (dunia yang dapat diedit, data ringkas), Roblox (pembuatan dalam engine, ekonomi), Krunker (UGC browser dalam skala besar), dan Hordes.io (arsitektur MMO browser). Judul-judul AAA (Skyrim, BotW, Witcher 3) mengajarkan rendering dan streaming. Game browser populer (Agar.io, Slither.io, Surviv.io) mengajarkan jaringan berskala besar. Platform kreator (Roblox, Dreams, Second Life) mengajarkan dinamika komunitas. Vuntra City menambahkan referensi terkini pada tingkat implementasi untuk streaming sadar kecepatan, navigasi diegetik, dan pola simulasi jutaan agen di kota prosedural modern.

Seperti Apa Skyrim dan The Witcher Jika Dibuat untuk Browser

Mari kita bahas secara konkret. Jika Anda mengambil Whiterun dari Skyrim dan membangunnya ulang untuk disajikan melalui browser:

Medan: Area di sekitar Whiterun kira-kira berukuran 2 km x 2 km. Dengan ukuran chunk kita (64 m), itu sekitar 32x32 = 1024 chunk. Dengan 2-4 KB untuk heightmap setiap chunk, jumlahnya menjadi 2-4 MB data medan. Tekstur medan (rumput, tanah, batu, salju) sebagai tile atlas KTX2 mungkin menambah 5 MB lagi. Total medan: kurang dari 10 MB untuk seluruh wilayah.

Struktur: Whiterun sendiri mungkin memiliki 40-50 bangunan. Setiap bangunan dalam bentuk GLB yang dioptimalkan (3 tingkat LOD) mungkin berukuran 200-500 KB pada detail tertinggi. Namun, Anda hanya memerlukan detail penuh untuk 5-10 bangunan terdekat. Sisanya menggunakan LOD sedang atau rendah (masing-masing 50-100 KB). Total struktur yang terlihat pada satu waktu: 2-5 MB.

Vegetasi: Pohon dan rumput Skyrim di sekitar Whiterun semuanya dirender sebagai instance. Anda mungkin memerlukan 10 model pohon unik (masing-masing 200 KB pada LOD penuh, 20 KB sebagai impostor billboard) dan sistem rumput yang menghasilkan bilah-bilah rumput dari peta kepadatan di GPU. Total aset vegetasi: 2-3 MB. Data instancing (posisi, rotasi, skala) untuk area chunk 5x5: kurang dari 500 KB.

NPC: Whiterun memiliki sekitar 70 NPC bernama beserta para penjaga. Setiap avatar dengan kualitas sedang: 100-200 KB. Namun, hanya 10-20 yang terlihat pada satu waktu. Total data rendering NPC: 2-4 MB.

Total keseluruhan untuk area seukuran Whiterun yang terlihat pada satu waktu: 15-25 MB. Itu sangat layak dijalankan di browser. Pemuatan awal akan menampilkan medan dan struktur utama dalam 3-5 detik melalui koneksi broadband, lalu detail akan terisi selama beberapa detik berikutnya.

Novigrad dalam The Witcher 3 lebih luas dan padat, tetapi prinsip yang sama tetap berlaku. Anda akan membutuhkan LOD dan streaming yang lebih agresif, tetapi total data yang terlihat pada satu waktu tetap berada dalam batas memori browser.

Yang Akan Kita Bangun Terlebih Dahulu

Dunia terbuka penuh adalah proyek bertahun-tahun. Berikut jalur untuk menghadirkan sesuatu yang nyata ke tangan kreator dengan cepat:

Fase 1: Pulau Bersama (3 bulan). Satu chunk medan (pulau berukuran 512x512 m) dengan medan heightmap, air, vegetasi dasar, dan siklus siang/malam. Multipemain melalui Durable Objects (hingga 50 pengguna bersamaan). Kreator dapat menempatkan aset 3D buatan AI dari pustaka Cinevva mereka yang sudah ada. Anggap saja sebagai diorama bersama.

Fase 2: Dunia yang Dapat Diperluas (3 bulan). Streaming chunk untuk dunia berukuran 4x4 km. Persil milik kreator tempat mereka memiliki izin pengeditan. Sistem LOD untuk medan dan objek. Status dunia yang persisten. Hingga 200 pengguna bersamaan di seluruh dunia.

Fase 3: Dunia yang Hidup (6 bulan). Pemahatan medan berbantuan AI. Vegetasi dan atmosfer prosedural. Sistem misi/acara agar kreator dapat membangun pengalaman interaktif, bukan sekadar adegan statis. Obrolan suara. Kustomisasi avatar. Dunia ini menjadi destinasi, bukan demo.

Pertanyaan Terbuka

Gaya visual. Gaya stilistis (low-poly, cel-shaded) lebih murah untuk dirender dan lebih toleran terhadap aset buatan AI. Gaya realistis memerlukan aset berkualitas lebih tinggi dan anggaran rendering yang lebih besar. Skyrim tetap berhasil meskipun grafisnya sudah menua karena arahan visualnya konsisten. BotW tampak memukau di perangkat kelas tablet karena gaya cel-shaded menyamarkan jumlah poligon yang rendah. Minecraft menggunakan tekstur 16x16 dan merupakan salah satu game yang paling mudah dikenali sepanjang masa. Krunker.io dan Hordes.io sama-sama berhasil dengan grafis stilistis sederhana di browser. Bukti yang ada sangat mendukung arah stilistis untuk dunia browser. Kita perlu memilih identitas visual tertentu sejak awal dan menegakkan konsistensi di seluruh aset buatan AI.

Persistensi dunia vs. instancing. Apakah semua orang berbagi satu dunia (seperti MMO atau Second Life), atau setiap kreator mendapatkan instance sendiri yang dapat dikunjungi orang lain (seperti server Minecraft atau Fortnite Islands)? Teknologinya mendukung keduanya, tetapi dinamika sosialnya benar-benar berbeda. Dunia persisten bersama milik Second Life menciptakan penemuan tak terduga (Anda menemukan karya orang lain saat berjalan-jalan). Pulau berbasis instance milik Fortnite memerlukan sistem menu atau portal untuk penemuan. Roblox menggunakan pendekatan berbasis hub: game terpisah, tetapi Anda menelusuri dan menemukannya melalui antarmuka bersama. Pendekatan hibrida mungkin berhasil: overworld persisten bersama tempat kreator memiliki persil (seperti persil Second Life), dengan opsi untuk memasuki pengalaman mandiri melalui portal.

Kedalaman alat pembuatan. Dreams membuktikan bahwa alat pembuatan yang mendalam mengesankan kritikus tetapi mengintimidasi pengguna. Townscaper membuktikan bahwa alat minimal dapat terjual satu juta kopi. Roblox Studio berada di tengah: cukup sederhana untuk anak-anak, cukup mendalam untuk profesional. Editor voxel Krunker bahkan lebih sederhana. Untuk dunia browser, kita sebaiknya memulai dengan kesederhanaan setingkat Townscaper (tempatkan objek, lalu objek tersebut menempel dan terhubung secara otomatis) serta menambahkan kedalaman seiring waktu. Pengalaman awal untuk menempatkan objek pertama Anda di dunia seharusnya memakan waktu kurang dari 30 detik.

Ekonomi. Roblox, Second Life, dan Fortnite Creative semuanya membuktikan bahwa insentif ekonomi adalah hal yang mengubah mainan menjadi platform. Tanpa cara bagi kreator untuk memperoleh penghasilan dari karya mereka, kreator paling berbakat akan berkarya di tempat lain. Ini tidak harus diluncurkan pada hari pertama, tetapi arsitekturnya harus mendukungnya (kepemilikan objek, pelacakan kunjungan, atribusi kreator).

Perangkat seluler. WebGPU di perangkat seluler masih membutuhkan waktu bertahun-tahun sebelum dapat diandalkan. Pengalaman seluler perlu berupa versi yang disederhanakan: medan lebih sederhana, objek lebih sedikit, jarak pandang lebih pendek. Pendekatan Rec Room yang berjalan di semua perangkat dengan kualitas adaptif layak dipelajari. Atau kita merilis aplikasi native untuk perangkat seluler dan mempertahankan pengalaman penuh di browser.

Moderasi. Dunia terbuka tempat siapa pun dapat menempatkan apa pun adalah mimpi buruk moderasi. Second Life telah menangani masalah ini selama 20 tahun. Setiap aset yang ditempatkan memerlukan peninjauan konten otomatis sebelum dapat terlihat oleh orang lain. Ini menambah latensi pada proses kreatif, tetapi tidak dapat ditawar. Kita juga perlu mempertimbangkan klasifikasi konten berbasis persil (seperti sistem General/Moderate/Adult milik Second Life) agar kreator dapat menentukan batas konten mereka.

Interaksi sistemik. BotW dan Minecraft sama-sama menunjukkan bahwa sistem interaksi berbasis material menciptakan dunia yang jauh lebih menarik secara eksponensial daripada penempatan objek statis. Jika seorang kreator menempatkan jembatan kayu dan kreator lain menyalakan api di dekatnya, apakah jembatan itu harus terbakar? Jika seseorang menempatkan bendungan, apakah air harus menggenang di belakangnya? Interaksi ini membuat dunia terasa hidup, tetapi memerlukan aturan fisika dan material yang konsisten di seluruh konten kreator. Menentukan sejauh mana kita akan menerapkan desain sistemik merupakan keputusan arsitektur awal.

Kesimpulan Utama

Dunia terbuka 3D di browser sudah layak diwujudkan saat ini. Hordes.io menjalankan 200+ pemain dalam 3D di browser. Krunker.io pernah memiliki 10 juta pemain bulanan dengan editor peta 3D lengkap. Game .io membuktikan bahwa multipemain browser dapat diskalakan hingga jutaan pemain. Teknologinya bukan spekulasi.

Teknologi rendering sudah siap. Three.js dan Babylon.js menangani adegan 3D yang sebanding dengan game AAA awal 2010-an. WebGPU membuka akses ke compute shader untuk medan dan vegetasi. Engine fisika Wasm berjalan dengan performa hanya 2-3 kali lebih lambat daripada native. Area seukuran Whiterun dapat dimuat dalam 15-25 MB data yang terlihat.

Teknologi jaringan sudah siap. Cloudflare Durable Objects menyediakan server otoritatif per chunk di edge. CRDT menangani pengeditan kolaboratif tanpa konflik. Partisi spasial (yang telah dibuktikan oleh berbagai game, dari Agar.io hingga Skyrim) menjaga lalu lintas jaringan tetap terkendali untuk ratusan pemain bersamaan.

Dunia terbuka AAA (Skyrim, Witcher 3, BotW, Elden Ring, Minecraft, No Man's Sky) bukan sekadar tolok ukur grafis. Semua itu adalah buku ajar tentang streaming chunk, pengelolaan LOD, generasi prosedural, desain sistemik, dan komposisi dunia. Setiap teknik yang digunakannya memiliki padanan yang kompatibel dengan browser.

Platform kreator (Roblox, Second Life, Fortnite Creative, Dreams) mengajarkan pelajaran sosial dan ekonomi. Pembuatan harus berlangsung di dalam dunia, bukan di alat eksternal. Insentif ekonomi mendorong kualitas. Persistensi menciptakan keterikatan. Alat sederhana menjangkau lebih banyak kreator daripada alat yang canggih.

Pipeline kreatif adalah keunggulan Cinevva. Kita sudah menghasilkan aset 3D, tekstur, dan audio. Menghubungkan pipeline tersebut ke sistem penempatan dunia adalah bagian yang masih hilang. Konten buatan AI mengisi dunia. Kurasi dan penataan oleh kreator memberinya jiwa.

Hasil akhirnya bukanlah Skyrim di browser. Hasilnya lebih mendekati titik temu antara Minecraft (dunia yang dapat diedit), Roblox (ekonomi kreator), dan BotW (interaksi sistemik), yang berjalan di tab browser dengan alat pembuatan bertenaga AI. Teknologi untuk membangunnya sudah tersedia. Pertanyaannya adalah eksekusi.

Makalah Penelitian dan Referensi Akademis

Teknik dalam panduan ini tidak diciptakan dari nol. Teknik-teknik tersebut berlandaskan penelitian selama puluhan tahun. Berikut makalah yang paling penting untuk setiap subsistem, beserta catatan mengenai penerapannya pada dunia terbuka browser.

Generasi dan Rendering Medan

"Penyintesis Gambar" -- Ken Perlin (SIGGRAPH 1985). DOI. Makalah yang memperkenalkan Perlin noise. Setiap generator medan prosedural di setiap game sejak 1985 berakar dari karya ini. Fungsi noise tersebut menghasilkan keacakan halus yang, ketika dilapiskan dalam oktaf (gerak Brown fraksional), menciptakan heightmap yang tampak alami. Simplex noise (Perlin, 2001) adalah penerusnya yang lebih cepat. Untuk pipeline medan kita, inilah fondasinya: generasi heightmap berbasis noise berjalan dalam compute shader WebGPU dengan kecepatan interaktif.

"Pemberian Tekstur dan Pemodelan: Pendekatan Prosedural" -- Ebert, Musgrave, Peachey, Perlin, Worley (1994, edisi ke-3 2003). Buku ajar tentang generasi prosedural. Bab-bab Musgrave mengenai pemodelan medan, termasuk medan multifraktal dengan fitur menyerupai erosi, menjadi dasar langsung bagi generator medan game modern. Parameter fBm (lacunarity, persistence, jumlah oktaf) yang dijelaskan di sini sama dengan parameter yang akan kita sediakan kepada kreator untuk kustomisasi medan.

"Geometry Clipmaps: Rendering Medan Menggunakan Kisi Reguler Bersarang" -- Losasso and Hoppe (SIGGRAPH 2004). DOI. Makalah ini memecahkan cara merender medan yang sangat luas pada kecepatan interaktif menggunakan cincin LOD konsentris (clipmap). Mesh medan berupa kumpulan tetap kisi bersarang yang berpusat pada kamera. Saat kamera bergerak, kisi-kisi tersebut bergeser dan diperbarui. Inilah teknik yang direkomendasikan dalam bagian medan kita untuk WebGL 2, dan teknik ini bekerja karena beban kerja GPU tetap konstan terlepas dari ukuran dunia. Implementasi aslinya dibuat sebelum WebGL, tetapi dapat dipetakan langsung ke WebGL. "Simulasi dan Visualisasi Erosi Hidraulis Cepat di GPU" -- Mei, Decaudin, Hu (2007). PDF. Memindahkan erosi hidraulis dari proses luring yang dibatasi CPU menjadi komputasi GPU waktu nyata. Model simulasi air dangkal dalam makalah ini (memperlakukan air sebagai medan ketinggian dan menghitung aliran antar-sel kisi) berjalan dalam compute shader. Untuk pipeline kami, erosi GPU sisi server dapat mengubah medan yang dihasilkan dari noise menjadi lanskap yang masuk akal secara geologis dalam waktu kurang dari satu detik, sehingga medan buatan AI tampak dipahat dengan tangan.

"Rendering Waktu Nyata untuk Planet yang Dibuat Secara Prosedural" -- Pendekatan hibrida dari presentasi GDC No Man's Sky dan penjelasan Sean Murray. Meski bukan satu makalah tunggal, presentasi GDC 2017 "Membangun Dunia Menggunakan Matematika" oleh Innes McKendrick (Hello Games) menjelaskan bagaimana No Man's Sky menghasilkan medan berskala planet menggunakan fungsi noise bertumpuk, representasi voxel dengan marching cubes, serta pembuatan di sisi GPU. Ini berkaitan langsung dengan pendekatan medan prosedural kami, khususnya untuk menghasilkan fitur medan yang tidak dapat direpresentasikan oleh heightmap (gua, lengkungan).

"C-DBLOD: LOD Hibrida untuk Rendering Medan" -- Filip Strugar (2014). Makalah. Penyempurnaan geometry clipmap yang menambahkan seleksi berbasis quadtree agar adaptivitas di sekitar posisi kamera menjadi lebih baik. Gagasan utamanya: alih-alih menggunakan cincin konsentris tetap, gunakan quadtree untuk memilih patch medan dengan resolusi berbeda-beda. Pendekatan ini menangani medan tidak beraturan (ketika area tertentu memerlukan lebih banyak detail daripada area lainnya) dengan lebih baik daripada clipmap murni. Dapat diimplementasikan di WebGL 2 dengan traversal quadtree kecil di sisi CPU.

Gaussian Splatting 3D dan Rendering Neural

"Gaussian Splatting 3D untuk Rendering Medan Radiansi Waktu Nyata" -- Kerbl, Kopanas, Leimkühler, Drettakis (SIGGRAPH 2023). Halaman proyek. Makalah yang memicu revolusi Gaussian splatting. Sebuah adegan direpresentasikan sebagai jutaan Gaussian 3D, masing-masing dengan posisi, kovarians (bentuk), opasitas, dan koefisien warna harmonik sferis. Proses rendering mengurutkan splat berdasarkan kedalaman dan merasterisasinya sebagai Gaussian 2D. Pendekatan ini 100–1.000 kali lebih cepat dilatih daripada NeRF dan dapat dirender secara waktu nyata. Tersedia beberapa implementasi WebGL/WebGPU. Untuk platform kami, ini memungkinkan kreator menangkap objek dunia nyata menggunakan foto dari ponsel dan menempatkannya di dunia browser.

"NeRF: Merepresentasikan Adegan sebagai Medan Radiansi Neural untuk Sintesis Sudut Pandang" -- Mildenhall et al. (ECCV 2020). Halaman proyek. Makalah dasar tentang representasi adegan neural. Jaringan neural memetakan koordinat 3D ke warna dan densitas, sehingga memungkinkan sintesis sudut pandang baru yang fotorealistis dari sekumpulan foto masukan. Meskipun NeRF terlalu mahal untuk dirender secara langsung di browser (memerlukan evaluasi jaringan per piksel), pipeline ekstraksi NeRF-ke-mesh (melatih NeRF, lalu menjalankan marching cubes pada medan densitas) menghasilkan mesh bertekstur berkualitas tinggi dari foto.

"Primitif Grafis Neural Instan dengan Enkode Hash Multiresolusi" -- Müller, Evans, Schied, Keller (SIGGRAPH 2022). Halaman proyek. Mengurangi waktu pelatihan NeRF dari hitungan jam menjadi detik dengan menggunakan tabel hash multiresolusi untuk enkode spasial. Hal ini membuat NeRF praktis untuk penggunaan produksi. Teknik enkode hash tersebut juga dapat diterapkan pada data spasial lain di dunia browser (pencarian cepat dalam kumpulan data 3D berukuran besar).

"Neuralangelo: Rekonstruksi Permukaan Neural dengan Fidelitas Tinggi" -- Li et al. (CVPR 2023). Halaman proyek. Mengekstrak mesh segitiga berkualitas tinggi dari representasi neural menggunakan enkode hash multiresolusi dan gradien numerik untuk estimasi SDF (signed distance function/fungsi jarak bertanda). Mesh keluarannya dapat langsung digunakan dalam engine 3D browser. Untuk pipeline aset kami, Neuralangelo (atau alat serupa seperti NeuS2) dapat mengubah tangkapan NeRF menjadi berkas GLB siap web dengan geometri bersih dan tekstur yang telah di-bake.

Jaringan Multipemain dan Sinkronisasi State

"Manajemen Kepentingan dalam Game Daring Multipemain Masif" -- Boulanger, Kienzle, Verbrugge (2006). DOI. Survei komprehensif mengenai teknik pengelolaan area kepentingan (area of interest/AOI) untuk MMO. Membahas pendekatan berbasis kisi, berbasis aura, dan hibrida untuk memfilter pembaruan jaringan berdasarkan relevansi spasial. Pendekatan berbasis kisi (yang selaras dengan sistem chunk kami) paling efisien untuk dunia dengan densitas seragam. Pendekatan berbasis aura (radius pengaruh per entitas) bekerja lebih baik untuk densitas yang bervariasi. Rekomendasi kami untuk AOI berbasis chunk dengan laju pembaruan berbasis prioritas di dalam AOI berasal dari penelitian ini.

"Dead Reckoning: Menyembunyikan Latensi untuk Game Berjaringan" -- Pantel dan Wolf (2002). DOI. Memformalkan dead reckoning (memprediksi posisi entitas berdasarkan kecepatan terakhir yang diketahui) untuk game berjaringan. Makalah ini mengukur komprominya: ambang prediksi yang lebih tinggi mengurangi bandwidth, tetapi meningkatkan kesalahan posisi yang terlihat saat koreksi. Untuk game browser dengan latensi 50–200 md, ambang prediksi 0,5–1,0 meter membuat koreksi tidak terlihat sekaligus memangkas bandwidth pembaruan posisi sebesar 60–80%.

"Tipe Data Tereplikasi Bebas Konflik" -- Shapiro, Preguiça, Baquero, Zawirski (2011). DOI. Makalah dasar CRDT. Mendefinisikan CRDT berbasis state dan berbasis operasi yang dapat berkonvergensi tanpa koordinasi. Untuk sistem pengeditan dunia kami, CRDT yang relevan adalah: LWW-Register (Last-Writer-Wins Register) untuk properti objek yang memiliki satu nilai (posisi, rotasi, warna), dan OR-Set (Observed-Remove Set) untuk kumpulan objek dalam sebuah chunk (menangani penambahan/penghapusan bersamaan tanpa konflik). Yjs mengimplementasikannya secara efisien dalam JavaScript.

"Time Warp: Mekanisme untuk Simulasi Terdistribusi" -- Jefferson (1985). DOI. Makalah asli mengenai simulasi terdistribusi optimistis. Meskipun Time Warp sendiri terlalu kompleks untuk game browser, gagasan intinya (memproses kejadian secara optimistis dan melakukan rollback jika konflik datang dari node lain) menjadi dasar prediksi sisi klien modern dengan rekonsiliasi server. Beginilah cara kerja setiap game multipemain yang responsif: klien memprediksi secara lokal, mengirim tindakan ke server, lalu melakukan koreksi jika server tidak menyetujuinya.

"Model Jaringan Engine TRIBES" -- Frohnmayer dan Gift (GDC 1999). Salah satu penjelasan praktis pertama mengenai jaringan game klien-server dengan manajemen kepentingan, pembaruan state berprioritas, dan penganggaran bandwidth. Konsep "ghost manager" (server mempertahankan tampilan per klien mengenai apa yang telah diketahui klien tersebut, lalu hanya mengirim delta dari tampilan itu) persis seperti yang diterapkan oleh arsitektur Durable Object berbasis chunk kami. Presentasi GDC ini merupakan leluhur intelektual sebagian besar jaringan game modern.

"Jaringan Multipemain Source" -- Valve (2009). Dokumentasi pengembang. Dokumentasi Valve mengenai model jaringan engine Source (digunakan dalam Half-Life 2, CS:GO, Team Fortress 2). Membahas prediksi sisi klien, interpolasi entitas, kompensasi lag, serta sistem "snapshot" tempat server mengirim state dunia lengkap secara berkala sementara klien melakukan interpolasi antar-snapshot. Ini merupakan standar emas untuk jaringan server otoritatif dan dapat diterapkan langsung pada arsitektur kami.

Pembuatan Prosedural

"Sintesis Model: Algoritma Pemodelan Prosedural Umum" -- Merrell (2007). DOI. Salah satu pendahulu Wave Function Collapse. Menghasilkan struktur 3D dari model contoh dengan menyebarkan batasan lokal. Algoritma ini memastikan konsistensi global dengan secara iteratif meng-collapse sel yang memiliki kemungkinan paling sedikit (heuristik entropi minimum). Beginilah Townscaper dan generator serupa menghasilkan struktur yang koheren dari masukan pengguna yang sederhana.

"WaveFunctionCollapse" -- Maxim Gumin (2016). GitHub. Bukan makalah tradisional, melainkan proyek sumber terbuka penting dengan dokumentasi ekstensif. Algoritma ini mengambil gambar contoh kecil atau tileset, lalu menghasilkan keluaran yang lebih besar dan secara lokal mirip dengan masukannya. Untuk dunia kreator, WFC dapat menghasilkan tata letak bangunan, jaringan jalan, peta dungeon, dan detail medan dari sekumpulan kecil aturan yang ditentukan kreator. Tersedia beberapa implementasi JavaScript.

"Wave Function Collapse adalah Pemecahan Batasan di Dunia Nyata" -- Karth dan Smith (FDG 2017). DOI. Analisis akademis WFC yang memperjelas hubungannya dengan pemenuhan batasan serta menunjukkan cara menganalisis dan memperluasnya. Relevan untuk memahami keterbatasan WFC (algoritma ini dapat macet dan memerlukan backtracking) serta cara merancang tileset yang menghindari masalah tersebut.

"Teorema Superposisi dan Implikasinya bagi Pembuatan Konten Game Secara Prosedural" -- Sandhu et al. (2022). Mengeksplorasi penggunaan konsep superposisi yang terinspirasi kuantum untuk pembuatan konten prosedural. Meskipun spekulatif, kerangka matematis untuk mempertahankan beberapa kemungkinan state sebelum "meng-collapse"-nya menjadi konfigurasi akhir sama persis dengan cara kerja WFC dan dapat menjadi landasan bagi sistem pembuatan yang lebih canggih.

Teknik Rendering Waktu Nyata

"Rendering Waktu Nyata" -- Akenine-Möller, Haines, Hoffman (edisi ke-4, 2018). Buku teks standar. Bab 19 (Struktur Akselerasi), Bab 20 (Shading Efisien), dan Bab 21 (Realitas Virtual dan Tertambah) sangat relevan. Algoritma frustum culling, occlusion culling, dan LOD yang dijelaskan di sini adalah algoritma yang diimplementasikan oleh Three.js, Babylon.js, dan setiap engine game. Bukan makalah, tetapi merupakan referensi definitif.

"Survei tentang Baking Medan Radiansi Neural untuk Sintesis Sudut Pandang Waktu Nyata" -- Reiser et al. (2023). DOI. Meninjau berbagai metode untuk mengubah NeRF menjadi format yang dapat dirender secara waktu nyata (mesh, tekstur, kisi voxel renggang). Berkaitan langsung dengan pipeline aset kami, ketika penangkapan neural sisi server perlu menghasilkan keluaran yang dapat dirender di browser.

"Pencocokan Fitur Daring yang Skalabel dan Akurat Menggunakan Gaussian Splatting 3D" -- Berbagai kelompok (2024–2025). Sejumlah makalah terbaru mengeksplorasi pengeditan, compositing, dan adegan dinamis dengan Gaussian splat. Hal ini relevan karena dunia kreator perlu menggabungkan beberapa adegan splat (objek hasil tangkapan setiap kreator) menjadi satu adegan yang koheren. Metode pengeditan splat (pewarnaan ulang, deformasi, compositing) merupakan bidang penelitian aktif.

"Ray Tracing Screen-Space GPU yang Efisien" -- McGuire dan Mara (JCGT 2014). DOI. Makalah yang mendasari refleksi screen-space yang digunakan dalam bagian rendering air kami. Menelusuri sinar melalui depth buffer untuk menghasilkan perkiraan refleksi tanpa biaya ray tracing penuh. Varian "hierarchical tracing" (menggunakan mipmap kedalaman min-maks) berjalan secara efisien di WebGL 2.

"Menyimulasikan Air Laut" -- Jerry Tessendorf (2001). PDF. Makalah dasar mengenai simulasi laut berbasis FFT. Menjelaskan spektrum Phillips (model statistik gelombang laut) dan cara mengubahnya menjadi peta perpindahan spasial melalui FFT invers. Digunakan oleh setiap game besar dengan laut realistis (Sea of Thieves, Assassin's Creed, Uncharted). Komputasi FFT dapat dipetakan dengan rapi ke compute shader WebGPU.

"Hamburan Atmosfer yang Diprakomputasi" -- Bruneton dan Neyret (EGSR 2008). DOI. Makalah yang mendasari rendering langit akurat secara fisik. Melakukan prakomputasi hamburan atmosfer ke dalam tabel pencarian yang diambil sampelnya oleh fragment shader secara waktu nyata. Menghasilkan warna langit yang tepat, perspektif udara (objek jauh tampak kebiruan/berkabut), serta warna matahari terbenam/terbit berdasarkan prinsip dasar. Tabel hasil prakomputasinya berukuran kecil (beberapa ratus KB) dan shader runtime-nya ringan. Shader Sky milik Three.js dan langit prosedural Babylon.js merupakan versi sederhana dari pendekatan ini.

"Volume Oklusi Ambien" -- McGuire (HPG 2010) dan "Pengaburan Ambien yang Skalabel" -- McGuire, Mara, Luebke (HPG 2012). PDF. Makalah yang mendasari implementasi SSAO modern. SAO adalah varian yang paling umum diimplementasikan dalam engine 3D browser karena efisien (satu sampel depth buffer per piksel) dan menghasilkan bayangan kontak yang masuk akal. Algoritma ini mengambil sampel depth buffer di sekitar setiap piksel untuk memperkirakan seberapa "teroklusi" piksel tersebut oleh geometri di dekatnya. Three.js dan Babylon.js sama-sama mengimplementasikan SSAO turunan SAO.

Rendering dan Animasi Kerumunan

"Rendering Kerumunan dengan GPU" -- Dudash (2007) dan presentasi GDC/SIGGRAPH berikutnya mengenai rendering kerumunan terinstansiasi. Teknik intinya: bake frame animasi skeletal ke dalam tekstur (Vertex Animation Textures), lalu render kerumunan sebagai mesh terinstansiasi, dengan setiap instans membaca transformasi tulangnya dari tekstur animasi berdasarkan frame saat ini. Pendekatan ini memisahkan evaluasi animasi dari draw call, sehingga satu draw call terinstansiasi dapat merender ratusan karakter dengan animasi unik.

"Dinamika Berbasis Posisi" -- Müller et al. (2007). DOI. Makalah dasar mengenai PBD, yaitu cara engine game modern menyimulasikan kain, rambut, dan benda lunak. Rapier (engine fisika Wasm yang kami rekomendasikan) menggunakan solver turunan PBD. Untuk kustomisasi avatar (jubah, rambut tergerai, pakaian longgar), PBD menyediakan simulasi responsif pada frame rate game. Implementasi Wasm menjaganya tetap berjalan di luar thread utama JavaScript. "FABRIK: Pemecah Cepat dan Iteratif untuk Masalah Kinematika Balik" -- Aristidou dan Lasenby (2011). DOI. Makalah yang mendasari pemecah IK yang direkomendasikan di bagian avatar kami. FABRIK bekerja dengan secara bergantian menjangkau dari efektor ujung ke akar dan dari akar ke efektor ujung, lalu mencapai konvergensi dalam 3–5 iterasi. Metode ini lebih cepat daripada IK berbasis Jacobian, menangani batasan sendi secara alami, dan mudah diimplementasikan (sekitar 50 baris kode untuk pemecah dasar). Implementasi IK Three.js dan Babylon.js sama-sama diturunkan dari FABRIK.

Dunia Virtual dan Lingkungan Kolaboratif

"Gim Daring Multipemain Masif: Survei Perkembangan Terkini" -- Yahyavi dan Kemme (2013). DOI. Survei komprehensif tentang arsitektur MMO yang mencakup model klien-server, pendekatan peer-to-peer, manajemen minat, model konsistensi, teknik skalabilitas, dan pencegahan kecurangan. Taksonomi model konsistensinya (ketat, eventual, kausal) sesuai dengan pendekatan berbasis CRDT kami (konsistensi eventual dengan pengurutan kausal melalui vector clock).

"Arsitektur Terdistribusi untuk Aplikasi Interaktif Multipemain di Internet" -- Diot dan Gautier (1999). DOI. Penelitian awal tentang lingkungan virtual terdistribusi yang mengidentifikasi pertentangan utama: konsistensi ketat memerlukan koordinasi (yang menambah latensi), sementara konsistensi lemah memungkinkan respons cepat tetapi berisiko menimbulkan inkonsistensi yang terlihat. Makalah ini mengusulkan "local lag" (menunda tampilan lokal dalam waktu singkat agar pembaruan jarak jauh sempat tiba) sebagai jalan tengah. Untuk pengeditan dunia (menempatkan objek), local lag 100–200 milidetik tidak terasa dan memberi server waktu untuk melakukan validasi.

"Grid Second Life: Arsitektur Dunia Virtual Sumber Terbuka yang Hampir Kontemporer" -- Dokumentasi teknis Linden Lab dan rekayasa balik oleh komunitas. Meskipun bukan satu makalah tunggal, analisis teknis arsitektur Second Life didokumentasikan secara ekstensif. Wawasan utamanya: setiap wilayah berukuran 256x256 m berjalan pada instans server khusus. Objek disimpan sebagai pohon "primitif" (bentuk dasar dengan transformasi, tekstur, dan skrip). Penampil melakukan streaming deskripsi objek dan tekstur sesuai kebutuhan. Model berbasis persil dengan persistensi per objek ini merupakan arsitektur yang paling mendekati apa yang sedang kami bangun, dan pengoperasian Second Life selama lebih dari 20 tahun membuktikan bahwa arsitektur tersebut dapat diskalakan.

Grafis Web dan Performa Browser

"WebGPU: API Grafis Berperforma Tinggi untuk Web" -- W3C GPU for the Web Working Group (2023–sekarang). Spesifikasi. Spesifikasi formal untuk WebGPU. Ini bukan makalah penelitian, tetapi merupakan dokumen teknis definitif untuk pemrograman GPU di browser. Spesifikasi compute shader (Bagian 23) sangat relevan untuk pembuatan medan, penyebaran vegetasi, dan sistem partikel yang dijelaskan di sepanjang panduan ini.

"WebAssembly: Kerangka Kerja untuk Menjalankan Kode Terkompilasi di Browser" -- Haas dkk. (PLDI 2017). DOI. Makalah WebAssembly asli dari para vendor browser. Makalah ini menunjukkan bahwa performa Wasm berada dalam kisaran 2x dari performa native untuk beban kerja komputasi intensif. Hal ini mendukung rekomendasi kami untuk menggunakan mesin fisika yang dikompilasi ke Wasm (Rapier, Havok) bagi dunia terbuka di browser. Analisis performa dalam makalah tersebut menunjukkan bahwa overhead terutama berasal dari pemeriksaan batas dan pemanggilan fungsi tidak langsung, bukan dari model kompilasinya sendiri.

"Tidak Secepat Itu: Menganalisis Performa WebAssembly vs. Kode Native" -- Jangda dkk. (USENIX ATC 2019). PDF. Tolok ukur ketat mengenai performa Wasm dibandingkan native. Hasilnya menunjukkan bahwa Wasm rata-rata berjalan 1,45x–1,55x lebih lambat daripada C native di seluruh rangkaian tolok ukur SPEC CPU. Khusus untuk fisika gim (banyak operasi floating-point, sedikit system call), overhead berada pada kisaran bawah (~1,3x). Hal ini menegaskan bahwa fisika Wasm di browser layak digunakan untuk beban kerja gim waktu nyata.

"Meningkatkan Kecepatan Web dengan WebAssembly" -- Rossberg dkk. (2018). DOI. Menjelaskan dasar pertimbangan desain dan semantik formal WebAssembly. Hal yang sangat relevan: pembahasan jaminan keamanan memori (Bagian 3) menjelaskan mengapa modul Wasm dapat berbagi tab browser dengan JavaScript secara aman tanpa risiko keamanan seperti pada plugin native. Inilah yang membuat mesin fisika (yang secara tradisional berupa pustaka C++) aman dijalankan di browser.

Pembuatan Konten Berbasis AI

"Pembuatan Teks-ke-3D dengan Difusi Dua Arah Menggunakan Prior 2D dan 3D" -- Berbagai kelompok (2023–2025). Sejumlah makalah terbaru (DreamFusion, Magic3D, ProlificDreamer, MVDream, Zero-1-to-3++) mengeksplorasi pembuatan aset 3D dari prompt teks dengan menggunakan model difusi 2D sebagai prior untuk pengoptimalan 3D. Kualitasnya meningkat drastis dari awal 2023 hingga 2025, dari bentuk menggumpal menjadi mesh yang mendetail dan bertekstur. Untuk platform kami, model-model ini (yang berjalan di GPU sisi server) menjadi tahap "pembuatan dengan AI" dalam pipeline aset kreator.

"DreamFusion: Teks-ke-3D Menggunakan Difusi 2D" -- Poole dkk. (ICLR 2023). Halaman proyek. Makalah fundamental tentang Score Distillation Sampling (SDS), yang menggunakan model difusi 2D pralatih untuk memandu pengoptimalan 3D. Wawasan utamanya: Anda tidak memerlukan data pelatihan 3D jika Anda dapat mengevaluasi apakah tampilan hasil render dari objek 3D cocok dengan prompt teks menggunakan model 2D yang sudah ada. Pendekatan ini membuka jalan bagi pembuatan teks-ke-3D dan menjadi dasar bagi penelitian berikutnya (Magic3D, ProlificDreamer) yang meningkatkan kualitas dan kecepatan.

"LRM: Model Rekonstruksi Besar untuk Mengubah Satu Gambar Menjadi 3D" -- Hong dkk. (ICLR 2024). Halaman proyek. Merekonstruksi model 3D dari satu gambar dalam 5 detik pada satu GPU. Model ini menghasilkan representasi menyerupai NeRF yang dapat dikonversi menjadi mesh. Untuk dunia buatan kreator, ini berarti kreator dapat memotret objek apa pun di dunia nyata dan memperoleh model 3D dalam hitungan detik. Kecepatannya membuat teknologi ini layak digunakan sebagai alat interaktif, bukan sebagai proses batch.

"Pembuatan Konten Prosedural melalui Pembelajaran Mesin (PCGML)" -- Summerville dkk. (2018). DOI. Survei penggunaan pembelajaran mesin untuk pembuatan konten prosedural dalam gim. Mencakup pembuatan level, item, narasi, dan dunia. Hal yang sangat relevan adalah pembahasan mengenai "pembuatan yang dapat dikendalikan", ketika desainer menetapkan parameter tingkat tinggi dan model ML mengisi detailnya. Inilah paradigma pembangunan dunia berbantuan AI: kreator menetapkan maksud ("buat area ini menjadi hutan menyeramkan"), lalu AI mengisi geometri, tekstur, dan populasinya.

Hubungan Makalah-Makalah Ini dengan Arsitektur Kami

Penelitian tersebut dipetakan ke arsitektur kami dalam beberapa lapisan:

Pipeline medan: Noise Perlin/simplex (Perlin 1985, 2001) menghasilkan heightmap dasar. Erosi hidraulis (Mei dkk. 2007) menambahkan realisme geologis. Geometry clipmap (Losasso dan Hoppe 2004) atau CDLOD (Strugar 2014) merender medan secara efisien di browser. Hamburan atmosfer (Bruneton dan Neyret 2008) membuat medan di kejauhan terlihat tepat.

Pipeline aset: Teks-ke-3D (DreamFusion dkk.) dan gambar-ke-3D (LRM) menghasilkan aset di sisi server. Gaussian splatting (Kerbl dkk. 2023) memungkinkan pengambilan fotogrametri. Neuralangelo (Li dkk. 2023) mengekstrak mesh bersih dari hasil tangkapan neural. Semua output diproses menjadi GLB/KTX2 yang siap digunakan di browser.

Rendering: SSAO (McGuire 2012) menambahkan kedalaman. Refleksi screen-space (McGuire dan Mara 2014) menghasilkan efek air. Laut FFT (Tessendorf 2001) menyimulasikan air. Tekstur animasi vertex (Dudash 2007) merender kerumunan. FABRIK (Aristidou dan Lasenby 2011) menggerakkan IK karakter.

Jaringan: Manajemen minat (Boulanger dkk. 2006) menyaring pembaruan berdasarkan relevansi spasial. Dead reckoning (Pantel dan Wolf 2002) mengurangi penggunaan bandwidth. CRDT (Shapiro dkk. 2011) menangani pengeditan kolaboratif. Prediksi klien dengan rekonsiliasi server (Jefferson 1985, Valve Source Networking) memberikan respons yang cepat.

Pembuatan dunia: WFC (Gumin 2016, Karth dan Smith 2017) menghasilkan struktur dan tata letak. PCGML (Summerville dkk. 2018) menyediakan kerangka kerja untuk pembuatan berbantuan AI, ketika kreator menetapkan maksud dan model mengisi detailnya.

Penelitian di bidang ini sudah matang. Sebagian besar teknik tersebut telah digunakan dalam gim yang dirilis selama bertahun-tahun. Inovasi dalam membawanya ke browser bukan terletak pada algoritmanya, melainkan pada rekayasa agar semuanya bekerja dalam batasan memori, GPU, dan jaringan browser—dan itulah yang dibahas di bagian lain panduan ini.

Bacaan Lebih Lanjut

Coba sekarangCoba dunia terbuka di browser Anda sekarang

Masukkan satu kalimat, dapatkan dunia 3D yang bisa dijelajahi.

Buat gratis →Gratis, jalan di browser, tanpa instal apa pun.