《游戏引擎实现原理》11.3 从 OOP 到批处理的重构方法

// file: src/core/entity-oop.ts
// tier: L1
// verify: npx vitest run src/core/entity-oop.test.ts
//
// 面向对象风格的实体：每个实体一个对象，行为（update）挂在对象上。
// 这是 11.3 重构「之前」的写法，用来和批处理版对照。

export interface SpawnArgs {
  x?: number;
  y?: number;
  z?: number;
  vx?: number;
  vy?: number;
  vz?: number;
  life?: number;
}

export class Entity {
  x = 0;
  y = 0;
  z = 0;
  vx = 0;
  vy = 0;
  vz = 0;
  life = 1;

  /** 每个实体自己推进一帧：读自己的字段、写自己的字段。 */
  update(dt: number): void {
    this.x += this.vx * dt;
    this.y += this.vy * dt;
    this.z += this.vz * dt;
    this.life -= dt;
  }

  get alive(): boolean {
    return this.life > 0;
  }
}

export function spawn(args: SpawnArgs = {}): Entity {
  const e = new Entity();
  e.x = args.x ?? 0;
  e.y = args.y ?? 0;
  e.z = args.z ?? 0;
  e.vx = args.vx ?? 0;
  e.vy = args.vy ?? 0;
  e.vz = args.vz ?? 0;
  e.life = args.life ?? 1;
  return e;
}

/** 重构前的更新循环：一次迭代一个实体，每个实体各自 update。 */
export function updateAll(entities: Entity[], dt: number): void {
  for (const e of entities) e.update(dt);
}

// file: src/core/entity-batch.ts
// tier: L1
// verify: npx vitest run src/core/entity-batch.test.ts
//
// 批处理风格：组件按类型分组、SoA 存储，行为是「作用于整列数组的函数」。
// 每个字段一个 Float32Array —— 底层 ArrayBuffer 是外部内存，不进 JS 堆。
// 更新循环按索引扫列，没有逐实体的方法调用。

export class EntityBatch {
  readonly x: Float32Array;
  readonly y: Float32Array;
  readonly z: Float32Array;
  readonly vx: Float32Array;
  readonly vy: Float32Array;
  readonly vz: Float32Array;
  readonly life: Float32Array;
  #count = 0;

  constructor(capacity: number) {
    this.x = new Float32Array(capacity);
    this.y = new Float32Array(capacity);
    this.z = new Float32Array(capacity);
    this.vx = new Float32Array(capacity);
    this.vy = new Float32Array(capacity);
    this.vz = new Float32Array(capacity);
    this.life = new Float32Array(capacity);
  }

  get count(): number {
    return this.#count;
  }

  /** 追加一个实体，返回它的槽位索引。 */
  spawn(
    x = 0, y = 0, z = 0,
    vx = 0, vy = 0, vz = 0,
    life = 1,
  ): number {
    const i = this.#count++;
    this.x[i] = x;
    this.y[i] = y;
    this.z[i] = z;
    this.vx[i] = vx;
    this.vy[i] = vy;
    this.vz[i] = vz;
    this.life[i] = life;
    return i;
  }

  /** 批处理更新：一次扫过每一列，无逐实体调用。 */
  step(dt: number): void {
    const n = this.#count;
    const x = this.x, y = this.y, z = this.z;
    const vx = this.vx, vy = this.vy, vz = this.vz;
    const life = this.life;
    for (let i = 0; i < n; i++) {
      x[i] = x[i]! + vx[i]! * dt;
      y[i] = y[i]! + vy[i]! * dt;
      z[i] = z[i]! + vz[i]! * dt;
      life[i] = life[i]! - dt;
    }
  }

  isAlive(i: number): boolean {
    return this.life[i]! > 0;
  }
}

// file: bench/oop-vs-batch.ts
// tier: B
// verify: node bench/oop-vs-batch.ts
//
// 把「每实体一个对象的 update 循环」重构成「按组件列批量 step」，
// 跑同样的 N 实体 × M 帧，对比耗时与堆增量。
// 堆增量用 process.memoryUsage().heapUsed 在构建前后各取一次：
//   OOP 版每实体一个对象 → 堆增长约 N × 对象大小；
//   批处理版是 TypedArray → 底层 ArrayBuffer 属外部内存，不计入 heapUsed。

import { Entity, spawn, updateAll } from '../src/core/entity-oop.ts';
import { EntityBatch } from '../src/core/entity-batch.ts';

const N = 200_000;
const FRAMES = 60;
const DT = 1 / 60;

function median(xs: number[]): number {
  const s = [...xs].sort((a, b) => a - b);
  const m = s.length >> 1;
  return s.length % 2 ? s[m]! : (s[m - 1]! + s[m]!) / 2;
}

function buildOop(): Entity[] {
  const es: Entity[] = new Array(N);
  for (let i = 0; i < N; i++) es[i] = spawn({ x: i, vx: 1, vy: 2, vz: 3, life: 10 });
  return es;
}

function buildBatch(): EntityBatch {
  const b = new EntityBatch(N);
  for (let i = 0; i < N; i++) b.spawn(i, 0, 0, 1, 2, 3, 10);
  return b;
}

const beforeOop = process.memoryUsage().heapUsed;
const oop = buildOop();
const oopHeapMB = (process.memoryUsage().heapUsed - beforeOop) / 1048576;

const beforeBatch = process.memoryUsage().heapUsed;
const batch = buildBatch();
const batchHeapMB = (process.memoryUsage().heapUsed - beforeBatch) / 1048576;

const time = (f: () => void): number => {
  const t0 = process.hrtime.bigint();
  f();
  return Number(process.hrtime.bigint() - t0) / 1e6;
};

// 预热：让 JIT 把两条更新路径都编译到热点。
for (let w = 0; w < 5; w++) {
  updateAll(oop, DT);
  batch.step(DT);
}

const oopT: number[] = [];
const batchT: number[] = [];
for (let r = 0; r < 9; r++) {
  oopT.push(time(() => { for (let f = 0; f < FRAMES; f++) updateAll(oop, DT); }));
  batchT.push(time(() => { for (let f = 0; f < FRAMES; f++) batch.step(DT); }));
}

console.log(`N = ${N}, FRAMES = ${FRAMES}`);
console.log(`OOP   ${median(oopT).toFixed(2)} ms   heap +${oopHeapMB.toFixed(1)} MB   ${(oopHeapMB * 1048576 / N).toFixed(1)} B/entity`);
console.log(`batch ${median(batchT).toFixed(2)} ms   heap +${batchHeapMB.toFixed(1)} MB   ${(batchHeapMB * 1048576 / N).toFixed(1)} B/entity`);
console.log(`speedup oop/batch = ${(median(oopT) / median(batchT)).toFixed(2)}x`);