DEV Community

Cover image for 56 React Native Interview Questions: Junior to Senior (2026)
Vincent Asscher
Vincent Asscher

Posted on • Originally published at reactnative-jobs.com

56 React Native Interview Questions: Junior to Senior (2026)

Originally published on ReactNative-Jobs.com

You landed an interview for a React Native position. Now what?

We run a React Native job board with 50+ open positions, from junior to lead roles. We see what companies ask for in their listings, and we talk to hiring managers about what separates candidates who get offers from those who don't.

This guide covers the questions you'll actually face, organized by experience level, with the kind of answers that get you hired.

Jump to your level:

How React Native Interviews Work

Most React Native interviews follow a predictable structure:

  1. Screening call (30 min): Recruiter checks your background, salary expectations, and motivation
  2. Technical phone screen (45-60 min): A developer asks conceptual questions and maybe a small coding exercise
  3. Take-home or live coding (2-4 hours): Build a small app or feature
  4. System design / architecture (45-60 min): Senior roles only. Design a mobile app architecture
  5. Team fit / behavioral (30 min): Culture, collaboration, conflict resolution

The questions below map to stages 2 and 4. We've grouped them by experience level so you can focus on what's relevant.

Junior React Native Interview Questions (0-2 Years)

These test whether you understand the fundamentals. Interviewers aren't expecting deep expertise. They want to see that you can build things and explain your reasoning.

1. What is React Native and how does it differ from React?

React is a JavaScript library for building web UIs. React Native uses the same component model and JSX syntax but renders to native mobile components instead of HTML. A <View> in React Native becomes a UIView on iOS and android.view.View on Android. You write JavaScript, but the user sees a native app.

2. What's the difference between a functional component and a class component?

Functional components are plain functions that accept props and return JSX. Class components extend React.Component and use lifecycle methods. Since React 16.8, functional components with hooks are the standard. You'll rarely see class components in new React Native code, but you might encounter them in older codebases.

React Native Hooks Interview Questions

3. Explain the useState and useEffect hooks.

useState declares a state variable. It returns the current value and a setter function. When you call the setter, the component re-renders with the new value.

useEffect runs side effects after render. Pass it a function and a dependency array. Empty array means it runs once on mount. No array means it runs after every render. Return a cleanup function for subscriptions or timers.

4. How does the Virtual DOM work in React Native?

React Native doesn't use a DOM at all. It uses a virtual representation of the native UI tree. When state changes, React creates a new virtual tree, diffs it against the previous one, and sends only the minimal set of changes to the native side through the bridge. This is what makes updates efficient.

5. What's the difference between ScrollView and FlatList?

ScrollView renders all its children at once. Fine for short lists, terrible for long ones because it'll eat memory. FlatList virtualizes the list, only rendering items currently visible on screen (plus a small buffer). Always use FlatList for lists longer than a couple dozen items.

6. How do you handle navigation in React Native?

React Navigation is the standard library. It provides stack, tab, and drawer navigators. You define screens, configure transitions, and pass params between screens. The key concepts are: NavigationContainer wraps your app, navigators define the structure, and navigation.navigate() moves between screens.

7. What is the purpose of StyleSheet.create()?

It creates a validated style object. Styles in React Native are JavaScript objects, not CSS. StyleSheet.create() validates your styles at creation time — you'll get clear errors for invalid properties during development instead of silent failures at runtime. It historically assigned numeric IDs for bridge efficiency, but with the New Architecture and JSI, that optimization is largely irrelevant. The real value today is dev-time validation, type checking, and enabling static analysis tooling.

8. How do you handle platform-specific code?

Three ways: the Platform.OS check for small differences, the Platform.select() method for choosing between values, or separate files with .ios.js / .android.js extensions for larger differences. React Native automatically picks the right file based on the platform.

9. What is AsyncStorage and when would you use it?

AsyncStorage is a simple, unencrypted key-value store that persists data locally on the device. Use it for small amounts of non-sensitive data: user preferences, UI state, feature flags. For large datasets or complex queries, use SQLite or WatermelonDB. For sensitive data like tokens or credentials, use the device keychain instead (covered in Q29).

