Top 30 Mobile Interview Questions and Answers

30 questions. Pick an answer, or open “Show the answer” to read it.

Answers are graded in your browser. Nothing is saved, and no XP or streak is earned here. The app keeps score.

1. Question 1 of 30

   Which of the following is a key benefit of using StyleSheet.create() for styling in React Native?

   • aIt allows developers to write styles using standard CSS syntax directly within JavaScript files.
   • bIt automatically applies styles globally across all components without explicit referencing.
   • cIt optimizes performance by processing style objects once and referencing them efficiently on the native side.
   • dIt is primarily designed for creating highly dynamic styles that change frequently based on user interaction.
   Show the answer

   Answer: c · It optimizes performance by processing style objects once and referencing them efficiently on the native side.

   The card explicitly states that StyleSheet.create() processes style objects once and sends them to the native side, which is much faster than re-serializing raw JavaScript style objects on every render. Its primary use is for static styling, not dynamic changes, although it can be combined with dynamic styles.

   Read the full bite: Styling in React Native with StyleSheet

2. Question 2 of 30

   What is the fundamental mechanism by which Hermes improves React Native app startup performance?

   • aIt dynamically optimizes JavaScript code during runtime using a Just-In-Time (JIT) compiler.
   • bIt replaces JavaScript with a more performant native language for critical UI components.
   • cIt significantly reduces the final app's JavaScript bundle size by automatically tree-shaking unused modules.
   • dIt performs Ahead-Of-Time (AOT) compilation of JavaScript into optimized bytecode during the app's build phase.
   Show the answer

   Answer: d · It performs Ahead-Of-Time (AOT) compilation of JavaScript into optimized bytecode during the app's build phase.

   Hermes is an Ahead-Of-Time (AOT) focused engine that pre-compiles JavaScript into optimized bytecode during the build process, reducing the work the device has to do at startup. While it contributes to a smaller app size, its primary mechanism for faster startup is not tree-shaking or JIT compilation.

   Read the full bite: Hermes: The JS Engine for Faster React Native Apps

3. Question 3 of 30

   Which fundamental design aspect of the React Native Bridge is primarily responsible for its performance limitations and visible UI jank?

   • aThe necessity of compiling JavaScript code to native machine instructions.
   • bIts asynchronous message passing mechanism between the JavaScript and native threads.
   • cThe overhead introduced by serializing and deserializing all messages into JSON format.
   • dThe requirement for all UI components to be rendered directly by the JavaScript thread.
   Show the answer

   Answer: b · Its asynchronous message passing mechanism between the JavaScript and native threads.

   The card explicitly states that the Bridge's asynchronous nature and the inherent delays it causes are the source of its main limitations, leading to UI jank and preventing synchronous UI layout access. While JSON serialization adds overhead, the core problem causing delays and visual 'jumps' is the asynchronous communication.

   Read the full bite: The React Native Bridge: Why It's Being Replaced

4. Question 4 of 30

   When is it most appropriate to use Expo Application Services (EAS)?

   • aDuring the initial phase of development to quickly prototype UI components in Expo Go.
   • bFor managing project dependencies and installing native modules directly on your local machine.
   • cTo start a local development server and debug JavaScript code on a simulator or device.
   • dWhen preparing a production-ready build for app store submission or pushing over-the-air updates.
   Show the answer

   Answer: d · When preparing a production-ready build for app store submission or pushing over-the-air updates.

   EAS is designed for production workflows, handling cloud builds, app store submissions, and over-the-air updates for React Native apps. It is explicitly stated as distinct from local development tools like the `expo` CLI, which are used for prototyping and running local development servers.

   Read the full bite: Expo Application Services (EAS): The Cloud Toolchain for React Native

5. Question 5 of 30

   Which scenario requires creating a custom development build in Expo?

   • aAdding a new JavaScript-only utility library to your project.
   • bUtilizing a native device feature like the camera, which is already part of the Expo SDK.
   • cOptimizing app performance by pre-compiling all JavaScript code into native binaries.
   • dIntegrating a React Native library that includes native Android/iOS code not part of the Expo SDK.
   Show the answer

   Answer: d · Integrating a React Native library that includes native Android/iOS code not part of the Expo SDK.

   Custom development builds are specifically for integrating React Native libraries that contain native code not already included in the Expo SDK. Pure JavaScript libraries or features already in the SDK do not require a custom build, and performance optimization through pre-compilation is not the primary purpose of this process.

   Read the full bite: Adding Native Code to Expo (The Modern 'Eject')

