From React Native Web to React Strict DOM

youtube-cover
Subtitles
Show

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Timestamps
Show

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Listen on Spotify
Watch on YouTube
Listen on SoundCloud
Listen on Apple Podcasts
Guests
Nicolas Gallagher
Software Engineer
@
Meta

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Show Transcript

Nicolas Gallagher (Meta) details the evolution from React Native Web (RNW) to React Strict DOM (RSD). RNW's origin wasn't to run native apps on the web; it was to bring React Native's styling constraints and "proper encapsulation" to web development, solving the unpredictable styling issues he faced at Twitter.

React Strict DOM is the next phase. It provides a shared API that aligns with web standards. For web, it's a zero-overhead syntax: a Babel plugin "flattens" RSD components (like <html.div>) directly into standard HTML tags (<div>) and compiles styling to static CSS.

This approach gives web code the "option value" of running on native. The goal is to allow developers to write component libraries once. The majority of the code runs on both platforms, while platform-specific components (like VirtualizedList) become exceptions handled by RN's forking mechanism, not the default.

Summary

Need help with React or React Native projects?

We support teams building scalable apps with React and React Native.

Let’s chat
Link copied to clipboard!
//
Insights

Learn more about React

Here's everything we published recently on this topic.

//
React

We can help you move
it forward!

At Callstack, we work with companies big and small, pushing React Native everyday.

React Native Performance Optimization

Improve React Native apps speed and efficiency through targeted performance enhancements.

Code Sharing

Implement effective code-sharing strategies across all platforms to accelerate shipping and reduce code duplication.

Web App Development

Build a solid foundation that meets latest standards and scales easily to other platforms in the future.

Next.js Development

Use Next.js to build fast, SEO-friendly web applications with server-side rendering at the edge.