expo-dom

Topics in the source

• What are DOM Components?
• When to Use DOM Components
• When NOT to Use DOM Components
• Basic DOM Component
• Rules for DOM Components
• The dom Prop
• Common dom Prop Options
• Exposing Native Actions to the Webview

DOM components allow web code to run verbatim in a webview on native platforms while rendering as-is on web. This enables using web-only libraries like recharts, react-syntax-highlighter, or any React web library in your Expo app without modification. Use DOM components when you need: Web-only libraries — Charts (recharts, chart.js), syntax highlighters, rich text editors, or any library that depends on DOM APIs Migrating web code — Bring existing React web components to native without rewriting Complex HTML/CSS layouts — When CSS features aren't available in React Native iframes or embeds — Embedding external content that requires a browser context Canvas or WebGL — Web graphics APIs not available natively Avoid DOM components when: Native performance is critical — Webviews add overhead Simple UI — React Native components are more efficient for basic layouts Deep native integration — Use local modules instead for native APIs Layout routes — layout files cannot be DOM components Create a new file with the 'use dom'; directive at the top: 1. Must have 'use dom'; directive at the top of the file 2. Single default export — One React component per file 3. Own file — Cannot be defined i

This is an excerpt. Refer to the complete source and its current requirements.