From c8cbf7f8139bb3f7cb0d312801f771aaedd2a72c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Rub=C3=A9n=20Norte?= Date: Fri, 11 Apr 2025 07:52:26 -0700 Subject: [PATCH] Improve documentation for feature flags (#50644) Summary: Pull Request resolved: https://github.com/facebook/react-native/pull/50644 Changelog: [internal] This improves the documentation for the feature flag system by extending information about 2 areas: - Codegen - `print` command in CLI Reviewed By: lenaic Differential Revision: D72852768 fbshipit-source-id: 97932ea078595ef54cd437a433072f83bbdff609 --- .../private/featureflags/__docs__/README.md | 52 +++++++++++++++++++ 1 file changed, 52 insertions(+) diff --git a/packages/react-native/src/private/featureflags/__docs__/README.md b/packages/react-native/src/private/featureflags/__docs__/README.md index e3b939269ad..48646ade465 100644 --- a/packages/react-native/src/private/featureflags/__docs__/README.md +++ b/packages/react-native/src/private/featureflags/__docs__/README.md @@ -145,6 +145,49 @@ ReactNativeFeatureFlags.override({ }); ``` +### Reviewing feature flags + +You can find the list of feature flags with their configuration in +[`ReactNativeFeatureFlags.config.js`](../../../../scripts/featureflags/ReactNativeFeatureFlags.config.js), +but you can also use the CLI to list them: + +```shell +yarn featureflags --print +``` + +Which would print something like: + +```text +┌────────────────────────────────────────────────────────────┬───────────────────────────────────────────────────────────────────────────────────────────────────────────┬─────────┬──────────────┐ +│ (index) │ Description │ Purpose │ Date added │ +├────────────────────────────────────────────────────────────┼───────────────────────────────────────────────────────────────────────────────────────────────────────────┼─────────┼──────────────┤ +│ enableFabricLogs │ 'This feature flag enables logs for Fabric.' │ '🔨' │ undefined │ +│ jsOnlyTestFlag │ 'JS-only flag for testing. Do NOT modify.' │ '🔨' │ undefined │ +│ enableAccessToHostTreeInFabric │ 'Enables access to the host tree in Fabric using DOM-compatible APIs.' │ '🚀' │ undefined │ +│ enableBridgelessArchitecture │ 'Feature flag to enable the new bridgeless architecture. Note: Enabling this will force enable the fo...' │ '🚀' │ undefined │ +│ useTurboModules │ 'When enabled, NativeModules will be executed by using the TurboModule system' │ '🚀' │ undefined │ +│ animatedShouldDebounceQueueFlush │ 'Enables an experimental flush-queue debouncing in Animated.js.' │ '🧪' │ '2024-02-05' │ +│ useTurboModuleInterop │ 'In Bridgeless mode, should legacy NativeModules use the TurboModule system?' │ '🧪' │ '2024-07-28' │ +└────────────────────────────────────────────────────────────┴───────────────────────────────────────────────────────────────────────────────────────────────────────────┴─────────┴──────────────┘ +Summary +┌─────────────────┬────────┐ +│ (index) │ Values │ +├─────────────────┼────────┤ +│ Total │ 55 │ +│ Common │ 43 │ +│ JS Only │ 12 │ +│ Operational │ 5 │ +│ Release │ 16 │ +│ Experimentation │ 34 │ +└─────────────────┴────────┘ +``` + +If you need to consume this as structured data, you can print it as JSON using: + +```shell +yarn featureflags --print --json +``` + ## Design The architecture of this feature flags system can be described as follows: @@ -158,6 +201,15 @@ The architecture of this feature flags system can be described as follows: ![Diagram of the architecture of feature flags in React Native](./architecture.excalidraw.svg) +Most of the code for this system is automatically generated from +[`ReactNativeFeatureFlags.config.js`](../../../../scripts/featureflags/ReactNativeFeatureFlags.config.js). +The entrypoint for the codegen can be found +[here](../../../../scripts/featureflags/index.js). + +The codegen uses a simple templating system based on JavaScript template strings +to generate the files (see files ending with `-template.js` in the +[`templates`](../../../../scripts/featureflags/templates/) directory), + ## Relationship with other systems ### Part of this