Evan Bacon on Universal React Native Apps, DOM & React Server Components

Bacon describes Expo as a way to start with web code and add native features as a product grows. DOM components let teams render a component tree in a WebView, while React Server Components help fetch and prepare data. He argues that developers can improve individual components over time instead of rebuilding an entire app.

The `use dom` directive marks a component for rendering in an embedded WebView, with Metro and Expo’s universal tooling handling the web and native sides. Props go into the component, and callbacks can send events back to the native app with TypeScript support. Bacon recommends a regular WebView for loading a separately deployed website, since it cannot use the same built-in messaging.

Bacon says teams can bring an existing Expo web app to native and then choose which parts to optimize as native components. DOM components can suit content such as Markdown or complex D3 visualizations, while frequently used screens may benefit from native performance. He gives an example of putting a web page inside a DOM component and adding a widget that displays TestFlight review times.

Expo’s developer preview supports incremental adoption: an existing client app can add server functions and render their results progressively. Bacon explains that data rendered at build time can be embedded in the app, reducing repeated requests and making content available offline. Runtime server functions can still fetch newer data, with loading and error states handled through Suspense and error boundaries.

Expo builds a client bundle for the app and a JavaScript server bundle that can run through `npx expo serve` or a deployment provider. Bacon says Expo Router practices, including file-based routing and error boundaries, are useful preparation for server features. He suggests server-rendered content could let large apps download less-used screens on demand, though he says the preview is not ready for production.