10. How do you debug a React Native app?

The built-in dev menu (shake the device or Cmd+D) gives you access to the JS debugger, element inspector, and performance overlay. React DevTools lets you inspect the component tree, props, and state. For network inspection and logs, the React Native community has shifted away from Flipper (Meta deprecated active development in 2024) toward Chrome DevTools via Hermes' built-in inspector and the j shortcut in Metro. For performance profiling, the Performance Monitor overlay shows JS/UI thread FPS and memory usage. Xcode Instruments and Android Studio Profiler remain the best tools for native-layer performance issues.

11. What's the difference between props and state?

Props are passed from parent to child and are read-only. State is managed within the component and can be updated. When either changes, the component re-renders. Think of props as function arguments and state as local variables that persist between renders.

12. How do you handle images in React Native?

Local images use require(): <Image source={require('./photo.png')} />. Remote images need a uri and explicit dimensions: <Image source={{uri: 'https://...'}} style={{width: 200, height: 200}} />. For better performance, use FastImage (a popular library) which adds caching and priority loading.

13. What's the purpose of key in lists?

Keys help React identify which items changed, were added, or removed. Use a unique, stable identifier, typically the item's ID from your data. Never use array index as a key if the list can be reordered, filtered, or items can be added/removed. Bad keys cause subtle bugs and poor performance.

14. How do you make network requests in React Native?

Use the built-in fetch API, same as in web browsers. For more features (interceptors, cancellation, timeouts), use axios. Always handle loading states, errors, and clean up requests when the component unmounts. Use AbortController or a library like React Query for proper request lifecycle management.

15. What are controlled vs uncontrolled components?

A controlled component gets its value from state and updates via a callback: <TextInput value={text} onChangeText={setText} />. An uncontrolled component manages its own internal state. Controlled components give you full control over form data. In React Native, controlled inputs are the standard pattern.

Mid-Level React Native Interview Questions (2-5 Years)

These go deeper into architecture, performance, and real-world patterns. Interviewers expect you to have opinions backed by experience.

16. Explain the React Native bridge and its limitations.

The bridge is the communication layer between JavaScript and native code. JS runs in a separate thread, and messages are serialized as JSON and sent asynchronously across the bridge. The limitation is that heavy traffic (like animating while processing data) can clog the bridge and cause frame drops. This is why the New Architecture replaces it with JSI.

17. What is the New Architecture and where does it stand in 2025?

As of React Native 0.74+, the New Architecture is the default for new projects, not a future roadmap item.

Fabric replaces the old async bridge-based renderer with synchronous, direct access to the native UI layer through JSI (JavaScript Interface). It supports concurrent rendering, meaning React can prepare multiple UI trees simultaneously and commit them when ready, reducing visual glitches during complex transitions. Layout calculations (Yoga) now happen synchronously with the JS thread, eliminating an entire class of layout flicker bugs that plagued the old architecture.

TurboModules replace the old Native Modules system. They're lazy-loaded (only initialized when first called, improving startup time) and use JSI for direct C++ calls instead of JSON serialization across the bridge. The codegen tool generates type-safe native interfaces from your JS specs, catching type mismatches at build time.

The interop layer lets unmigrated libraries work on the New Architecture, but it's transitional. As of RN 0.76 the expectation is full migration, not indefinite compatibility shims.

What breaks during migration: third-party libraries that rely on the old bridge API, custom native modules that haven't adopted TurboModule specs, and anything depending on the old async batching behavior of the bridge (some animations and gesture handlers assumed asynchronous communication).

React Native Performance Interview Questions

18. How do you optimize FlatList performance?

Key strategies: use getItemLayout if items have fixed height (skips measurement). Set keyExtractor properly. Use React.memo to prevent unnecessary re-renders of list items. Increase windowSize for smoother scrolling or decrease it to save memory. Use removeClippedSubviews on Android. Keep items simple and move complex logic out of render.

19. Explain useMemo and useCallback. When do you actually use them?

useMemo caches a computed value. useCallback caches a function reference. Use useMemo when a calculation is expensive and inputs rarely change. Use useCallback when passing callbacks to child components wrapped in React.memo. Don't use them everywhere. They add complexity and the memoization itself has a cost. Profile first.