6. Question 6 of 30

   What is the recommended approach for managing user input in a React Native TextInput?

   • aProvide an initial defaultValue prop and access the current input using a ref's getText() method.
   • bAllow the TextInput to manage its own internal state, retrieving the final value with a ref.
   • cSet the value prop to a state variable and update it via the onChangeText callback.
   • dDirectly modify the TextInput's content from a global store whenever the user types.
   Show the answer

   Answer: c · Set the value prop to a state variable and update it via the onChangeText callback.

   The card emphasizes treating TextInput as a controlled component, where the app's state is the single source of truth, updated by onChangeText and reflected by the value prop. Option B describes an uncontrolled component, which is not the recommended mental model for TextInput.

   Read the full bite: React Native TextInput: Handling User Input

7. Question 7 of 30

   For which scenario is React Native's Pressable component most beneficial compared to a simple Button or View with an onPress handler?

   • aWhen you need to ensure the component is always rendered with native performance optimizations.
   • bWhen you need to prevent accidental presses by requiring a double-tap gesture.
   • cWhen you want to detect specific touch stages like a finger pressing down, holding, or releasing.
   • dWhen you need a standard, platform-styled button with minimal custom logic.
   Show the answer

   Answer: c · When you want to detect specific touch stages like a finger pressing down, holding, or releasing.

   Pressable's core purpose is to provide granular control over touch interactions, allowing detection of events like onPressIn, onLongPress, and onPressOut. The card explicitly states that for standard, platform-styled buttons with minimal logic, the basic Button component is simpler, making option D incorrect.

   Read the full bite: Pressable: A More Powerful Way to Handle Touches

8. Question 8 of 30

   What is the primary consequence of omitting or incorrectly handling the onRequestClose prop for a React Native Modal on Android?

   • aThe modal's animation will default to 'none', regardless of the specified animationType.
   • bAndroid users will be unable to dismiss the modal using the hardware back button.
   • cThe modal will not render its content on Android devices.
   • dThe modal will automatically dismiss after a short, fixed duration.
   Show the answer

   Answer: b · Android users will be unable to dismiss the modal using the hardware back button.

   The card explicitly states that forgetting onRequestClose "disables the Android back button, trapping your user." This prop is crucial for allowing users to dismiss the modal via the hardware back button on Android. The modal will still render its content even if this prop is omitted.

   Read the full bite: React Native Modal: Presenting Content Above Other Views

9. Question 9 of 30

   For which scenario is Platform.select the most appropriate tool in React Native?

   • aAdjusting minor UI properties like padding or background color based on the operating system.
   • bStructuring an application with entirely separate screen components for iOS and Android.
   • cConditionally loading different data models from a backend API for each platform.
   • dImplementing distinct, complex business logic flows for iOS and Android.
   Show the answer

   Answer: a · Adjusting minor UI properties like padding or background color based on the operating system.

   Platform.select is designed for small-to-medium platform differences, such as tweaking styles like padding or background colors. It is explicitly advised against for entire screens or complex logic flows, which are better handled by platform-specific file extensions.

   Read the full bite: Platform.select: Write Once, Adapt Anywhere

10. Question 10 of 30

    You are building 'free' and 'pro' app versions using product flavors. What is the most secure and efficient way to control access to pro-only features?

    • aUse a `buildConfigField` to create a compile-time constant and check it in the code.
    • bFetch user entitlement from a server and use an if-statement to show/hide features.
    • cCheck the `applicationId` at runtime to determine if the app is the 'pro' version.
    • dPlace pro-only code in the `release` source set and free code in the `debug` source set.
    Show the answer

    Answer: a · Use a `buildConfigField` to create a compile-time constant and check it in the code.

    Using `buildConfigField` creates a compile-time constant, allowing the compiler to completely remove pro features from the free build, which is more secure and reduces APK size. Runtime checks or server calls leave the pro code inside the free app.

    Read the full bite: What is a Gradle product flavor?

