Kadi Kraman says performance challenges include platform constraints, development speed, and how developers use tools such as useMemo and useCallback. Maciej Jastrzębski and Łukasz Łudziński caution that adding memoization everywhere may not help and can add unnecessary work. The Callstack team describes measuring metrics such as frame rate or screen loading time, then temporarily removing a component to estimate its maximum impact before choosing what to optimize.
What’s up in React Native Performance in 2024
Speakers
Łukasz Łudziński hosts Expo’s Kadi Kraman and Callstack’s Maciej Jastrzębski to discuss React Native performance on Callstack’s React Native Show podcast.
The 2024 Ultimate Guide to React Native Optimization describes a DMAIC process: define the issue, measure it, analyze likely causes, implement a fix, and control the result over time. The yearly guide updates recommendations as libraries and tools change, and gathers material that is otherwise scattered across articles. Kraman contributed material on Expo Application Services and DevTools plugins.
Kraman says Expo Image supports both React Native and web, works with the new architecture, and serves as a reusable primitive in Expo libraries such as Camera. She notes that it does not match every FastImage feature, including header-based caching. Jastrzębski highlights FlashList as an alternative to FlatList and VisionCamera as examples of community libraries built with performance in mind.
The guests say major production apps use React Native, and that shared skills and code can reduce the time and cost of supporting iOS, Android, and web. React Native still uses platform-specific native components and allows teams to add native code when needed. Kraman also recommends using platform features so apps feel appropriate on each system.
Jastrzębski is looking forward to Static Hermes, which could speed up selected JavaScript functions through static compilation. Kraman points to Metro improvements in startup, build speed, and bundle splitting, as well as its potential for native and web apps. She says Expo uses Expo Router on the web for its blog to test and improve the tooling.
Takeaways
- Measure a specific metric before and after each performance change.
- Estimate a component’s maximum possible impact before spending time optimizing it.
- Use memoization when there is a clear reason, rather than adding it everywhere.
- Compare library capabilities with your actual needs; Expo Image and FastImage do not have identical features.
- Include developer speed and maintenance effort when evaluating app architecture.
Mentioned in this talk
Search inside this talk
What was claimed 11
- built
“We've recently released the 2024 edition of the Ultimate Guide to React Native Optimization.”
YouTube Verified2 sources· Talk
- works atKadi Kraman works at Expo
“my guest is Kadi Kraman from Expo”
YouTube Unverified1 source· Talk
- works atŁukasz Łudziński works at
Callstack“My colleague and I at Callstack are working on a performance optimization project”
YouTube Unverified1 source· Talk
- featureDMAIC: Defines, measures, analyzes, implements, and controls performance improvements
“we have to define exactly what we want to fix. Then we measure it ... Then we analyze ... Then we implement it.”
YouTube Unverified1 source· Talk
- featureExpo Modules: CI/CD service for building React Native and native apps
“EAS, or Expo Application Services, which is CI/CD designed for building React Native apps.”
YouTube Unverified1 source· Talk
- featureExpo DevTools plugins: Lets developers create plugins to debug apps
“DevTools plugins is another Expo feature that lets you create Chrome plugins more easily to debug apps”
YouTube Unverified1 source· Talk
- featureExpo Image: Supports React Native and web and is built for the new architecture
“Expo Image works with React Native and on the web, and it's built in. We also built it to support the new architecture out of the box”
YouTube Unverified1 source· Talk
- featureFlashList: Provides a more performant list alternative with an API nearly identical to FlatList
“there's FlashList, with an API nearly identical to FlatList”
YouTube Unverified1 source· Talk





