2D Game Engine

Silnik i cykl życia

createEngine, rejestracja scen, start, pauza, timeScale i sprzątanie. Pełna referencja API obiektu Engine z przykładami.

Tworzenie silnika#

createEngine(options) to punkt kompozycji — buduje menedżery, wstrzykuje fabrykę adaptera i zwraca gotowy Engine.

ts
import { createEngine } from '@engine'

const engine = createEngine({
  parent: 'app',
  width: 1280,
  height: 720,
  backgroundColor: '#0f1419',
  debug: false
})

Nieprawidłowa konfiguracja rzuca Error z czytelnym komunikatem, zanim cokolwiek zostanie zamontowane w DOM.

API#

ts
getConfig(): EngineConfig
getTime(): Time
getTimer(): Timer
getScheduler(): Scheduler
getRandom(): Random
getEvents(): EventBus
getLogger(): Logger
getAssets(): AssetManager
getAudio(): AudioManager
getInput(): InputManager
getPhysics(): PhysicsManager
getCamera(): CameraManager
getScenes(): SceneManager
getWasm(): WasmBridge
getAdapter(): RuntimeAdapter
isRunning(): boolean
isDestroyed(): boolean

registerScene(scene: Scene): this
start(initialSceneId?: string, data?: unknown): this
startScene(id: string, data?: unknown): void
stopScene(id: string): void
pause(): void
resume(): void
setTimeScale(scale: number): this
setDebug(enabled: boolean): void
on<T>(event: string, handler: (p: T) => void): () => void
stop(): void
destroy(): void

Cykl życia#

text
createEngine → registerScene → start
→ engine:start → scene:start → pętla klatek
→ pause / resume (Time + audio)
→ stop → engine:stop
→ destroy (idempotentny)
  • stop() zwalnia runtime i listenery.
  • destroy() jest idempotentny — można go wołać wielokrotnie bez błędu.
  • pause() zatrzymuje Time i woła audio.pauseAll(); resume() odwraca oba efekty.

Przykład: pełny lifecycle#

ts
const engine = createEngine({ parent: 'app', width: 960, height: 540 })

engine.registerScene(new MenuScene())
engine.registerScene(new GameScene())

const off = engine.on<{ to: string }>('request:scene', ({ to }) => {
  engine.startScene(to)
})

engine.start('menu')

document.addEventListener('visibilitychange', () => {
  if (document.hidden) engine.pause()
  else engine.resume()
})

window.addEventListener('beforeunload', () => {
  off()
  engine.destroy()
})

Zdarzenia silnika#

engine.on() to skrót do EventBus. Silnik emituje:

ZdarzenieKiedy
engine:startPo uruchomieniu pętli
engine:stopPo zatrzymaniu
engine:pause / engine:resumePauza i wznowienie
engine:updateCo klatkę
scene:start / scene:stopStart i stop sceny
assets:*Postęp ładowania zasobów
audio:unlockedOdblokowanie audio gestem użytkownika
ts
engine.on('scene:start', ({ id }) => {
  console.log(`Wchodzi scena: ${id}`)
})

Time scale — slow motion#

ts
engine.setTimeScale(0.25)

engine.getEvents().emit('request:slowmo', { duration: 2 })

engine.getScheduler().delay(2, () => engine.setTimeScale(1))

setTimeScale skaluje deltaTime gry, ale realElapsed płynie dalej — zegary oparte na czasie rzeczywistym nie zwalniają. Szczegóły: Czas i pętla gry.

Jeden silnik na kontener

Nie twórz dwóch instancji Engine dla tego samego kontenera. Jeśli potrzebujesz wielu gier na stronie, każda dostaje własny parent i własny destroy() przy odmontowaniu.