Recipes
Fibonacci runtime function
The smallest example of scheduling work on a named runtime and awaiting the result.
Use a runtime function when the caller should await a result from another JS runtime. This is the smallest possible example.
import { call, runtimeFunction } from '@react-native-runtimes/core';
function fibonacciNumber(n: number): number {
if (n < 2) {
return n;
}
return fibonacciNumber(n - 1) + fibonacciNumber(n - 2);
}
export const fibonacci = runtimeFunction((n: number) => {
return {
input: n,
result: fibonacciNumber(n),
computedAt: new Date().toISOString(),
};
});
const result = await call(fibonacci).on('fibonacci-worker-runtime')(38);The sample app includes this as the Fibonacci screen.
Why this matters
fibonacciNumber(38) blocks for hundreds of milliseconds. Running it on
the main runtime drops frames; running it on a worker keeps your UI
perfectly smooth.
What to look at
- The worker runtime is named
fibonacci-worker-runtime— that name is the contract between caller and callee. Both reference the same string. - The function is
exported and wrapped inruntimeFunction(...). Without those two, Metro can't register it. - Arguments and the return value are JSON-safe.
Variations
Want the function to always live on the worker runtime? Use the directive shortcut so the call site stays ordinary:
async function fibonacci(n: number) {
'fibonacci-worker-runtime';
return fibonacciNumber(n);
}
const result = await fibonacci(38);See Scheduling functions on another runtime for the full API.