11. Question 11 of 30

    When automating nightly APK deployments on a headless CI server, which characteristic of ADB makes it suitable for this task?

    • aIt streams device logs using adb logcat only when an IDE is open to receive them
    • bIt is a client-server program whose command-line client can run without Android Studio or any IDE
    • cIt functions as an Android Studio plugin that exposes terminal commands for build automation
    • dIt relies on the JDWP protocol to install APKs and manage package deployment
    Show the answer

    Answer: b · It is a client-server program whose command-line client can run without Android Studio or any IDE

    ADB is defined as a standalone client-server command-line tool in the Android SDK Platform Tools, so it can script builds and deployments without an IDE present. The distractor calling it an Android Studio plugin reflects a common misconception, while JDWP is actually the separate protocol used for Java breakpoint debugging, not ADB operations.

    Read the full bite: What is ADB? Describe two common commands and what they accomplish.

12. Question 12 of 30

    A ScrollView contains a TouchableOpacity. If a user touches an item and then drags, which statement accurately describes the default interaction using the Gesture Responder System?

    • aThe TouchableOpacity handles the entire gesture, and the ScrollView only responds if the touch starts outside the TouchableOpacity.
    • bBoth the ScrollView and the TouchableOpacity receive the touch event simultaneously, requiring manual conflict resolution.
    • cThe TouchableOpacity is asked first to respond to the initial touch, and if movement occurs, the ScrollView can then request to become the responder.
    • dThe ScrollView immediately intercepts the touch, preventing the TouchableOpacity from ever receiving it.
    Show the answer

    Answer: c · The TouchableOpacity is asked first to respond to the initial touch, and if movement occurs, the ScrollView can then request to become the responder.

    By default, the deepest component (TouchableOpacity) is asked first to handle the touch. However, during movement, a parent component like a ScrollView can use onMoveShouldSetResponder to request control and take over the gesture, as described in the canonical example. Option D describes the capture phase, which is not the default behavior.

    Read the full bite: The Gesture Responder System: Who Gets the Touch?

13. Question 13 of 30

    On a smartphone with a 390 CSS pixel wide screen, how does the viewport meta tag with width=device-width and initial-scale=1.0 affect rendering?

    • aThe browser assumes a 980px desktop viewport and scales the page down to fit the screen.
    • bThe tag makes the page responsive by resizing elements without CSS media queries.
    • cThe viewport matches the physical hardware pixel width and disables user zoom.
    • dThe layout viewport is set to 390 CSS pixels and the page loads at 100% zoom.
    Show the answer

    Answer: d · The layout viewport is set to 390 CSS pixels and the page loads at 100% zoom.

    width=device-width sets the layout viewport to the screen width in CSS pixels (390), and initial-scale=1.0 loads the page at 100% zoom. Option A describes what happens without the tag, while Option C confuses CSS pixels with physical pixels and incorrectly attributes zoom locking to initial-scale.

    Read the full bite: What is the viewport meta tag and what does width=device-width, initial-scale=1.0 do?

14. Question 14 of 30

    What is the most crucial step to ensure the RefreshControl spinner remains visible during a data fetch?

    • aProviding a 'key' prop to the RefreshControl component.
    • bSetting the 'refreshing' prop to true immediately when 'onRefresh' is called.
    • cNesting RefreshControl within a FlatList or ScrollView.
    • dEnsuring the data fetching logic is asynchronous.
    Show the answer

    Answer: b · Setting the 'refreshing' prop to true immediately when 'onRefresh' is called.

    The card emphasizes that RefreshControl is a controlled component; the 'refreshing' prop must be explicitly set to true at the start of the 'onRefresh' callback to keep the spinner visible during data fetching. Option C is necessary for RefreshControl to function, but not specifically for maintaining its visibility during the fetch itself.

    Read the full bite: RefreshControl: The Pull-to-Refresh Handler

15. Question 15 of 30

    Which callback sequence occurs when a user leaves an Activity and returns later without the system destroying it?

    • aonPause, onStop, onCreate, onStart, onResume
    • bonPause, onStop, onRestart, onStart, onResume
    • conPause, onStop, onStart, onResume
    • donPause, onDestroy, onCreate, onStart, onResume
    Show the answer

    Answer: b · onPause, onStop, onRestart, onStart, onResume

    Navigating away triggers onPause and onStop, while returning from the stopped state calls onRestart, onStart, and onResume. onCreate only runs after the Activity has been fully destroyed, so including it is a common misconception.

    Read the full bite: Describe the Android Activity lifecycle and callback order

