Search
Find a bite, explore a topic or look for a role.
Results for “React”
Bites 747
How do you debug a memory leak with Hermes heap snapshots?
Take a baseline snapshot, exercise the suspect flow repeatedly, snapshot again, and compare retained sizes and object counts that grow monotonically.
How do you move a 500ms blocking task off the JS thread?
Offload to a native module or C++ TurboModule, a worklet/worker thread, or chunk the work and yield; never block JS.
How do Fabric, TurboModules, and JSI fix bridge limits?
JSI lets JS hold C++ host objects and call native synchronously without JSON serialization; Fabric renders concurrently and TurboModules lazy-load.
What is bridge traffic and what causes dropped frames?
The bridge passes batched, serialized JSON messages between JS and native asynchronously; high-frequency events flood it.
What is Hermes and its advantages over JSC?
Hermes is an open-source engine optimized for RN, with faster startup via precompiled bytecode and lower memory use.
useMemo and useCallback for stable references
UseMemo caches a computed value, useCallback caches a function identity across renders; both prevent recompute and unnecessary re-renders of memoized children.
Cost of console.log and production-safe debugging
Each console.log serializes data and, when devtools are attached, crosses the bridge synchronously, blocking the JS thread; strip logs in release and use Flipper, dev tools, or remote crash and analytics tools.
Streaming accelerometer data without bridge overload
The bottleneck is flooding the async bridge and re-rendering at sensor rate; fix by throttling, processing in worklets or native, and animating via shared values not setState.
Managing camera lifecycle in Vision Camera
Bind the isActive prop to screen focus via useIsFocused and to app state, so the camera stops when blurred or backgrounded.
Background GPS tracking challenges and approaches
Request always-allow permission, declare background modes, use a native background task or geofencing API rather than JS timers, manage battery and OS throttling.
Getting a one-time GPS location
Ensure permission, then call a getCurrentPosition wrapped in a promise (or Expo Location.getCurrentPositionAsync) with await inside try/catch, reading coords.latitude and longitude.
Requesting runtime permissions on iOS and Android
Declare permissions in Info.plist and AndroidManifest, then check status and request at runtime just before use, handling granted, denied, and blocked.
Persisting key-value preferences across launches
AsyncStorage for simple non-sensitive key-value, MMKV for speed, SecureStore or Keychain for secrets.
Shared element transitions with Reanimated
Wrap both views in Animated.View with the same sharedTransitionTag, use a native-stack navigator so Reanimated interpolates between source and target.
What is a worklet in Reanimated
A worklet is a JS function marked to run on the UI thread runtime with a captured snapshot of its scope, enabling synchronous per-frame work.
Shared values and useAnimatedStyle in Reanimated
UseSharedValue holds a mutable .value readable on both threads, useAnimatedStyle derives styles as a worklet, mutate .value with withTiming or withSpring.
Animated API versus Reanimated architecture
Animated declares animations that the native driver runs, but logic and gestures cross the bridge; Reanimated runs worklets directly on the UI thread.
Build a mount fade-in with Animated API
Create an Animated.Value(0) in a ref, drive it with Animated.timing inside useEffect, bind it to opacity on Animated.View.
Designing a native map UI component
Wrap each platform's native view, expose props mapped to native setters and events as bubbling callbacks, unify behind one JS API.
Conditional logic with Platform.Version
Platform.Version is a number on Android (API level) and a string on iOS; gate features by version to use new APIs only where supported.