Skip to content

Membangun dunia terbuka di browser, bagian 3: Eksperimen sederhana yang menyelamatkan kami

Oleh Oleg Sidorkin, CTO dan Co-Founder Cinevva

Baru di sini? Gunakan panduan seri. Panduan tersebut menjelaskan apa itu spike dan menyediakan tautan ke semua bagian.

Bagian ini memiliki lebih sedikit tangkapan layar yang memukau dan lebih banyak pengaman arsitektur.

Setelah Spike 1 dan 2, kami menjalankan tiga pemeriksaan risiko yang tampak kecil, tetapi berdampak besar pada produk.

Yang pertama adalah fan-out broadcast dengan Durable Objects. Kami menguji distribusi posisi multi-klien pada tick rate seperti dalam game dan melacak distribusi latensi, penggunaan CPU per tick, serta integritas pengiriman. Jika pengujian ini gagal, kami akan beralih ke sharding sejak awal alih-alih menggunakan kepemilikan satu pulau.

Yang kedua adalah validasi batasan perangkat seluler. Bukan preset desktop yang sekadar diganti namanya menjadi seluler, melainkan profil berbiaya rendah yang eksplisit dari baseline medan yang sama.

Buka profil seluler di tab baru ↗ · Lihat kode sumber

Kami mengurangi kepadatan segmen, jumlah objek, beban resolusi rendering, dan jangkauan kabut. Pertanyaannya sederhana. Bisakah dunia ini tetap mudah dibaca dan responsif dalam batasan perangkat kelas seluler tanpa menulis ulang seluruh renderer?

Yang ketiga adalah keandalan pembuatan perilaku untuk alur kerja kreator. Kami mengevaluasi tingkat JSON yang valid, ketepatan semantik terhadap primitif yang diharapkan, dan latensi respons. Jika pengujian ini gagal, kami akan beralih ke pembuatan perilaku berbasis formulir yang ketat.

Wawasan utama dari bab ini adalah bahwa eksperimen sederhana ini mengubah arsitektur lebih cepat daripada eksperimen visual. Eksperimen tersebut menetapkan batas tegas untuk topologi jaringan, janji performa seluler, dan UX alat kreator.

Di bagian 4, kami kembali ke pekerjaan medan yang terlihat dan menguji perilaku streaming saat bergerak, bukan sekadar tangkapan layar pemuatan statis.

Teknologi yang dirujuk dalam bab ini

Cloudflare Durable Objects. Instans serverless berstatus yang diterapkan di edge, dengan persistensi bawaan dan dukungan WebSocket. Setiap Durable Object menyimpan state otoritatif untuk satu shard (atau chunk) dunia. Pemain terhubung melalui WebSocket dan menerima broadcast posisi dari pemain lain dalam shard yang sama. Saat pemain berpindah ke chunk yang bersebelahan, mereka terhubung ke Durable Object milik chunk tersebut. Durable Objects secara otomatis menyimpan state secara persisten ke disk dan dapat diskalakan hingga ribuan instans bersamaan. Lihat dokumentasi Cloudflare Durable Objects dan panduan teknologi 3D browser kami tentang jaringan multipemain.

Sharding spasial. Membagi dunia ke beberapa instans server berdasarkan wilayah geografis. Setiap shard memiliki satu area persegi panjang pada grid dunia. Saat kepadatan pemain berubah, shard dapat dipecah atau digabungkan. Pemain di dekat batas shard dapat melihat konten dari kedua shard melalui kueri visibilitas lintas-shard. Inilah cara EVE Online menangani ribuan pemain dalam satu semesta.

Fan-out broadcast WebSocket. Mendistribusikan pembaruan posisi secara real-time dari satu server ke banyak klien yang terhubung. Bandwidth downstream per klien meningkat secara linear mengikuti jumlah pemain yang dapat terlihat:

Bclient=Nvisible×bplayer

Pada tick rate seperti dalam game (20–30 Hz), setiap pemain menghasilkan data posisi sebesar bplayer800 byte/detik, sehingga 200 pemain yang terlihat membutuhkan 200×800=160 KB/detik per klien. Biaya server untuk pendekatan all-to-all yang naif bahkan lebih buruk karena meningkat seperti N2. Inilah alasan relevance filtering (pengelolaan area kepentingan spasial) membatasi Nvisible sebelum pembaruan dikirim ke setiap koneksi dalam anggaran waktu tick. Lihat panduan jaringan kami untuk memahami kompromi antara kompresi delta dan frekuensi pembaruan.

Batasan rendering seluler. GPU seluler memiliki throughput sebesar 1/5 hingga 1/10 dari GPU desktop, batas memori sekitar 1 GB (dibandingkan 2–4 GB pada desktop), serta mengalami thermal throttling saat menerima beban berkelanjutan. Profil kualitas seluler mengurangi kepadatan segmen, jumlah objek, resolusi rendering, jarak pandang, dan kualitas bayangan. Tujuannya bukan menyamai kualitas desktop, melainkan mempertahankan keterbacaan dan responsivitas. Lihat angka performa 3D browser untuk benchmark GPU nyata.


Bagian 3 dari 12.
Sebelumnya: Bagian 2 - Fisika Worker dan kekhawatiran akan input lag
Berikutnya: Bagian 4 - Streaming sebelum medan yang canggih
Panduan seri: /blog/2026-02-25-open-world-browser-series-guide