In this lesson, you will learn how to bypass the "waiting game" of the old Bridge by using JSI to execute native code immediately.
The Waiting Game
In our previous lessons, we learned that the Bridge acts like a slow mailman. When you call a native function from JavaScript, the message is serialized, sent over the wire, and placed in a queue. You have to wait for the JavaScript thread to send the message, the native thread to process it, and a potential reply to travel all the way back.
This works fine for loading data or fetching a file, but it’s a disaster for high-performance tasks like gesture tracking or complex animations, where even a few milliseconds of delay cause "jank."
Direct Access with JSI
The JSI (JavaScript Interface) changes the game by allowing JavaScript to hold a direct reference to native objects. Instead of sending a message to a "mailbox," JavaScript can now reach out and touch the native code directly in memory.
Because this happens on the same thread (or via direct pointer access), the execution is synchronous. The JavaScript engine pauses for a micro-instant, executes the native logic, and receives the result immediately.
Think of it like this:
- The Bridge: Writing a letter to a friend in another room, waiting for them to read it, and waiting for their return letter.
- JSI: Walking into the other room and asking your friend a question face-to-face.
A Conceptual Look
When using JSI-powered modules (like some performance-focused libraries), calling a function looks much more like standard JavaScript:
// Instead of a callback-based bridge call:
NativeModule.doSomething(data, (result) => { /* wait for this */ });
// You get a direct, synchronous return:
const result = NativeModule.doSomethingSync(data);
// 'result' is available immediately on the next line!
By removing the serialization and the asynchronous queuing, you ensure that your UI logic remains perfectly in sync with the hardware, resulting in buttery-smooth interactions.
Key Takeaway: Synchronous Native Calls via JSI eliminate the latency of the asynchronous Bridge, allowing JavaScript to execute native code instantly and receive a return value without waiting for a serialized message cycle.