From 7deadab2ebfc84b19da7e050009bb2a997c7ed08 Mon Sep 17 00:00:00 2001 From: Sathya Gunsasekaran Date: Wed, 7 Aug 2024 16:54:20 +0100 Subject: [PATCH] [compiler] Add context callee import if required Previously the compiler would add an import for the specified context callee even if the context access was not lowered, leading to unused imports. This PR tracks if lowering has happened and adds the import only when necessary. [ghstack-poisoned] --- .../babel-plugin-react-compiler/src/Entrypoint/Program.ts | 5 ++++- .../babel-plugin-react-compiler/src/HIR/Environment.ts | 2 ++ .../src/Optimization/LowerContextAccess.ts | 3 ++- .../src/ReactiveScopes/CodegenReactiveFunction.ts | 6 ++++++ .../todo.lower-context-access-array-destructuring.expect.md | 1 - ...todo.lower-context-access-destructure-multiple.expect.md | 1 - .../todo.lower-context-access-mixed-array-obj.expect.md | 1 - ...todo.lower-context-access-nested-destructuring.expect.md | 1 - .../todo.lower-context-access-property-load.expect.md | 1 - 9 files changed, 14 insertions(+), 7 deletions(-) diff --git a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts index f976b9031f6da..a0adeb4adff17 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts @@ -502,6 +502,9 @@ export function compileProgram( } } + const hasLoweredContextAccess = compiledFns.some( + c => c.compiledFn.hasLoweredContextAccess, + ); const externalFunctions: Array = []; let gating: null | ExternalFunction = null; try { @@ -512,7 +515,7 @@ export function compileProgram( } const lowerContextAccess = pass.opts.environment?.lowerContextAccess; - if (lowerContextAccess) { + if (lowerContextAccess && hasLoweredContextAccess) { externalFunctions.push(tryParseExternalFunction(lowerContextAccess)); } diff --git a/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts b/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts index 4bbd8cb17f89a..6aeae34ad55a0 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/HIR/Environment.ts @@ -552,6 +552,7 @@ export class Environment { config: EnvironmentConfig; fnType: ReactFunctionType; useMemoCacheIdentifier: string; + hasLoweredContextAccess: boolean; #contextIdentifiers: Set; #hoistedIdentifiers: Set; @@ -575,6 +576,7 @@ export class Environment { this.useMemoCacheIdentifier = useMemoCacheIdentifier; this.#shapes = new Map(DEFAULT_SHAPES); this.#globals = new Map(DEFAULT_GLOBALS); + this.hasLoweredContextAccess = false; if ( config.disableMemoizationForDebugging && diff --git a/compiler/packages/babel-plugin-react-compiler/src/Optimization/LowerContextAccess.ts b/compiler/packages/babel-plugin-react-compiler/src/Optimization/LowerContextAccess.ts index efa0c0cdaa231..8455a094f05e7 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/Optimization/LowerContextAccess.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/Optimization/LowerContextAccess.ts @@ -77,7 +77,7 @@ export function lowerContextAccess( } } - if (contextAccess.size > 0) { + if (contextAccess.size > 0 && contextKeys.size > 0) { for (const [, block] of fn.body.blocks) { let nextInstructions: Array | null = null; @@ -120,6 +120,7 @@ export function lowerContextAccess( } markInstructionIds(fn.body); inferTypes(fn); + fn.env.hasLoweredContextAccess = true; } } diff --git a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts index 6fd94dac09bce..978596dc67dfd 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts +++ b/compiler/packages/babel-plugin-react-compiler/src/ReactiveScopes/CodegenReactiveFunction.ts @@ -97,6 +97,11 @@ export type CodegenFunction = { fn: CodegenFunction; type: ReactFunctionType | null; }>; + + /** + * This is true if the compiler has the lowered useContext calls. + */ + hasLoweredContextAccess: boolean; }; export function codegenFunction( @@ -348,6 +353,7 @@ function codegenReactiveFunction( prunedMemoBlocks: countMemoBlockVisitor.prunedMemoBlocks, prunedMemoValues: countMemoBlockVisitor.prunedMemoValues, outlined: [], + hasLoweredContextAccess: fn.env.hasLoweredContextAccess, }); } diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-array-destructuring.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-array-destructuring.expect.md index 7feba7d408cf4..d064a48b7197a 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-array-destructuring.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-array-destructuring.expect.md @@ -13,7 +13,6 @@ function App() { ## Code ```javascript -import { useContext_withSelector } from "react-compiler-runtime"; import { c as _c } from "react/compiler-runtime"; // @lowerContextAccess function App() { const $ = _c(3); diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-destructure-multiple.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-destructure-multiple.expect.md index ac38876bce3f6..f82af06866b76 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-destructure-multiple.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-destructure-multiple.expect.md @@ -15,7 +15,6 @@ function App() { ## Code ```javascript -import { useContext_withSelector } from "react-compiler-runtime"; import { c as _c } from "react/compiler-runtime"; // @lowerContextAccess function App() { const $ = _c(3); diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-mixed-array-obj.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-mixed-array-obj.expect.md index d808a5e3f04cd..573b6db231c1e 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-mixed-array-obj.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-mixed-array-obj.expect.md @@ -15,7 +15,6 @@ function App() { ## Code ```javascript -import { useContext_withSelector } from "react-compiler-runtime"; import { c as _c } from "react/compiler-runtime"; // @lowerContextAccess function App() { const $ = _c(3); diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-nested-destructuring.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-nested-destructuring.expect.md index 2e5b517ef23b1..03ce7f97ba357 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-nested-destructuring.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-nested-destructuring.expect.md @@ -16,7 +16,6 @@ function App() { ## Code ```javascript -import { useContext_withSelector } from "react-compiler-runtime"; import { c as _c } from "react/compiler-runtime"; // @lowerContextAccess function App() { const $ = _c(3); diff --git a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-property-load.expect.md b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-property-load.expect.md index 482ed458237e5..55387503cf744 100644 --- a/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-property-load.expect.md +++ b/compiler/packages/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/todo.lower-context-access-property-load.expect.md @@ -15,7 +15,6 @@ function App() { ## Code ```javascript -import { useContext_withSelector } from "react-compiler-runtime"; import { c as _c } from "react/compiler-runtime"; // @lowerContextAccess function App() { const $ = _c(3);