16. Question 16 of 30

    What is the primary reason to choose React Native Reanimated for animations involving user gestures or heavy JS computation?

    • aIt simplifies the creation of complex animation sequences with fewer lines of code.
    • bIt ensures that all animation calculations are performed exclusively on the JavaScript thread for better debugging.
    • cIt allows animation logic to execute independently on the native UI thread, preventing stuttering.
    • dIt provides a more extensive set of pre-built animation components and effects.
    Show the answer

    Answer: c · It allows animation logic to execute independently on the native UI thread, preventing stuttering.

    The card explicitly states that Reanimated moves animation logic off the JavaScript thread onto the native UI thread, allowing animations to run smoothly at 60-120 fps even when the JS thread is busy. Option A is incorrect because the card mentions Reanimated introduces its own concepts, implying it's not always simpler, and its core benefit is performance, not code brevity.

    Read the full bite: React Native Reanimated: Off-Thread Animations

17. Question 17 of 30

    In the Android Debug Bridge (ADB) architecture, which component is responsible for executing commands directly on the target Android device?

    • aThe ADB server, which manages communication between the client and the device
    • bThe ADB client, which initiates commands from the development machine
    • cThe ADB daemon (adbd), which runs on the device and processes commands
    • dThe Android operating system's core services, which interpret commands from the server
    Show the answer

    Answer: c · The ADB daemon (adbd), which runs on the device and processes commands

    The card states that the 'daemon' (adbd) runs on the Android device and is responsible for executing commands. The client and server components operate on the development machine, handling command initiation and communication management, respectively.

    Read the full bite: Android Debug Bridge (ADB): A Developer's Remote Control

18. Question 18 of 30

    Under which circumstance would a developer most likely choose Stack Navigator over a native navigation solution?

    • aIf the app's navigation flow is entirely flat, without any hierarchical structure.
    • bWhen the application requires the absolute fastest possible screen transitions.
    • cTo ensure seamless integration with native platform-specific UI components.
    • dFor applications where a highly unique and custom navigation appearance is crucial.
    Show the answer

    Answer: d · For applications where a highly unique and custom navigation appearance is crucial.

    The card states that Stack Navigator is ideal when "having a highly custom look and feel is more important than achieving maximum performance," due to its JavaScript-based implementation allowing deep customization. Option B is incorrect because Stack Navigator trades performance for customization, and option C describes a benefit more aligned with native solutions.

    Read the full bite: Stack Navigator: JavaScript-based Screen Transitions

19. Question 19 of 30

    For which scenario would passing data via route parameters be considered an inefficient or inappropriate approach?

    • aProviding a user's unique ID to a profile screen to fetch their specific data.
    • bSending a small, temporary message to a confirmation screen after an action.
    • cDisplaying a specific product's details after a user selects it from a list.
    • dManaging a user's global authentication token that impacts multiple, unrelated parts of the application.
    Show the answer

    Answer: d · Managing a user's global authentication token that impacts multiple, unrelated parts of the application.

    The card explicitly states that route parameters are not a good fit for global state like authentication status that needs to be accessed by many unrelated screens, recommending dedicated state management instead. The other options describe appropriate uses for route parameters, where data is specific to a navigation action.

    Read the full bite: Passing Data to Routes in React Native

20. Question 20 of 30

    When an Android app recovers from process death, what is the key difference in state restoration compared to a configuration change, and what is the recommended solution?

    • aBoth scenarios primarily rely on onSaveInstanceState to store all necessary UI state, with no significant difference in ViewModel behavior.
    • bProcess death destroys the entire application process, including standard ViewModels, making SavedStateHandle essential for transient UI state restoration.
    • cProcess death requires restoring state from persistent storage like SharedPreferences, as the savedInstanceState Bundle is too small for meaningful UI state.
    • dStandard ViewModels automatically persist across both configuration changes and process death, as they are managed by the system.
    Show the answer

    Answer: b · Process death destroys the entire application process, including standard ViewModels, making SavedStateHandle essential for transient UI state restoration.

    Process death recreates the entire process, destroying standard ViewModels, which is why SavedStateHandle is needed to persist transient UI state. In contrast, configuration changes preserve the process and existing ViewModel instances. Option D is incorrect because standard ViewModels do not survive process death.

    Read the full bite: Handle Android Process Death vs. Configuration Changes

