Improving Game

Performance on the Web

Nick Desaulniers - @LostOracle

Web VR

Experience the Web in a whole new way

Time to render a single frame

60 Hz === 16.6 ms

90 Hz === 11 ms

oh, and you have to render everything twice

from two different viewpoints

CSS VR

Ability to share depth information between WebGL and CSS

web-vr-discuss Mailing list

Web Assembly

Minimize load times

Binary and text representation

30% smaller than gzipped asm.js

Can be parsed 23x faster than large asm.js modules

Are we removing JS?

Hell no

Concurrency vs Parallelism

Interruptible? Concurrent

Independant? Parallel

Not mutually exclusive, could have both, either, neither

JavaScript's single threaded event loop is great for IO bound workloads. Highly concurrent, but we're not utilizing additional resources that we could be.

Synchronization

SharedArrayBuffer

Workers can share read/write access to a TypedArray instead of postMessage

Problems with shared memory

Shared memory can lead to

Data Race Conditions
Deadlock

You must be this tall to write multithreaded code

SharedArrayBuffer gives us synchronization primitives to help

"Futexes"
Atomics

From there, we can build:

Mutexes
Condition Variables
Semaphores
Spin Locks

Mutex.js?

Prefer task level parallelism (postMessage) to data level parallelism (SharedArrayBuffer)

WebGL 2

Minimize CPU <-> GPU synchronization

What's new in WebGL2

Many WebGL1 extensions now mandatory

Vertex Array Objects (VAOs)
Instancing
Multiple Render Targets

Uniform Buffer Objects (UBOs)
Memory Barriers (Fences)
Still no geometry shaders

SIMD

Increased parallelism with no synchronization

Working on implementing SIMD optimizations to gl-matrix

WebGL in Workers

Stay off the main thread

For the first time, you'll be able to modify what's shown to the user from another thread.

Prediction

We'll begin to see more and more work being pushed off of the main thread

Thanks!

Nick Desaulniers - @LostOracle