WhoBuilt

React Native for TV App Development

Dec 13, 2023· 1 h 1 min· 2.7K views·Watch on YouTube

Speakers

Łukasz Chludziński of Callstack talks with Xite engineers Yao and Carol about React Native TV development, its target platforms, benefits, and constraints.

A fragmented TV market

The guests describe a broad device landscape: smart TVs, streaming sticks and set-top boxes, plus consoles and other screens. Platforms include Android TV, tvOS, Roku, Samsung Tizen, and LG webOS, with regional differences in their reach. Some Android TV operator-tier devices can use an app as their home screen.

Three ways to use React Native

The React Native TV fork adds TV support to React Native and targets Apple TV, Android TV, and Fire TV, including focus-management utilities for remote control input. React Native Web can extend shared components to browsers and web-based TV systems such as Tizen and webOS, but needs extra focus handling and platform-specific work. Brownfield approaches use React Native at the JavaScript layer while relying on a separate native system underneath.

Shared code and focus behavior

The guests say a shared React Native codebase can help teams reuse code and release features across platforms on a similar schedule. It can also make focus behavior more consistent across Android TV and tvOS, though their native focus engines still differ. The guests favor declarative focus management tied to component structure, while noting that teams must follow layout guidance for predictable navigation.

Performance and platform-specific work

Many TVs and streaming devices have limited memory and older processors, while video playback and richer screens add resource demands. The team sometimes disables animations on lower-end devices. Supporting multiple systems also takes custom bundler configuration, platform-specific components and flows, and replacements for libraries that do not support every target.

Expo and community support

The host says Expo TV support is in alpha and that its libraries are expected to support TV as well. Guests welcome stronger backing and encourage contributions to the React Native TV project, describing a small community that responds quickly to pull requests.

Takeaways

  • Map target devices and operating systems before choosing a React Native approach; TV platforms do not share a single web runtime.
  • Use the React Native TV fork for Android TV, Fire TV, and tvOS, and plan separate work for web-based TV systems.
  • Treat focus navigation as a core design concern: predictable behavior depends on both platform utilities and structured layouts.
  • Profile on low-end devices during video playback, and be ready to reduce animations or other UI costs.
  • Budget for platform-specific tooling, purchase flows, and library replacements even when most application code is shared.

Mentioned in this talk

Search inside this talk

What was claimed 11

  • role at
    Yao is maintainer at React Native TV OS
    “I’m currently one of the maintainers of the React Native tvOS project.”
    YouTube
    Unverified1 source· Talk
  • works at
    Yao works at Xite
    “I’m an engineer working at Xite.”
    YouTube
    Unverified1 source· Talk
  • previously at
    Carol previously at C-Change
    “Previously, I worked at C-Change.”
    YouTube
    Unverified1 source· Talk
  • works at
    Carol works at Xite
    “I’m working with Yao on the same project.”
    YouTube
    Unverified1 source· Talk
  • feature
    React Native TV OS: Supports Apple TV, Android TV, and Fire TV targets
    “With that repository, you can target Apple TV, Android TV, and Fire TV.”
    YouTube
    Unverified1 source· Talk
  • feature
    React Native TV OS: TV-specific support including focus management for Android TV and tvOS
    “React Native tvOS is simply React Native with a couple of extra TV-specific features, like focus management.”
    YouTube
    Unverified1 source· Talk
  • uses
    “We often use React Native Web to develop web applications.”
    YouTube
    Unverified1 source· Talk
  • feature
    React Native TV OS: Can target web-based TV systems through React Native Web, with platform-specific work required
    “React Native Web can leverage its implementation of focus management, and then we should be good to go with the current components and layout, not only for web but also Tizen and webOS.”
    YouTube
    Unverified1 source· Talk
  • feature
    Expo: TV support was in alpha and already supported TVs
    “Expo will support TVs. I think it's in alpha right now, and it already supports TVs.”
    YouTube
    Unverified1 source· Talk
  • works at
    Doug works at Expo
    “Doug, the creator of the React Native TV library, now works at Expo.”
    YouTube
    Unverified1 source· Talk
  • built
    “Doug, the creator of the React Native TV library”
    YouTube
    Unverified1 source· Talk

Related talks