scheduleOnRN

scheduleOnRN lets you schedule a function to be executed on the RN Runtime from any Worklet Runtime.

To learn more about the different runtime kinds, check Runtime Kinds.

scheduleOnRN is commonly used to update React state from UI Runtime, e.g. when animation finishes or conditionally within a gesture.

Reference

import { scheduleOnRN } from 'react-native-worklets';

function App() {
  // While on the UI thread
  scheduleOnRN(navigation.goBack);
}

Type definitions

function scheduleOnRN<Args extends unknown[], ReturnValue>(
  fun:
    | ((...args: Args) => ReturnValue)
    | RemoteFunction<Args, ReturnValue>
    | WorkletFunction<Args, ReturnValue>,
  ...args: Args
): void;

Arguments

fn

A reference to a function you want to execute on the RN Runtime.

args

Arguments to the function you want to execute on the RN Runtime.

Example

Loading...

Remarks

What functions can be passed to scheduleOnRN?

Functions passed to scheduleOnRN must be defined on the RN Runtime scope, i.e. in the component body or the global scope. The code below won't work because myFunction is defined in the scheduleOnUI callback, which is only executed on the UI Runtime.

import { scheduleOnRN, scheduleOnUI } from 'react-native-worklets';

function App() {
  //... component code

  scheduleOnUI(() => {
    // callback is defined on the UI Runtime 🚨
    scheduleOnRN(() => {}); // 💥
  });

  //... other component code
}

To fix it, you have to move the function definition to the RN Runtime scope:

import { scheduleOnRN, scheduleOnUI } from 'react-native-worklets';

function App() {
  //... component code

  // myFunction is defined on the RN Runtime ✅
  const myFunction = () => {};

  scheduleOnUI(() => {
    scheduleOnRN(myFunction); // 🥳
  });

  //... other component code
}

Implementation Details

• Scheduling function from the RN Runtime (we are already on RN Runtime) simply uses queueMicrotask.
• When functions need to be scheduled from a Worklet Runtime, they rely on React Native's scheduling model to forward the function call to the RN Runtime.

Call table

Bundle Mode	RN Runtime	UI Runtime	Worker Runtime
Enabled	✅	✅	✅
Disabled	✅	✅	✅

What does it mean?

Platform compatibility

Native	Web
✅	✅