Przegląd

Browser2DEngine to silnik gier 2D na przeglądarkę z rdzeniem w TypeScripcie, niezależnym od Phasera. Poznaj filozofię, moduły i strukturę dokumentacji.

Czym jest Browser2DEngine?#

Browser2DEngine to silnik gier 2D działający w przeglądarce, zbudowany wokół jednej zasady: rdzeń nie zna Phasera. Cała logika gry — sceny, obiekty, komponenty, czas, zdarzenia — żyje w czystym TypeScripcie, a za runtime odpowiada wymienny adapter (RuntimeAdapter, domyślnie PhaserAdapter).

Efekt? Kod gry jest testowalny w Node bez przeglądarki, a zmiana backendu renderującego oznacza napisanie sześciu interfejsów, nie przepisanie gry.

Filozofia projektu

Silnik nie publikuje limitów sprzętowych, których nie zmierzył. Wszystkie liczby wydajnościowe w tej dokumentacji pochodzą z benchmarków uruchamianych w Node na tej samej maszynie, z względnymi progami regresji.

Najważniejsze możliwości#

Sceny i cykl życia — preload → create → update / fixedUpdate → shutdown, z automatycznym sprzątaniem zasobów.
Obiekty i komponenty — transformacje, tagi, grupy, hierarchia i fazy systemowe (input, behavior, physics, animation, render).
Czas — jedno źródło deltaTime, clamp, timeScale i opcjonalny krok stały.
Fizyka Arcade — collidery, overlap, granice świata, ciała immovable.
Audio — cztery kanały, efektywna głośność master × channel × volume, kolejka autoplay.
Tweeny — to / from / delay / sekwencje, 28 krzywych easingu.
Assety — manifest, statusy, uchwyty właścicieli, raporty rozmiarów.
Pluginy — manifest, uprawnienia, punkty rozszerzeń, budżety błędów.
Zapisy — atomowy zapis projektu i zapisy gracza w 6 backendach (memory → SQL).
Diagnostyka — overlay FPS, panel logów, profiler i raport JSON.

Stack technologiczny#

Warstwa	Technologia
Rdzeń silnika	TypeScript, zero zależności od runtime
Runtime	Phaser 3 (adapter), Arcade Physics
Build	Vite (dwie konfiguracje: dev i prod)
Testy	Vitest, testy hostingu w Playwright
Opcjonalny compute	C++23 + Emscripten (WASM)

Minimalny przykład#

import { createEngine, Scene } from '@engine'

class HelloScene extends Scene {
  constructor() {
    super('hello')
  }

  create() {
    this.createText('Cześć!', { x: 640, y: 360, fontSize: '32px', color: '#ffffff' })
      .setOrigin(0.5, 0.5)
  }
}

const engine = createEngine({ parent: 'app', width: 1280, height: 720 })
engine.registerScene(new HelloScene())
engine.start('hello')

Od czego zacząć?#

Szybki start

Instalacja, pierwsza scena i build w kilka minut.

Architektura

Warstwy, porty adaptera i przepływ klatki.

Przykłady

Kompletne sceny: platformer, zbieranie, zapisy.

API referencja

Silnik, czas, sceny, obiekty i zdarzenia.

Struktura repozytorium#

text

2D-GameEngine/
├── packages/engine/src/
│   ├── core/          Engine, Scene, GameObject, Time, porty
│   ├── systems/       EventBus, AssetManager, Input, Physics, Camera, Logger
│   ├── animation/     Easing, Tween, TweenManager, sekwencje
│   ├── audio/         AudioManager, kanały, SoundHandle
│   ├── debug/         LogBuffer, LogPanel, DebugViews, Profiler, Diagnostics
│   ├── plugins/       PluginHost, rejestry, manifest
│   └── adapters/      PhaserAdapter (jedyny katalog, który zna Phasera)
├── apps/playground/   Przykładowa gra (menu → gra)
├── native/core/       Opcjonalny rdzeń C++ pod WASM
├── benchmarks/        17 przypadków Node + baseline
└── docs/              Ta dokumentacja