tezvyn:

React Native

React Native, Expo, native modules, cross-platform

298 bites

React Native2 min read

Generating a signed release APK or AAB

WHAT IT TESTS: Android release signing. OUTLINE: create a keystore, reference its credentials via gradle.properties (gitignored), wire a release signingConfig in build.gradle, then assembleRelease or bundleRelease.

React Native2 min read

Fabric UI update lifecycle vs old architecture

WHAT IT TESTS: the Fabric render pipeline. OUTLINE: render builds an immutable C++ shadow tree, commit diffs trees and runs Yoga layout, mount applies mutations to native views; JSI shares the tree, enabling synchronous and concurrent rendering unlike the…

React Native2 min read

TurboModule lazy loading vs eager startup

WHAT IT TESTS: why lazy module init speeds startup. OUTLINE: legacy modules are instantiated eagerly at launch; TurboModules initialize only when JS first accesses them, so unused modules cost nothing at startup.

React Native2 min read

What JSI is and how it replaces the Bridge

WHAT IT TESTS: understanding JSI fundamentals. OUTLINE: JSI is a lightweight C++ layer letting JS hold references to native host objects and call them directly and synchronously, with no JSON serialization or async batched queue.

React Native2 min read

TurboModules and lazy loading benefits

WHAT IT TESTS: new-architecture native modules. OUTLINE: TurboModules use JSI for direct, synchronous, type-safe calls and are loaded lazily on first use instead of all at startup, cutting init time.

React Native2 min read

Threading of native module methods

WHAT IT TESTS: native module threading. OUTLINE: methods run on a dedicated native module queue, not the UI thread; long blocking work stalls other module calls; offload to a background executor or override methodQueue, returning results via promise.

React Native2 min read

Purpose of RCTBridgeModule and ReactContextBaseJavaModule

WHAT IT TESTS: understanding the native module contract. OUTLINE: these declare a class as a discoverable native module, provide the JS-facing name, and let RN export methods to JavaScript.

React Native2 min read

Creating a native module with a sync method

WHAT IT TESTS: native module mechanics across platforms. OUTLINE: extend the RN base class, mark the method exported and synchronous, register in a package or bridging file.

React Native2 min read

Offline data storage and sync strategy

WHAT IT TESTS: offline-first design. OUTLINE: persist locally in SQLite or WatermelonDB, queue mutations with a pending flag, detect reconnection with NetInfo, then replay the queue and resolve conflicts.

React Native2 min read

Unifying divergent native video player props

WHAT IT TESTS: designing a cross-platform wrapper over divergent native views. OUTLINE: a JS component accepts a unified source prop, then uses Platform.OS to map it into each native view's expected props before rendering.

React Native2 min read

Platform-specific typography in a global theme

WHAT IT TESTS: centralizing platform-aware styling. OUTLINE: define one theme with Platform.select for fontFamily, expose semantic text styles, and reuse them everywhere rather than per-screen overrides.

React Native2 min read

Android-only native module called safely from JS

WHAT IT TESTS: building a platform-specific native module and guarding calls. OUTLINE: write a ReactContextBaseJavaModule with an exported method, register it in a package, then guard the JS call with Platform.OS or a null check on the module.

React Native2 min read

Passing params between Stack Navigator screens

WHAT IT TESTS: navigation params basics. OUTLINE: navigate to the route with a params object, read it via route.params on the target, pass an id not a huge object. RED FLAG: using global state or refs to smuggle data instead of route params, or passing.

React Native2 min read

Composing tap and pan gestures together

WHAT IT TESTS: gesture composition and relations. OUTLINE: declare both gestures and relate them with simultaneous or exclusive composition, using Gesture.Race or simultaneousHandlers so a small move stays a tap.

React Native2 min read

Adding native code to Expo without ejecting

WHAT IT TESTS: knowing modern Expo CNG and dev clients. OUTLINE: use prebuild with config plugins to inject native changes, build a custom development client with EAS, keep native folders generated not hand-edited.

React Native2 min read

The legacy React Native Bridge architecture

WHAT IT TESTS: knowing the old three-thread Bridge model. OUTLINE: JS, native, and shadow threads communicate via an async, batched, JSON-serialized Bridge. RED FLAG: calling the Bridge synchronous, ignoring serialization cost, or confusing it with JSI.

React Native2 min read

Web DOM elements vs React Native core components

WHAT IT TESTS: understanding RN renders to native views, not the DOM. OUTLINE: View maps to UIView/ViewGroup, Text to native text, no HTML or CSS, all text must be inside Text. RED FLAG: claiming RN runs in a webview or uses real div and CSS.

React Native88 sec read

Build flavors and schemes for RN environments

WHAT IT TESTS: managing dev, staging, and prod builds natively. OUTLINE: Android productFlavors with distinct applicationId and resources, iOS schemes plus configurations and targets, environment config injection.

React Native2 min read

Layered testing strategy for a large RN app

WHAT IT TESTS: understanding the test pyramid in RN. OUTLINE: many fast Jest unit tests, fewer RNTL component tests on behavior, few Detox/Maestro E2E on critical flows.

React Native82 sec read

Unit testing a custom hook with renderHook

WHAT IT TESTS: knowing how to test hook logic in isolation. OUTLINE: render the hook, read result.current, fire actions inside act, assert updated state. RED FLAG: calling hook directly outside a component or skipping act around updates.