0PricingLogin
React Native Academy · Lesson

Turbo Native Modules with JSI

Define a TypeScript spec file for a Turbo Native Module, implement it in Kotlin and Swift using the codegen-generated interface, and call the module synchronously via JSI.

The Problem with the Legacy Bridge

The legacy React Native bridge serializes every message between JavaScript and native into JSON, then deserializes it on the other side. This round-trip adds latency for every native call and blocks threads while serialization happens. For frequent calls like scroll events or animations, this overhead causes frame drops. JSI (JavaScript Interface) was created to eliminate this bottleneck.

What Is JSI

JSI (JavaScript Interface) is a lightweight C++ layer that lets JavaScript hold direct references to C++ host objects. Instead of sending a JSON-serialized message across the bridge, a JS call invokes a C++ function pointer directly and synchronously. This means native calls can be synchronous, zero-copy, and orders of magnitude faster than bridge-based calls.

All lessons in this course

  1. Writing a Legacy Native Module in Kotlin
  2. Writing a Legacy Native Module in Swift
  3. Turbo Native Modules with JSI
  4. Async Callbacks, Promises, and Events from Native
← Back to React Native Academy