Merge pull request #3279 from GetStream/perf/react-compiler

feat: enable react compiler in the Sample and Expo app

Author: khushal87

examples/ExpoMessaging/app.json

@@ -15,6 +15,9 @@
     "updates": {
       "fallbackToCacheTimeout": 0
     },
+    "experiments": {
+      "reactCompiler": true
+    },
     "assetBundlePatterns": ["**/*"],
     "ios": {
       "supportsTablet": true,

examples/ExpoMessaging/package.json

@@ -18,26 +18,26 @@
     "@react-native-firebase/messaging": "^23.4.0",
     "@react-navigation/elements": "^2.6.4",
     "@react-navigation/native": "^7.1.8",
-    "@shopify/flash-list": "^2.1.0",
-    "expo": "54.0.13",
-    "expo-audio": "~1.0.13",
+    "@shopify/flash-list": "2.0.2",
+    "expo": "54.0.22",
+    "expo-audio": "~1.0.14",
     "expo-build-properties": "~1.0.9",
     "expo-clipboard": "~8.0.7",
-    "expo-constants": "~18.0.9",
+    "expo-constants": "~18.0.10",
     "expo-document-picker": "~14.0.7",
     "expo-file-system": "~19.0.17",
     "expo-haptics": "~15.0.7",
     "expo-image-manipulator": "~14.0.7",
     "expo-image-picker": "~17.0.8",
     "expo-linking": "~8.0.8",
     "expo-location": "~19.0.7",
-    "expo-router": "~6.0.12",
+    "expo-router": "~6.0.14",
     "expo-sharing": "~14.0.7",
     "expo-splash-screen": "~31.0.10",
     "expo-status-bar": "~3.0.8",
-    "expo-video": "~3.0.11",
+    "expo-video": "~3.0.14",
     "react": "19.1.0",
-    "react-native": "0.81.4",
+    "react-native": "0.81.5",
     "react-native-gesture-handler": "~2.28.0",
     "react-native-maps": "1.20.1",
     "react-native-reanimated": "~4.1.1",

examples/ExpoMessaging/yarn.lock

@@ -1,4 +1,4 @@
 module.exports = {
   presets: ['module:@react-native/babel-preset'],
-  plugins: ['react-native-worklets/plugin'],
+  plugins: ['babel-plugin-react-compiler', 'react-native-worklets/plugin'],
 };

examples/SampleApp/babel.config.js

@@ -75,6 +75,7 @@
     "@types/lodash.mergewith": "^4.6.9",
     "@types/react": "^19.1.0",
     "@types/react-test-renderer": "^19.1.0",
+    "babel-plugin-react-compiler": "^1.0.0",
     "eslint": "^9.28.0",
     "eslint-plugin-eslint-comments": "^3.2.0",
     "eslint-plugin-jest": "^28.13.3",

examples/SampleApp/package.json

@@ -355,6 +355,11 @@
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.27.1.tgz#a7054dcc145a967dd4dc8fee845a57c1316c9df8"
   integrity sha512-D2hP9eA+Sqx1kBZgzxZh0y1trbuU+JoDkiEwqhQ36nodYqJwyEIhPSdMNd7lOm/4io72luTPWH20Yda0xOuUow==
 
+"@babel/helper-validator-identifier@^7.28.5":
+  version "7.28.5"
+  resolved "https://registry.yarnpkg.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.28.5.tgz#010b6938fab7cb7df74aa2bbc06aa503b8fe5fb4"
+  integrity sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q==
+
 "@babel/helper-validator-option@^7.25.9":
   version "7.25.9"
   resolved "https://registry.yarnpkg.com/@babel/helper-validator-option/-/helper-validator-option-7.25.9.tgz#86e45bd8a49ab7e03f276577f96179653d41da72"
@@ -1033,6 +1038,14 @@
     "@babel/helper-string-parser" "^7.25.9"
     "@babel/helper-validator-identifier" "^7.25.9"
 
+"@babel/types@^7.26.0":
+  version "7.28.5"
+  resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.28.5.tgz#10fc405f60897c35f07e85493c932c7b5ca0592b"
+  integrity sha512-qQ5m48eI/MFLQ5PxQj4PFaprjyCTLI37ElWMmNs0K8Lk3dVeOdNpB3ks8jc7yM5CDmVC73eMVk/trk3fgmrUpA==
+  dependencies:
+    "@babel/helper-string-parser" "^7.27.1"
+    "@babel/helper-validator-identifier" "^7.28.5"
+
 "@babel/types@^7.27.1", "@babel/types@^7.27.3", "@babel/types@^7.27.6":
   version "7.27.6"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.27.6.tgz#a434ca7add514d4e646c80f7375c0aa2befc5535"
@@ -3662,6 +3675,13 @@ babel-plugin-polyfill-regenerator@^0.6.1:
   dependencies:
     "@babel/helper-define-polyfill-provider" "^0.6.3"
 
+babel-plugin-react-compiler@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-react-compiler/-/babel-plugin-react-compiler-1.0.0.tgz#bdf7360a23a4d5ebfca090255da3893efd07425f"
+  integrity sha512-Ixm8tFfoKKIPYdCCKYTsqv+Fd4IJ0DQqMyEimo+pxUOMUR9cVPlwTrFt9Avu+3cb6Zp3mAzl+t1MrG2fxxKsxw==
+  dependencies:
+    "@babel/types" "^7.26.0"
+
 babel-plugin-syntax-hermes-parser@0.28.1:
   version "0.28.1"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-hermes-parser/-/babel-plugin-syntax-hermes-parser-0.28.1.tgz#9e80a774ddb8038307a62316486669c668fb3568"

examples/SampleApp/yarn.lock

@@ -126,7 +126,7 @@ export const PollAnswerListItem = ({ answer }: { answer: PollAnswer }) => {
   );
 };
 
-const PollAnswerListItemComponent = ({ item }: { item: PollAnswer }) => (
+const renderPollAnswerListItem = ({ item }: { item: PollAnswer }) => (
   <PollAnswerListItem answer={item} />
 );
 
@@ -149,7 +149,7 @@ export const PollAnswersListContent = ({
         data={pollAnswers}
         keyExtractor={(item) => `poll_answer_${item.id}`}
         onEndReached={() => hasNextPage && loadMore()}
-        renderItem={PollAnswerListItemComponent}
+        renderItem={renderPollAnswerListItem}
         {...additionalFlatListProps}
       />
       <AnswerListAddCommentButton />

package/src/components/Poll/components/PollAnswersList.tsx

@@ -21,7 +21,7 @@ export type PollOptionFullResultsProps = PollContextValue & {
   PollOptionFullResultsContent?: React.ComponentType<{ option: PollOption }>;
 };
 
-export const PollOptionFullResultsItem = ({ item }: { item: PollVoteClass }) => (
+export const renderPollOptionFullResultsItem = ({ item }: { item: PollVoteClass }) => (
   <PollVote vote={item} />
 );
 
@@ -65,7 +65,7 @@ export const PollOptionFullResultsContent = ({
         keyExtractor={(item) => `option_full_results_${item.id}`}
         ListHeaderComponent={PollOptionFullResultsHeader}
         onEndReached={() => hasNextPage && loadMore()}
-        renderItem={PollOptionFullResultsItem}
+        renderItem={renderPollOptionFullResultsItem}
         {...additionalFlatListProps}
       />
     </View>