CHAPTER 04 / WEBFRONT
Call C++ from TypeScript
Understand data and Promises.
One call, one asynchronous reply
The starter waits for the handshake through webFront.ready, then calls life.step with the grid. JavaScript calls always return a Promise, even when the C++ function returns void. Await it or handle rejection. The following belongs inside an async function; cells is the starter’s Uint8Array grid.
try {
await webFront.ready;
const step = webFront.cppFunction('life.step');
const next = await step(cells);
// Update your React state with next.
} catch (error) {
console.error(error);
// Stop playback and show the error in your UI.
}128 bytes, 1,024 cells
The bridge encodes std::bitset<1024> as a 128-byte Uint8Array, least-significant bit first. It supports scalars, strings, tuples, numeric typed arrays and packed bitsets, rather than arbitrary JavaScript objects. Strings have a 16-bit encoded length. Bitsets need the exact byte size and zero padding bits.
Keep ordering and handle failures
Send one generation at a time: wait for its reply before requesting another. A reset during a call must invalidate the now-stale reply; the starter uses a session revision. A missing function, exception or disconnection rejects the Promise: stop playback and show the error. In the other direction, ui.jsFunction(name) ignores results; ui.jsFunction<R>(name) returns a std::future<R>. Callbacks run on the server thread: avoid blocking it.
Question