Upgrading with Hermes Support and Automated Tests

Steven Moyes

We wrapped up Milestone 3 a month ago which included upgrade to support React Native version 0.60, Native extensions developer story, integration with the new high performance JS engine- Hermes, E2E test infrastructure and a host of added API support. Some detailed highlights from the past few months are shared below.

You can get some of the latest on what’s new with React Native for Windows from the breakout session and Channel9 interview from IGNITE 2019.

Upgrade to version 0.60

Keeping up with React Native versioning, we completed the upgrade for react-native-windows vNext from 0.59 to 0.60. You can now develop for RN 0.60 and target Windows.

react-native init <project name> --version 0.60.6

See Getting Started Guide for vNext for more details.

Support for Hermes

Hermes is a new JavaScript engine introduced by Facebook optimized for fast startup of React Native apps. We are happy to share that React Native for Windows vnext also supports Hermes as a build option with v0.60 and initial tests with a handful of Microsoft apps have shown high performance gains in both memory and startup time (boot latency reduced ~100-400ms) using the same.

You can turn on Hermes for your apps by setting the msbuild property USE_HERMES in vnext\PropertySheets\React.Cpp.Props to true.

E2E automated tests and infrastructure

We bootstrapped E2E test infrastructure using Appium (WinAppDriver) and we now have several automated E2E tests running as part of the code-commit pipeline for more reliability. Go here to learn more.

Native extensions developer story

You can now begin authoring and consuming standalone Native Modules and custom View Managers through React Native for Windows vNext. We have enabled the infrastructure to extend and add support to external packages and community modules similar to what you can do today for accessing iOS/Android APIs. Check out our docs on these topics :

While working on this, we have identified several performance and developer experience improvements to instance creation and management. These updates will start to trickle in the upcoming Milestone 4. We are simultaneously sharing these proposals with Facebook to ensure react-native for iOS, Android and Mac can also benefit from these improvements.

With the infrastructure now in place, we have begun bootstrapping a handful of community module repos with support for React Native for Windows vNext. As we make progress, we intend to formalize the developer experience, tooling, tests more and publish guidance around the same. You can keep track of our backlog through the Community Modules Project.

APIs and new feature updates

Core components and modules are almost fully supported, see updates to Parity Status for details. Completed APIs includes Switch, Text, FlatList, TextInput (excluding few props that need underlying platform work) components as well as Keyboard, Alert modules and more. We are making steady progress on others like Accessibility, Image, Animations (useNativeDriver), View border properties etc.,

In addition to supporting the newly added APIs for Accessibility in React Native v0.60, we have also introduced a couple of new APIs for better accessibility in lists, taking some of the best practices from Windows and giving back to the React Native community.  You can read more about the proposal here, this has been implemented in react-native-windows.

You can now access signature Windows themes and Fluent Design visuals like Acrylic and Reveal from React Native for Windows – Read Windows Brushes and Themes for more details. In addition, we have improved several built in keyboard focus behaviors and added a few APIs in this area as well.

Coming up next

You can take a peek at the upcoming Milestones with a backlog lining up through Summer 2020. The immediate next Milestone we are working on is due by January 2020 with these high priority objectives:

  • Upgrade to RN v 0.61
  • React Native for Windows vnext becomes mainline and fully replaces React Native for Windows current as the default. Work left to accomplish this includes 90% complete API parity on lean-core APIs (pending updates needed in underlying native platform), completion of Native extensions host instantiation APIs and developer experiences and other known breaking changes.
  • Add support to key community modules like Camera, Video, Lottie and few others that have been requested by customers.
  • Setup infrastructure for consuming WinUI 2.2 nuget package for wrapping high value components/modules and setup for future WinUI dependencies
  • Begin support for dual screen scenarios