20. How do you manage global state in a React Native app?

Options from simplest to most complex: React Context for small apps with infrequent updates. Zustand for medium apps (minimal API, good performance). Redux Toolkit for large apps that need middleware, time-travel debugging, or team conventions. React Query / TanStack Query for server state specifically. Pick the simplest one that works.

21. How do you handle deep linking in React Native?

Deep linking lets URLs open specific screens in your app. Configure URL schemes (myapp://) for custom links and Universal Links (iOS) / App Links (Android) for web URLs. React Navigation has built-in support through linking config on NavigationContainer. Map URL patterns to screen names and param extraction.

22. What's the difference between Expo and bare React Native?

Expo is a managed platform on top of React Native. It handles native builds, OTA updates, and provides pre-built native modules. The tradeoff is you can't add custom native code unless you use dev builds or eject. Bare React Native gives full control over native code but requires Xcode/Android Studio setup. Most new projects start with Expo now.

23. How do you handle animations in React Native?

The built-in Animated API can run animations on the native thread, but only when you set useNativeDriver: true, and that only supports non-layout properties (opacity, transform). Layout properties like width, height, and position still run on the JS thread, which means frame drops under load. LayoutAnimation handles simple layout transitions but gives you little control.

For anything real, react-native-reanimated (v3+) is the standard. It runs entirely on the UI thread via worklets, which are JavaScript functions compiled to run outside the JS thread. This means your animations stay at 60fps even when the JS thread is busy processing data. Pair it with react-native-gesture-handler for gesture-driven interactions. The key mental model: Reanimated shared values are not React state. They update the UI thread directly without triggering re-renders.

24. Explain how you'd implement offline-first functionality.

Cache API responses locally (SQLite, WatermelonDB, or MMKV for key-value). Queue write operations when offline and sync when connectivity returns using NetInfo.

The interesting part is conflict resolution, and this is where interviewers dig in. Last-write-wins is simple but loses data. Operational transforms (like Google Docs) are complex but preserve intent. For most mobile apps, a practical middle ground works: version each record server-side, detect conflicts on sync, and either auto-merge non-overlapping field changes or surface conflicts to the user for manual resolution. Your sync queue should be idempotent so retrying a failed sync doesn't create duplicates. Show clear UI states throughout: synced, syncing, offline with N pending changes.

25. How do you handle different screen sizes and orientations?

Use flexbox for relative layouts instead of fixed pixels. The Dimensions API and useWindowDimensions hook give screen size. For responsive breakpoints, calculate based on screen width. Test on both small (iPhone SE) and large (iPad, tablet) screens. Handle orientation changes by listening to dimension updates.

26. What testing strategies do you use for React Native?

Unit tests with Jest for business logic. Component tests with React Native Testing Library (test behavior, not implementation). Integration tests for screen flows. E2E tests with Detox or Maestro for critical user paths. The testing pyramid applies: many unit tests, fewer integration tests, minimal E2E tests.

27. How do you handle push notifications?

Use react-native-firebase (FCM for Android, APNs for iOS) or a service like OneSignal. Register for permissions, get a device token, send it to your backend. Handle notifications in three states: foreground (show in-app alert), background (handle when tapped), and killed (cold launch from notification). Deep link from notification data to the right screen.

28. Explain the component lifecycle in React Native.

With hooks: useState initializer runs on mount. useEffect with empty deps runs after first render (like componentDidMount). useEffect with deps runs when dependencies change. The cleanup function runs before the next effect and on unmount. useLayoutEffect runs synchronously after DOM mutations but before paint. Use it for measurements.

29. How do you secure a React Native app?

Don't store sensitive data in AsyncStorage (it's not encrypted). Use the device keychain via react-native-keychain for credentials and tokens. Pin SSL certificates to prevent MITM attacks. Hermes compiles your JS to bytecode, which is harder to casually read than plain JavaScript, but don't rely on it as obfuscation because dedicated tools can still decompile it. For actual code protection, consider ProGuard (Android) and ensuring you're not bundling secrets in the JS payload at all. Validate all input. Don't hardcode API keys. Use environment variables loaded at build time and a config service for runtime secrets. On iOS, enable App Transport Security; on Android, use the Network Security Config to restrict cleartext traffic.