21. Question 21 of 30

    How are navigation actions typically processed within a nested navigator structure?

    • aThe action is immediately handled by the topmost (root) navigator in the application's hierarchy.
    • bThe action is always passed directly to the deepest nested navigator that contains the current screen.
    • cThe action is broadcast to all active navigators simultaneously, with the first one to respond taking precedence.
    • dThe action is first attempted by the currently focused navigator, then bubbles up to its parent if unhandled.
    Show the answer

    Answer: d · The action is first attempted by the currently focused navigator, then bubbles up to its parent if unhandled.

    The card states that actions are first attempted by the currently focused navigator and only bubble up to its parent if that navigator cannot handle the action. This ensures localized control and isolated state for each navigator, rather than immediate global handling.

    Read the full bite: Nested Navigators: Building Complex UI Flows

22. Question 22 of 30

    In which scenario would Native Stack Navigator be the least suitable choice for screen navigation?

    • aAn app aiming for a native look and feel on both iOS and Android.
    • bAn app prioritizing the most fluid and performant user experience.
    • cAn app that needs to display standard stack-based navigation.
    • dAn app requiring highly customized screen transition animations.
    Show the answer

    Answer: d · An app requiring highly customized screen transition animations.

    The card explicitly states to avoid Native Stack Navigator if highly customized screen transitions are needed, as its customizability is limited due to being a wrapper around native components. The other options describe scenarios where Native Stack Navigator is the recommended or default choice.

    Read the full bite: Native Stack Navigator: Native Performance, Less Customization

23. Question 23 of 30

    To execute code every time a React Native screen becomes visible after being navigated away from, which method is most appropriate?

    • aCalling a function directly within the screen's render method
    • bUsing useEffect with the screen's props as dependencies
    • cA standard useEffect hook with an empty dependency array []
    • dSubscribing to the 'focus' event using navigation.addListener
    Show the answer

    Answer: d · Subscribing to the 'focus' event using navigation.addListener

    The card states that screens remain mounted when navigated away from, so a standard useEffect with an empty dependency array (C) only runs on initial mount, not subsequent visibility changes. Subscribing to the 'focus' event (D) is the correct way to run code specifically when a screen comes into view.

    Read the full bite: React Navigation Lifecycle: Screens Don't Unmount

24. Question 24 of 30

    When designing an A/B test for copy in a native app without app store releases, what is the primary architectural pattern that safely decouples content changes from binary updates?

    • aBundling all experiment variants into the app binary at build time to guarantee offline access
    • bFetching experiment parameters asynchronously via remote config while merging them with local defaults
    • cRequiring users to force-update the app before enrolling in any new experiment
    • dUsing a CMS to update copy in real time just like on a website, since modern apps render content dynamically
    Show the answer

    Answer: b · Fetching experiment parameters asynchronously via remote config while merging them with local defaults

    Remote config merged with local defaults lets the app render immediately and change copy without a store release. Treating native apps like websites and using a CMS is wrong because binaries bundle assets at build time and cannot update instantly like the web.

    Read the full bite: A/B test copy in a native app without app store releases

25. Question 25 of 30

    What is the main advantage of using conditional navigators for authentication in React Native?

    • aIt ensures a clear separation of navigation history, preventing authenticated users from returning to login screens.
    • bIt dynamically loads screen components, reducing the initial bundle size for users.
    • cIt allows for conditional rendering of UI elements within screens based on user permissions.
    • dIt simplifies the process of managing user session tokens and authentication state.
    Show the answer

    Answer: a · It ensures a clear separation of navigation history, preventing authenticated users from returning to login screens.

    The card states that conditional navigators are crucial because "A logged-in user should never be able to use the hardware back button to return to the login screen," which is achieved by completely swapping navigation graphs. Option C is a common misconception, as the card explicitly advises against using this pattern for conditional UI within an authenticated part of the app.

    Read the full bite: React Native Auth Flows: Conditional Navigators

