React Native Runtimes
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 in runtimeFunction(...). 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.

On this page

React Native Runtimes is built with by Margelo

We build fast and beautiful apps. Contact us at margelo.com for high-end consultancy services.

Let's talk