30. What's your approach to error handling in React Native?

Global JS error handler with ErrorUtils.setGlobalHandler. React Error Boundaries to catch component errors and show fallback UI. Try-catch for async operations. Crash reporting with Sentry or Crashlytics. Network errors should show user-friendly messages with retry options, not raw error text.

31. How do you handle environment-specific configuration?

Use react-native-config to load .env files per environment (dev, staging, production). Store API URLs, feature flags, and environment names. Never commit .env files with secrets. For build-time configuration, use build flavors (Android) and schemes (iOS).

32. Explain code splitting and lazy loading in React Native.

React Native bundles all JS into a single file by default. Use React.lazy() with Suspense for lazy-loading screens — the component only loads when it's first rendered, reducing initial bundle parse time. Hermes bytecode compilation is the primary startup optimization in 2025: it pre-compiles JavaScript to bytecode at build time, so the runtime skips parsing entirely. (RAM bundles, which loaded modules on demand, are deprecated in favor of Hermes.) For large apps, dynamic import() lets you defer loading entire feature modules until users navigate to them. Metro bundler's getModules config can also help you analyze and optimize what goes into the initial bundle.

33. How do you handle forms in React Native?

For simple forms, controlled components with useState work fine. For complex forms with validation, use react-hook-form, which minimizes re-renders and has a clean API. Pair it with zod or yup for schema validation. Handle keyboard avoidance with KeyboardAvoidingView and scroll to errored fields.

34. What metrics do you track in production?

App startup time, crash rate, ANR rate (Android), JS bundle size, API response times, and user engagement. Use Firebase Performance Monitoring or custom analytics. Track screen render times for key flows. Monitor OTA update adoption rates if using Expo Updates or CodePush.

35. How do you approach upgrading React Native versions?

Read the changelog and breaking changes first. Use the React Native Upgrade Helper (diff tool) to see exactly what changed. Upgrade in a branch, fix issues one at a time. Test on both platforms. If you're on Expo, expo upgrade handles most of it. Budget time for native dependency updates since they're usually the hardest part to get right.

Advanced React Native Questions

These look simple but reveal deeper understanding. Interviewers use them to separate candidates who've memorized answers from those who've debugged real apps.

36. Can you use async functions inside useEffect?

Not directly, and this catches a lot of people. useEffect expects its callback to return either nothing or a cleanup function. An async function returns a Promise, which React ignores. The fix: define the async function inside the effect and call it immediately. The deeper insight interviewers want: this also affects cleanup. If your async operation completes after unmount, you'll get a state update on an unmounted component. Use an AbortController or a boolean flag in the cleanup to prevent it.

37. What happens when you call setState during render?

React will throw an infinite loop error. The component renders, triggers setState, which triggers another render, which triggers setState again. This sounds obvious, but it comes up in subtle ways: computing derived state inside the component body and accidentally calling a setter, or passing a function call instead of a function reference to an event handler (onPress={doThing()} vs onPress={doThing}). The fix for derived state is useMemo, not useState.

Senior React Native Interview Questions (5+ Years Experience)

These focus on architecture, decision-making, and leadership. The interviewer wants to understand how you think about complex trade-offs, not just what you'd do, but why, and what you'd sacrifice to get there.

38. How do you design the architecture for a large-scale React Native app?

Everyone says "feature-based folder structure" — interviewers want to hear how you actually enforce it. The real answer is about boundaries and contracts. Each feature module exposes a public API (a navigator, a set of hooks, maybe a context provider) and hides everything else. Import restrictions, whether through ESLint rules, module boundaries in a monorepo, or just code review discipline, prevent features from reaching into each other's internals. The navigation graph is the spine: define it centrally, but let each feature register its own screens. State that crosses feature boundaries flows through a thin shared layer (an event bus, a global store slice, or React Context), never through direct imports. The architecture is good when you can delete an entire feature folder and only break the navigation registration.

