What is Metro bundler in React Native?

Metro is the JavaScript bundler for React Native — it takes your JavaScript source files and bundles them into a single bundle that the app loads. Similar to Webpack for web but optimized for mobile. Key features: (1) Fast bundling: Metro is optimized for mobile development — incremental builds, parallel processing; (2) Hot Module Replacement (HMR) / Fast Refresh: when you save a file, Metro sends only the changed modules to the running app — preserves component state across code changes; (3) Dependency resolution: resolves imports/requires, handles platform-specific files (.ios.js, .android.js); (4) Asset management: handles images, fonts, and other assets with automatic resolution for @2x/@3x densities; (5) Source maps: generates source maps for debugging. Starting Metro: runs automatically when you run npx react-native start or npx expo start. Default port: 8081. metro.config.js: configuration file for Metro: const { getDefaultConfig } = require("@react-native/metro-config"); const config = getDefaultConfig(__dirname); // Add custom extensions: config.resolver.sourceExts.push("svg"); module.exports = config;. Caching: Metro caches transformed files — --reset-cache flag clears this cache. Use when facing strange bundling issues. Production bundle: npx react-native bundle --platform ios --dev false --entry-file index.js --bundle-output ios/main.jsbundle. Bundle splitting / lazy loading: Metro supports RAM bundles and lazy module loading for faster startup on large apps.