Benchmark: SoA vs AoS vs Packed Typed Array

Script Preparation code:

'use strict';
window.N = Math.pow(10, 9);

class Packed256 {
 	constructor(length) {
     	this.store = new Float64Array(length << 2);
    }
  
  	getPX(index) { return this.store[(index << 2) + 0]; }
  	getPY(index) { return this.store[(index << 2) + 1]; }
  	getVX(index) { return this.store[(index << 2) + 2]; }
  	getVY(index) { return this.store[(index << 2) + 3]; }
  
  	setPX(index, val) { this.store[(index << 2) + 0] = val; }
  	setPY(index, val) { this.store[(index << 2) + 1] = val; }
  	setVX(index, val) { this.store[(index << 2) + 2] = val; }
  	setVY(index, val) { this.store[(index << 2) + 3] = val; }
}

class PointAndVelocity {
    constructor(x, y, vx, vy) {
        this.x = x;
        this.y = y;
        this.vx = vx;
        this.vy = vy;
    }
}

class Point {
    constructor(x, y) {
        this.x = x;
        this.y = y;
    }
}

class Velocity {
    constructor(vx, vy) {
        this.vx = vx;
        this.vy = vy;
    }
}

aos = Array(N).fill(new PointAndVelocity(0, 0, 0, 0))
    .map(() => new PointAndVelocity(Math.random() * 100, Math.random() * 100, Math.random() * 100, Math.random() * 100));

packed = new Packed256(N);
for (let i = 0; i < N; i++) {
 	packed.setPX(i, Math.random() * 100);
 	packed.setPY(i, Math.random() * 100);
 	packed.setVX(i, Math.random() * 100);
 	packed.setVY(i, Math.random() * 100);
}

// SoA, we try to duplicate the data so numeric differences are out of the question.
points = Array(N).fill(new Point(0, 0)).
    .map((_, i) => new Point(aos[i].x, aos[i].y));
velocities = Array(N).fill(new Velocity(0, 0)).
    .map((_, i) => new Velocity(aos[i].vx, aos[i].vy));

Tests:

SoA
var N = window.N; for (var i = 0; i < N; ++i) { var point = points[i]; var velocity = velocities[i]; point.x += velocity.vx; point.y += velocity.vy; }
AoS
var N = window.N; for (var i = 0; i < N; ++i) { var pav = aos[i] pav.x += pav.vx; pav.y += pav.vy; }
Packed Typed Array
var N = window.N; for (var i = 0; i < N; i++) { packed.setPX(i, packed.getPX(i) + packed.getVX(i)); packed.setPY(i, packed.getPY(i) + packed.getVY(i)); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
SoA
AoS
Packed Typed Array

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 7 months ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/145.0.0.0 Safari/537.36 Edg/145.0.0.0

Browser/OS: Chrome 145 on Windows

View result in a separate tab

AoS

9.2M/s

SoA

9.0M/s

Packed Typed Array

8.9M/s

View exact numbers

Test name	Executions per second
✓ AoS	9,159,892 Ops/sec
SoA	9,048,303 Ops/sec
Packed Typed Array	8,949,972 Ops/sec

SoA vs AoS vs Packed Typed Array (version: 1) Benchmark.js

Comparing performance of: `SoA vs AoS vs Packed Typed Array`

Created: 7 months ago by: Guest

Go to the latest result

SoA

AoS

Packed Typed Array

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

SoA vs AoS vs Packed Typed Array (version: 1) Benchmark.js

Comparing performance of: SoA vs AoS vs Packed Typed Array

Created: 7 months ago by: Guest

Go to the latest result

SoA

AoS

Packed Typed Array

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Related benchmarks

Comparing performance of: `SoA vs AoS vs Packed Typed Array`