39. When would you recommend against using React Native?

This question tests whether you're a framework zealot or a pragmatist. The honest answer: React Native is the wrong choice more often than people admit. A 3D game or a video editor that needs frame-perfect rendering? Native or a game engine. An app that lives deep in the OS (custom camera pipelines, real-time Bluetooth protocols, background audio processing with strict timing)? You'll fight the abstraction layer constantly. A team of experienced Swift and Kotlin developers with no JavaScript background and a tight deadline? Forcing React Native on them is an ego choice, not an engineering one. And if you only need one platform, the cross-platform tax (two sets of platform quirks, bridge overhead, native module maintenance) buys you nothing.

40. How do you handle native module development?

With the New Architecture, the workflow is: define your module's interface in a JS spec file (using TypeScript or Flow type annotations), run codegen to generate the native boilerplate, then implement the platform-specific logic in Swift/Kotlin against the generated interface.

The hard parts interviewers ask about: type mapping — JS numbers are doubles, so passing large integers (like database IDs) to native code can lose precision silently. Use strings for IDs. Promises vs callbacks vs events — use Promises for one-shot async operations, event emitters for streams or ongoing notifications. Threading — native module methods run on a background queue by default on iOS; if you need to touch UIKit, you must dispatch to the main thread. On Android, @ReactMethod runs on a separate thread pool, not the main thread.

For old-architecture projects, you're still writing bridge modules with RCT_EXPORT_METHOD (iOS) and @ReactMethod (Android). The key difference from TurboModules: old modules are eagerly loaded at startup (even if never used), and all data crosses the bridge as serialized JSON. TurboModules are lazy and use JSI for direct native calls, which is measurably faster for modules called frequently.

Test on both platforms separately. Document the exact data types flowing across the boundary. Publish as a separate package with a turbo module spec so it works on both architectures.

41. Describe your approach to migrating a large app to the New Architecture.

Start with an audit: list every native module (custom and third-party) and check each against the React Native New Architecture compatibility table. Libraries maintained by Software Mansion and Callstack are generally ready; smaller community packages may not be. This audit determines your timeline more than anything else.

Migrate TurboModules first. They're backward compatible via the interop layer, so you can ship them to production while the rest of the app still runs on the old architecture. Note: the interop layer is transitional and being phased out as of RN 0.76. Don't rely on it long-term. If a critical dependency hasn't migrated, that's a replacement decision, not a "we'll wait" decision. Write codegen specs for your custom modules, generate the native boilerplate, and verify the type contracts match. The most common breakage: modules that relied on NativeEventEmitter patterns or made assumptions about async bridge batching.

Enable Fabric per-screen, not all at once. Wrap migrated screens in the new renderer while keeping unmigrated screens on the old one. React Native supports this mixed mode. Test animations and gesture handlers carefully; Fabric's synchronous rendering changes timing behavior that some gesture-based UIs depend on.

Run CI builds with both newArchEnabled: true and false throughout the migration. Your migration is done when you can flip the flag and your entire test suite passes. Budget 2-4 weeks for a medium app, 2-3 months for a large app with many custom native modules.

42. How do you handle performance monitoring and optimization?

Measure first. Use React Native DevTools Profiler to identify slow component renders, Systrace for Android thread-level analysis, and Xcode Instruments for iOS. Identify the bottleneck: is it JS thread, UI thread, or JSI call overhead? Common fixes: memoize expensive renders, move computation to native modules, use Hermes for faster JS execution, optimize images, reduce bundle size.

43. How do you structure a monorepo for a React Native project?

Use Yarn workspaces or Turborepo. Shared packages: ui (components), core (business logic), api (network layer). Apps: mobile (React Native), optionally web (React). Keep native dependencies in the mobile app's package.json, not shared packages. Use TypeScript path aliases for clean imports.

44. How do you manage feature flags in a mobile app?

Use a remote config service (LaunchDarkly, Firebase Remote Config, or Unleash). Cache flags locally for offline access. Evaluate flags at the feature boundary, not deep inside components. Use a React Context provider that loads flags on app start. Plan for flag cleanup because dead flags are tech debt.

45. Describe how you'd implement a design system for React Native.