26. Question 26 of 30

    What is the primary mechanism FlatList uses to ensure smooth performance with long lists on mobile devices?

    • aIt compresses the data prop and individual item components to reduce memory usage.
    • bIt automatically caches the results of renderItem calls to avoid re-executing them for identical data.
    • cIt renders all list items immediately but off-screen, then quickly displays them as needed.
    • dIt maintains a small "render window" of items, mounting and unmounting components as the user scrolls.
    Show the answer

    Answer: d · It maintains a small "render window" of items, mounting and unmounting components as the user scrolls.

    FlatList's core performance optimization is virtualization, which means it only renders a limited "window" of items that are currently visible or near the viewport. Option C is incorrect because rendering all items, even off-screen, would still consume excessive memory, which FlatList aims to prevent.

    Read the full bite: FlatList: Performant Virtualized Lists in React Native

27. Question 27 of 30

    According to the provided information, what is a crucial caveat regarding the effectiveness of App Store Optimization (ASO)?

    • aASO is a one-time process that guarantees sustained organic growth after initial implementation.
    • bASO is primarily designed for established apps with existing user bases, not new launches.
    • cASO cannot overcome the fundamental flaws of a low-quality or undesirable application.
    • dASO's benefits are limited to improving search rankings and do not impact conversion rates.
    Show the answer

    Answer: c · ASO cannot overcome the fundamental flaws of a low-quality or undesirable application.

    The card explicitly states, "ASO is not a substitute for a good product. Optimizing a buggy or useless app will only accelerate its failure." This highlights that ASO cannot compensate for fundamental product quality issues. Distractor D is incorrect because the card emphasizes ASO as a "continuous process," not a one-time task.

    Read the full bite: App Store Optimization (ASO): SEO for Mobile Apps

28. Question 28 of 30

    What is the primary reason iOS transitions an app from the BACKGROUND to the SUSPENDED state?

    • aTo free up CPU cycles and battery while retaining the app's state in memory for a quick relaunch.
    • bTo provide the user with a notification that the app is no longer actively running.
    • cTo allow the app to continue executing long-running background tasks without interruption.
    • dTo immediately terminate the app and reclaim all system resources, including memory.
    Show the answer

    Answer: a · To free up CPU cycles and battery while retaining the app's state in memory for a quick relaunch.

    The SUSPENDED state freezes the app in memory, stopping all code execution to conserve CPU and battery, yet allows for a fast return to the ACTIVE state. It does not allow for continued background tasks, nor does it immediately terminate the app.

    Read the full bite: iOS App States: From Launch to Suspension

29. Question 29 of 30

    When a pointer down hits both a nested TapGestureDetector and a VerticalDragGestureDetector, what determines the winning gesture?

    • aThe deepest widget in the tree automatically wins the gesture stream.
    • bThe recognizer that receives the pointer-down first synchronously claims exclusive ownership.
    • cThe framework always prefers the drag over the tap to avoid scrolling conflicts.
    • dThe arena resolves when only one recognizer remains accepted after voting across pointer events.
    Show the answer

    Answer: d · The arena resolves when only one recognizer remains accepted after voting across pointer events.

    The GestureArenaManager collects accept or reject votes from recognizers across multiple pointer events, and the last remaining accepted member wins. This makes A wrong because widget depth alone never decides the outcome; gesture disambiguation is a separate phase after hit testing.

    Read the full bite: Explain Flutter's GestureArena and overlapping detector scenario

30. Question 30 of 30

    What is the main purpose of using a loading flag with `onEndReached` in a React Native `FlatList`?

    • aTo ensure the `onEndReached` callback only fires once per scroll session.
    • bTo adjust the `onEndReachedThreshold` dynamically based on network conditions.
    • cTo prevent redundant API calls when the user scrolls quickly near the end of the list.
    • dTo control the visibility of a loading indicator while new data is being fetched.
    Show the answer

    Answer: c · To prevent redundant API calls when the user scrolls quickly near the end of the list.

    The card explicitly states that `onEndReached` can fire multiple times, and a loading flag is used to prevent redundant API calls. While a loading flag can also control indicator visibility, its primary role in this context is to manage the 'footgun' of multiple fetches.

    Read the full bite: React Native: Infinite Scroll with onEndReached