Tarayıcı Oyunları Nasıl Çalışır? Canvas'tan Checkpoint'e Teknik Bir Gezinti

👁 3 görüntülenme

"Linke tıkla, oyna" deneyimi dışarıdan sihir gibi görünür: indirme yok, kurulum yok, güncelleme yok. Peki bir tarayıcı oyunu gerçekte nasıl çalışır? SargasmGames'i örnek alarak, teknik meraklıları için kaputun altına bakalım.

HTML5 Canvas: oyunun tuvali

Oyunlarımız HTML5 Canvas üzerinde çizilir. Canvas, tarayıcıya "bana piksel çizebileceğim bir alan ver" demenin standart yoludur. Oyun döngüsü saniyede ~60 kez çalışır: her karede önce dünya güncellenir (nesneler hareket eder, çarpışmalar hesaplanır), sonra sahne baştan çizilir. Telefonundaki oyunlardan farkı, bu döngünün işletim sistemi yerine tarayıcının requestAnimationFrame zamanlayıcısıyla çalışması.

Neden bu kadar hızlı açılıyor?

Her oyunumuz tek bir HTML dosyasıdır: kod, stiller ve çizimler aynı dosyada gömülüdür. Dev doku paketleri yerine tüm görseller çalışma anında Canvas API ile çizilir — saksılar, karakterler, koridorlar dahil. Bu yüzden bir oyunun tamamı çoğu haber sitesinin tek fotoğrafından küçüktür ve saniyeler içinde açılır.

Güvenlik: sandbox'lı iframe

Oyunlar sayfaya doğrudan değil, sandbox'lı bir iframe içinde yüklenir. Sandbox, oyunun yapabileceklerini kısıtlayan bir güvenlik çemberidir: oyun kendi kutusunun dışına çıkamaz, hesabına ya da çerezlerine dokunamaz. Platformla tek iletişim yolu mesajlaşmadır (postMessage): oyun "skorum bu" der, platform doğrular ve kaydeder. Bu ayrım hem seni hem skor tablolarının adilliğini korur.

Skorun yolculuğu

Oyun bittiğinde skor doğrudan tabloya yazılmaz. Önce oyuna özel bir oturum jetonu ile imzalanır, sonra sunucuda makullük kontrollerinden geçer: süreye göre imkânsız skorlar, tekrar gönderimler ve şüpheli desenler elenir. Tablolarda gördüğün her satır bu süzgeçten geçmiştir.

Checkpoint mimarisi: kaldığın yerden devam

"Kaldığın yerden devam" özelliği için oyun, kritik anlarda durumunun küçük bir özetini (dalga, can, skor gibi) platforma emanet eder. Ölünce platform sorar: devam hakkın var mı? Üyelik hakkı ya da coin ile onaylanırsa oyun emanet durumu geri alır ve seni oraya ışınlar. Önemli ayrıntı: devam koşulunu oyun değil platform doğrular — yani hiçbir oyun kendi kendine bedava devam dağıtamaz.

Neden uygulama değil de tarayıcı?

Kısa cevap: sürtünme. Bir mobil oyunun indirilme kararı saniyeler içinde verilir ve çoğu kişi "boş yer yok" der. Tarayıcı oyununda karar tek tıktır. Ayrıca tek kod tabanı telefonda, tablette ve masaüstünde aynı anda çalışır — biz oyunları her üç ekranda da test ederek yayınlarız.

Teknik sorularını iletişim sayfasından gönderebilirsin; ilginç olanları gelecek yazılarda cevaplayalım. 🛠️

← Blog'a dön