Start with design tokens: colors, spacing, typography, elevation as a theme object. Build primitive components (Button, Text, Input, Card) that consume the theme via Context. Use TypeScript for strict prop types. Document with Storybook for React Native. Ensure components handle both platforms and accessibility. Ship as a separate package in a monorepo.

46. How do you handle app updates and versioning?

OTA updates (Expo Updates, CodePush) for JS changes let users get fixes without app store review. Native changes require a full binary release. Use semantic versioning. Implement a minimum version check: force update for breaking API changes, soft prompt for recommended updates. Track which versions are in the wild.

47. How do you lead a mobile development team?

The technical part is easy: pick conventions, write them down, enforce through code review. The hard part is what interviewers actually care about. How do you handle the senior developer who writes brilliant code but refuses to write tests? How do you prioritize when product wants three features and you have capacity for one? How do you give honest feedback to someone whose PR is fundamentally wrong without demoralizing them? Lead with context, not control. Explain why decisions are made so the team can make good decisions when you're not in the room. Protect your team from context-switching and scope creep. The most underrated skill is knowing when to ship something imperfect versus when to push back and do it right.

48. How do you approach accessibility in React Native?

Use semantic props: accessibilityLabel, accessibilityRole, accessibilityHint. Test with VoiceOver (iOS) and TalkBack (Android) regularly. Ensure touch targets are at least 44x44 points. Support dynamic text sizes. Use proper heading hierarchy. Test with accessibility inspector tools. Make it part of code review, not an afterthought.

React Native System Design Interview Questions

49. How would you design a real-time chat feature?

WebSocket connection managed by a service layer, not tied to components. Use a local database (WatermelonDB) for message persistence and offline support. Implement optimistic updates: show the message immediately, sync state later. Handle connection drops with automatic reconnection and message queue. Paginate message history with FlatList inverted.

50. How do you handle A/B testing in React Native?

Integrate with an experimentation platform (Optimizely, Firebase A/B Testing, or custom). Fetch experiment assignments on app start, cache them. Wrap feature variations in experiment components. Track conversion events. Be careful with UI experiments because inconsistent experiences frustrate users. Run experiments long enough for statistical significance.

51. What's your approach to technical debt in a mobile codebase?

Track it visibly. Maintain a tech debt backlog. Allocate 15-20% of sprint capacity for debt reduction. Prioritize debt that slows down feature development or causes bugs. Refactor alongside feature work when possible. Don't ask for permission to write clean code. Just do it within reasonable scope. The biggest source of debt is code nobody understands.

52. How do you evaluate and choose third-party libraries?

Check: maintenance status (last commit, open issues response time), weekly downloads, bundle size impact, native dependency complexity, TypeScript support, and whether you can replace it if abandoned. Read the source code for critical dependencies. Prefer libraries from known maintainers (Software Mansion, Callstack, Expo). Fewer dependencies is always better.

53. What is Hermes and why does it matter?

Hermes is a JavaScript engine built specifically for React Native. It's the default engine since RN 0.70. Unlike V8 or JavaScriptCore, Hermes compiles JavaScript to bytecode at build time, so the app doesn't parse raw JS on startup — this cuts startup time by 30-50% on mid-range Android devices, where the gains are most dramatic. On high-end iPhones the improvement is smaller because JavaScriptCore was already fast there. It also uses less memory because the bytecode format is more compact and Hermes' garbage collector is optimized for mobile (incremental GC, no long pauses).

Practical implications: Hermes supports most of ES2020+ but has some gaps — check the compatibility table if you're using cutting-edge syntax. The bytecode format means you can't dynamically execute arbitrary JS strings at runtime (no eval). Debugging works through Chrome DevTools via Hermes' built-in inspector protocol, not the old Chrome debugger (which ran code in Chrome's V8, causing subtle behavior differences). If your app has startup performance issues, enabling Hermes is the first thing to try.

54. How do useTransition and concurrent features work in React Native?

React 18's concurrent features are available in React Native with the New Architecture. useTransition lets you mark state updates as non-urgent so React can interrupt them to handle more important updates (like user input) first, then resume the deferred work.

In practice: imagine navigating from a dashboard to a detail screen that loads and renders a large dataset — order history, analytics charts, a feed with images. Without transitions, the navigation animation stutters because React is busy rendering the heavy destination screen. With startTransition(() => setSelectedScreen(detailScreen)), React keeps the transition animation smooth, renders the new screen in the background, and commits it when ready. The isPending boolean lets you show a skeleton or spinner on the destination screen while it prepares. This is more realistic than the classic "search input" tutorial example. In production RN apps, the pain point is almost always navigation transitions competing with data-heavy screen renders.

The catch: this only helps when the JS thread is the bottleneck. If your performance issue is on the native rendering side, concurrent features won't help. And shared values in Reanimated operate outside React's scheduler entirely — they don't participate in transitions. Use concurrent features for data-heavy UI updates and Reanimated for animations.

55. How do you configure Metro bundler for complex projects?

Metro is React Native's bundler and its config (metro.config.js) comes up constantly in senior interviews, especially for monorepo setups. Key configurations: watchFolders to include packages outside your project root (essential for monorepos). resolver.nodeModulesPaths to control module resolution order when multiple node_modules exist. resolver.extraNodeModules to alias packages. transformer.getTransformOptions to enable tree shaking or configure Hermes.

For monorepos, the typical pain point is Metro not finding packages in sibling workspaces. The fix: add workspace roots to watchFolders and configure resolver.nodeModulesPaths to point to the root node_modules. If you have platform-specific code, custom resolver.resolveRequest functions let you override how Metro finds files — useful for swapping implementations per platform beyond the basic .ios.js/.android.js convention.

Performance-wise: configure maxWorkers for CI environments, use cacheStores for persistent caching between builds, and resolver.blockList to exclude directories Metro shouldn't watch (like other apps in a monorepo).

56. How do you handle background tasks in React Native?

This is where React Native's abstraction leaks the most, because iOS and Android have fundamentally different background execution models.

iOS is restrictive: apps get ~30 seconds of background execution after the user leaves, then they're suspended. For longer work, you need specific entitlements — background audio, location updates, background fetch (scheduled at the OS's discretion, not yours), or push notification processing. BGTaskScheduler lets you register maintenance tasks, but iOS decides when to run them based on battery, network, and usage patterns. You don't control the timing.

Android is more permissive but increasingly restricted with each OS version. Foreground services (with a visible notification) can run indefinitely. WorkManager handles deferrable background work with guaranteed execution. Starting with Android 12+, background service restrictions mean you need to use foreground services for time-sensitive work.

In React Native, react-native-background-fetch provides a cross-platform API for periodic background execution. Headless JS (AppRegistry.registerHeadlessTask) lets you run JavaScript when the app is in the background, but only on Android. For iOS, you typically need a native module that handles the background entitlement and calls into JS when triggered. Always test background behavior on real devices. Simulators are far more lenient than actual OS enforcement.

How to Prepare: Your Study Plan

Don't try to memorize answers. Interviewers spot rehearsed responses instantly. Instead:

Week 1-2: Build something.
Create a small app that uses navigation, API calls, state management, and a FlatList. This covers 80% of junior/mid questions through hands-on experience.

Week 3: Go deeper.
Focus on the topics that separate mid from senior: the New Architecture (Q17), performance optimization (Q18-19), and animations with Reanimated (Q23). If you're targeting senior roles, add Hermes internals (Q53), Metro configuration (Q55), and background tasks (Q56).

Week 4: Practice explaining.
Explain concepts out loud. Record yourself. If you can't explain useEffect cleanup in plain English, you don't understand it well enough. Technical communication matters as much as technical knowledge.

Throughout: Read the docs.
The React Native documentation is genuinely good. Most interview questions come straight from core concepts covered there.

Ready to Put Your Skills to Work?

You've studied the questions. You understand the concepts. Now find the right role.

ReactNative-Jobs.com has 50+ open positions, from junior roles to senior positions to lead roles. Remote, hybrid, and on-site.

Every listing is React Native. No filtering through irrelevant posts.

Browse All React Native Jobs


More resources:

Top comments (0)