From 8d764fac224239ef255d1622dab02a9443c362de Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Sat, 14 Sep 2024 11:16:11 +0200
Subject: [PATCH 1/5] cond react transform

---
 .../src/transforms/optimize_server_react.rs   | 56 +++++++++++++++++--
 .../fixture/optimize_server_react/1/output.js | 17 +++++-
 .../fixture/optimize_server_react/2/output.js | 22 +++++++-
 .../fixture/optimize_server_react/4/output.js |  9 ++-
 .../fixture/optimize_server_react/6/output.js |  2 +-
 .../fixture/optimize_server_react/7/output.js | 13 ++++-
 packages/next/src/server/config-shared.ts     |  2 +-
 7 files changed, 105 insertions(+), 16 deletions(-)

diff --git a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
index 43c778e89626a..2e0df3aaa7784 100644
--- a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
+++ b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
@@ -60,6 +60,48 @@ fn effect_has_side_effect_deps(call: &CallExpr) -> bool {
     false
 }
 
+fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
+    // Wrap the `<call>` with `if (process.env.NODE_ENV !== 'production') { <call }`
+    let condition = Expr::Bin(BinExpr {
+        span: DUMMY_SP,
+        left: Box::new(Expr::Member(MemberExpr {
+            obj: (Box::new(Expr::Member(MemberExpr {
+                obj: (Box::new(Expr::Ident(Ident {
+                    sym: "process".into(),
+                    span: DUMMY_SP,
+                    ..Default::default()
+                }))),
+
+                prop: MemberProp::Ident(IdentName {
+                    sym: "env".into(),
+                    span: DUMMY_SP,
+                }),
+                span: DUMMY_SP,
+            }))),
+            prop: (MemberProp::Ident(IdentName {
+                sym: "NODE_ENV".into(),
+                span: DUMMY_SP,
+                ..Default::default()
+            })),
+            span: DUMMY_SP,
+        })),
+        op: op!("!=="),
+        right: Box::new(Expr::Lit(Lit::Str(Str {
+            span: DUMMY_SP,
+            value: "production".into(),
+            raw: None,
+        }))),
+    });
+
+    // Wrap the call expression with the condition
+    return Expr::Cond(CondExpr {
+        span: DUMMY_SP,
+        test: Box::new(condition),
+        cons: Box::new(Expr::Call(call.clone())),
+        alt: Box::new(Expr::Lit(Lit::Null(Null { span: DUMMY_SP }))),
+    });
+}
+
 impl Fold for OptimizeServerReact {
     fn fold_module_items(&mut self, items: Vec<ModuleItem>) -> Vec<ModuleItem> {
         let mut new_items = vec![];
@@ -101,16 +143,17 @@ impl Fold for OptimizeServerReact {
     fn fold_expr(&mut self, expr: Expr) -> Expr {
         if let Expr::Call(call) = &expr {
             if let Callee::Expr(box Expr::Ident(f)) = &call.callee {
-                // Remove `useEffect` call
+                // Mark `useEffect` as DCE'able
                 if let Some(use_effect_ident) = &self.use_effect_ident {
                     if &f.to_id() == use_effect_ident && !effect_has_side_effect_deps(call) {
-                        return Expr::Lit(Lit::Null(Null { span: DUMMY_SP }));
+                        // return Expr::Lit(Lit::Null(Null { span: DUMMY_SP }));
+                        return wrap_expr_with_env_prod_condition(call.clone());
                     }
                 }
-                // Remove `useLayoutEffect` call
+                // Mark `useLayoutEffect` as DCE'able
                 if let Some(use_layout_effect_ident) = &self.use_layout_effect_ident {
                     if &f.to_id() == use_layout_effect_ident && !effect_has_side_effect_deps(call) {
-                        return Expr::Lit(Lit::Null(Null { span: DUMMY_SP }));
+                        return wrap_expr_with_env_prod_condition(call.clone());
                     }
                 }
             } else if let Some(react_ident) = &self.react_ident {
@@ -118,9 +161,10 @@ impl Fold for OptimizeServerReact {
                     if let box Expr::Ident(f) = &member.obj {
                         if &f.to_id() == react_ident {
                             if let MemberProp::Ident(i) = &member.prop {
-                                // Remove `React.useEffect` and `React.useLayoutEffect` calls
+                                // Mark `React.useEffect` and `React.useLayoutEffect` as DCE'able
+                                // calls in production
                                 if i.sym == "useEffect" || i.sym == "useLayoutEffect" {
-                                    return Expr::Lit(Lit::Null(Null { span: DUMMY_SP }));
+                                    return wrap_expr_with_env_prod_condition(call.clone());
                                 }
                             }
                         }
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
index 3774f05f643a1..c3c8db4773b43 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
@@ -1,8 +1,17 @@
 import { useEffect, useLayoutEffect, useMemo } from 'react';
 import React from 'react';
 export default function App() {
-    null;
-    null;
+    process.env.NODE_ENV !== "production" ? useEffect(()=>{
+        console.log('Hello World');
+    }, []) : null;
+    process.env.NODE_ENV !== "production" ? useLayoutEffect(()=>{
+        function foo() {}
+        return ()=>{};
+    }, [
+        1,
+        2,
+        App
+    ]) : null;
     useLayoutEffect(()=>{}, [
         runSideEffect()
     ]);
@@ -15,7 +24,9 @@ export default function App() {
     const a = useMemo(()=>{
         return 1;
     }, []);
-    null;
+    process.env.NODE_ENV !== "production" ? React.useEffect(()=>{
+        console.log('Hello World');
+    }) : null;
     return <div>
       <h1>Hello World</h1>
     </div>;
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
index 7168bec29c03e..aac9c80767bd1 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
@@ -16,8 +16,26 @@ export default function FilterItemDropdown({ list }) {
         ()=>null
     ];
     const ref = useRef(null);
-    null;
-    null;
+    process.env.NODE_ENV !== "production" ? useEffect(()=>{
+        const handleClickOutside = (event)=>{
+            if (ref.current && !ref.current.contains(event.target)) {
+                setOpenSelect(false);
+            }
+        };
+        window.addEventListener('click', handleClickOutside);
+        return ()=>window.removeEventListener('click', handleClickOutside);
+    }, []) : null;
+    process.env.NODE_ENV !== "production" ? useEffect(()=>{
+        list.forEach((listItem)=>{
+            if ('path' in listItem && pathname === listItem.path || 'slug' in listItem && searchParams.get('sort') === listItem.slug) {
+                setActive(listItem.title);
+            }
+        });
+    }, [
+        pathname,
+        list,
+        searchParams
+    ]) : null;
     return <div className="relative" ref={ref}>
       <div onClick={()=>{
         setOpenSelect(!openSelect);
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
index ff5560e63f3e2..b359abf0401e3 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
@@ -5,7 +5,14 @@ export default function App() {
     useEffect(()=>{
         console.log('Hello World');
     }, []);
-    null;
+    process.env.NODE_ENV !== "production" ? useLayoutEffect(()=>{
+        function foo() {}
+        return ()=>{};
+    }, [
+        1,
+        2,
+        App
+    ]) : null;
     const a = useMemo(()=>{
         return 1;
     }, []);
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
index d9a42787a5722..532bdf0b1dc7b 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
@@ -5,7 +5,7 @@ const Component = ({ children, fallback })=>{
         false,
         ()=>null
     ];
-    null;
+    process.env.NODE_ENV !== "production" ? useEffect(()=>setMounted(true), []) : null;
     if (!mounted) {
         return fallback ?? /* @__PURE__ */ jsx(Fragment, {});
     }
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
index d53bae0a0cded..66e5c8a8b4578 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
@@ -1,8 +1,17 @@
 import { useEffect, useLayoutEffect, useMemo } from 'react';
 import * as React from 'react';
 export default function App() {
-    null;
-    null;
+    process.env.NODE_ENV !== "production" ? useEffect(()=>{
+        console.log('Hello World');
+    }, []) : null;
+    process.env.NODE_ENV !== "production" ? useLayoutEffect(()=>{
+        function foo() {}
+        return ()=>{};
+    }, [
+        1,
+        2,
+        App
+    ]) : null;
     useLayoutEffect(()=>{}, [
         runSideEffect()
     ]);
diff --git a/packages/next/src/server/config-shared.ts b/packages/next/src/server/config-shared.ts
index 279fadcd633e5..e24637c181fa5 100644
--- a/packages/next/src/server/config-shared.ts
+++ b/packages/next/src/server/config-shared.ts
@@ -1072,7 +1072,7 @@ export const defaultConfig: NextConfig = {
       ),
     webpackBuildWorker: undefined,
     webpackMemoryOptimizations: false,
-    optimizeServerReact: false,
+    optimizeServerReact: true,
     useEarlyImport: false,
     staleTimes: {
       dynamic: 0,

From 592c5b07cf97655a61ed36f889cea1c35bd1a3d7 Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Sat, 14 Sep 2024 23:27:00 +0200
Subject: [PATCH 2/5] leverage minify global_defs

---
 crates/napi/src/minify.rs                     |  7 +++++
 .../src/transforms/optimize_server_react.rs   | 26 +++++++------------
 packages/next/src/build/swc/options.ts        |  2 +-
 .../minify-webpack-plugin/src/index.ts        |  6 ++++-
 .../use-effect-actions/app/mixed/page.tsx     |  8 +++---
 5 files changed, 25 insertions(+), 24 deletions(-)

diff --git a/crates/napi/src/minify.rs b/crates/napi/src/minify.rs
index 64ab767bda512..f5cde00c07467 100644
--- a/crates/napi/src/minify.rs
+++ b/crates/napi/src/minify.rs
@@ -110,6 +110,13 @@ impl Task for MinifyTask {
 fn patch_opts(opts: &mut JsMinifyOptions) {
     opts.compress = BoolOrDataConfig::from_obj(TerserCompressorOptions {
         inline: Some(TerserInlineOption::Num(2)),
+        global_defs: [(
+            "process.env.__NEXT_OPTIMIZE_DEC_FALSE".into(),
+            "production".into(),
+        )]
+        .iter()
+        .cloned()
+        .collect(),
         ..Default::default()
     });
     opts.mangle = BoolOrDataConfig::from_obj(MangleOptions {
diff --git a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
index 2e0df3aaa7784..28cde6e164ede 100644
--- a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
+++ b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
@@ -61,8 +61,12 @@ fn effect_has_side_effect_deps(call: &CallExpr) -> bool {
 }
 
 fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
-    // Wrap the `<call>` with `if (process.env.NODE_ENV !== 'production') { <call }`
-    let condition = Expr::Bin(BinExpr {
+    // Wrap the call expression with the condition
+    // turn it into `process.env.__NEXT_OPTIMIZE_DEC_FALSE` && <call>.
+    // And `process.env.__NEXT_OPTIMIZE_DEC_FALSE`` will be treated as `false` in minification.
+    // In this way the expression and dependencies are still available in compilation during
+    // bundling, but will be removed in the final DEC.
+    return Expr::Bin(BinExpr {
         span: DUMMY_SP,
         left: Box::new(Expr::Member(MemberExpr {
             obj: (Box::new(Expr::Member(MemberExpr {
@@ -79,26 +83,14 @@ fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
                 span: DUMMY_SP,
             }))),
             prop: (MemberProp::Ident(IdentName {
-                sym: "NODE_ENV".into(),
+                sym: "__NEXT_OPTIMIZE_DEC_FALSE".into(),
                 span: DUMMY_SP,
                 ..Default::default()
             })),
             span: DUMMY_SP,
         })),
-        op: op!("!=="),
-        right: Box::new(Expr::Lit(Lit::Str(Str {
-            span: DUMMY_SP,
-            value: "production".into(),
-            raw: None,
-        }))),
-    });
-
-    // Wrap the call expression with the condition
-    return Expr::Cond(CondExpr {
-        span: DUMMY_SP,
-        test: Box::new(condition),
-        cons: Box::new(Expr::Call(call.clone())),
-        alt: Box::new(Expr::Lit(Lit::Null(Null { span: DUMMY_SP }))),
+        op: op!("&&"),
+        right: Box::new(Expr::Call(call)),
     });
 }
 
diff --git a/packages/next/src/build/swc/options.ts b/packages/next/src/build/swc/options.ts
index 0cd2efba8c44e..ef11483abf7d6 100644
--- a/packages/next/src/build/swc/options.ts
+++ b/packages/next/src/build/swc/options.ts
@@ -400,7 +400,7 @@ export function getLoaderSWCOptions({
     },
   }
 
-  if (optimizeServerReact && isServer && !development) {
+  if (optimizeServerReact && isServer /* && !development*/) {
     baseOptions.optimizeServerReact = {
       optimize_use_state: false,
     }
diff --git a/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts b/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
index 0973145ba271b..064443d84e3ab 100644
--- a/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
+++ b/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
@@ -109,7 +109,11 @@ export class MinifyPlugin {
                       },
                     }
                   : {}),
-                compress: true,
+                compress: {
+                  global_defs: {
+                    'process.env.__NEXT_OPTIMIZE_DEC_FALSE': false,
+                  },
+                },
                 mangle: true,
                 module: 'unknown',
                 output: {
diff --git a/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx b/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
index e0656de1b90ac..c7aa8daff83cd 100644
--- a/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
+++ b/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
@@ -12,11 +12,9 @@ export default function Page() {
 
   // calling action1 fails!!
   useEffect(() => {
-    if (globalThis.DO_NOT_TREE_SHAKE) {
-      action1().then((obj) => {
-        console.log('action1 returned:', obj)
-      })
-    }
+    action1().then((obj) => {
+      console.log('action1 returned:', obj)
+    })
   }, [])
 
   return <MyComponent />

From 6eefb7a65bcd9e31d4b55413210dfd7571bd301e Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Sat, 14 Sep 2024 23:57:31 +0200
Subject: [PATCH 3/5] rename env var, update test

---
 crates/napi/src/minify.rs                            |  2 +-
 .../src/transforms/optimize_server_react.rs          | 11 +++++------
 .../tests/fixture/optimize_server_react/1/output.js  | 12 ++++++------
 .../tests/fixture/optimize_server_react/2/output.js  |  8 ++++----
 .../tests/fixture/optimize_server_react/4/output.js  |  4 ++--
 .../tests/fixture/optimize_server_react/6/output.js  |  2 +-
 .../tests/fixture/optimize_server_react/7/output.js  |  8 ++++----
 packages/next/src/build/swc/options.ts               |  2 +-
 .../plugins/minify-webpack-plugin/src/index.ts       |  2 +-
 .../use-effect-actions/app/mixed/page.tsx            |  8 +++++---
 10 files changed, 30 insertions(+), 29 deletions(-)

diff --git a/crates/napi/src/minify.rs b/crates/napi/src/minify.rs
index f5cde00c07467..0020364d503e5 100644
--- a/crates/napi/src/minify.rs
+++ b/crates/napi/src/minify.rs
@@ -111,7 +111,7 @@ fn patch_opts(opts: &mut JsMinifyOptions) {
     opts.compress = BoolOrDataConfig::from_obj(TerserCompressorOptions {
         inline: Some(TerserInlineOption::Num(2)),
         global_defs: [(
-            "process.env.__NEXT_OPTIMIZE_DEC_FALSE".into(),
+            "process.env.__NEXT_OPTIMIZE_FALSE".into(),
             "production".into(),
         )]
         .iter()
diff --git a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
index 28cde6e164ede..470628819a613 100644
--- a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
+++ b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
@@ -62,11 +62,11 @@ fn effect_has_side_effect_deps(call: &CallExpr) -> bool {
 
 fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
     // Wrap the call expression with the condition
-    // turn it into `process.env.__NEXT_OPTIMIZE_DEC_FALSE` && <call>.
-    // And `process.env.__NEXT_OPTIMIZE_DEC_FALSE`` will be treated as `false` in minification.
+    // turn it into `process.env.__NEXT_OPTIMIZE_FALSE` && <call>.
+    // And `process.env.__NEXT_OPTIMIZE_FALSE`` will be treated as `false` in minification.
     // In this way the expression and dependencies are still available in compilation during
     // bundling, but will be removed in the final DEC.
-    return Expr::Bin(BinExpr {
+    Expr::Bin(BinExpr {
         span: DUMMY_SP,
         left: Box::new(Expr::Member(MemberExpr {
             obj: (Box::new(Expr::Member(MemberExpr {
@@ -83,15 +83,14 @@ fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
                 span: DUMMY_SP,
             }))),
             prop: (MemberProp::Ident(IdentName {
-                sym: "__NEXT_OPTIMIZE_DEC_FALSE".into(),
+                sym: "__NEXT_OPTIMIZE_FALSE".into(),
                 span: DUMMY_SP,
-                ..Default::default()
             })),
             span: DUMMY_SP,
         })),
         op: op!("&&"),
         right: Box::new(Expr::Call(call)),
-    });
+    })
 }
 
 impl Fold for OptimizeServerReact {
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
index c3c8db4773b43..8b756cccbb29f 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
@@ -1,17 +1,17 @@
 import { useEffect, useLayoutEffect, useMemo } from 'react';
 import React from 'react';
 export default function App() {
-    process.env.NODE_ENV !== "production" ? useEffect(()=>{
+    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>{
         console.log('Hello World');
-    }, []) : null;
-    process.env.NODE_ENV !== "production" ? useLayoutEffect(()=>{
+    }, []);
+    process.env.__NEXT_OPTIMIZE_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [
         1,
         2,
         App
-    ]) : null;
+    ]);
     useLayoutEffect(()=>{}, [
         runSideEffect()
     ]);
@@ -24,9 +24,9 @@ export default function App() {
     const a = useMemo(()=>{
         return 1;
     }, []);
-    process.env.NODE_ENV !== "production" ? React.useEffect(()=>{
+    process.env.__NEXT_OPTIMIZE_FALSE && React.useEffect(()=>{
         console.log('Hello World');
-    }) : null;
+    });
     return <div>
       <h1>Hello World</h1>
     </div>;
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
index aac9c80767bd1..ec1899cb9fefd 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
@@ -16,7 +16,7 @@ export default function FilterItemDropdown({ list }) {
         ()=>null
     ];
     const ref = useRef(null);
-    process.env.NODE_ENV !== "production" ? useEffect(()=>{
+    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>{
         const handleClickOutside = (event)=>{
             if (ref.current && !ref.current.contains(event.target)) {
                 setOpenSelect(false);
@@ -24,8 +24,8 @@ export default function FilterItemDropdown({ list }) {
         };
         window.addEventListener('click', handleClickOutside);
         return ()=>window.removeEventListener('click', handleClickOutside);
-    }, []) : null;
-    process.env.NODE_ENV !== "production" ? useEffect(()=>{
+    }, []);
+    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>{
         list.forEach((listItem)=>{
             if ('path' in listItem && pathname === listItem.path || 'slug' in listItem && searchParams.get('sort') === listItem.slug) {
                 setActive(listItem.title);
@@ -35,7 +35,7 @@ export default function FilterItemDropdown({ list }) {
         pathname,
         list,
         searchParams
-    ]) : null;
+    ]);
     return <div className="relative" ref={ref}>
       <div onClick={()=>{
         setOpenSelect(!openSelect);
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
index b359abf0401e3..241ec69c79f9f 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
@@ -5,14 +5,14 @@ export default function App() {
     useEffect(()=>{
         console.log('Hello World');
     }, []);
-    process.env.NODE_ENV !== "production" ? useLayoutEffect(()=>{
+    process.env.__NEXT_OPTIMIZE_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [
         1,
         2,
         App
-    ]) : null;
+    ]);
     const a = useMemo(()=>{
         return 1;
     }, []);
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
index 532bdf0b1dc7b..4afe2425de82e 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
@@ -5,7 +5,7 @@ const Component = ({ children, fallback })=>{
         false,
         ()=>null
     ];
-    process.env.NODE_ENV !== "production" ? useEffect(()=>setMounted(true), []) : null;
+    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>setMounted(true), []);
     if (!mounted) {
         return fallback ?? /* @__PURE__ */ jsx(Fragment, {});
     }
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
index 66e5c8a8b4578..dbca57921f8f7 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
@@ -1,17 +1,17 @@
 import { useEffect, useLayoutEffect, useMemo } from 'react';
 import * as React from 'react';
 export default function App() {
-    process.env.NODE_ENV !== "production" ? useEffect(()=>{
+    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>{
         console.log('Hello World');
-    }, []) : null;
-    process.env.NODE_ENV !== "production" ? useLayoutEffect(()=>{
+    }, []);
+    process.env.__NEXT_OPTIMIZE_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [
         1,
         2,
         App
-    ]) : null;
+    ]);
     useLayoutEffect(()=>{}, [
         runSideEffect()
     ]);
diff --git a/packages/next/src/build/swc/options.ts b/packages/next/src/build/swc/options.ts
index ef11483abf7d6..0cd2efba8c44e 100644
--- a/packages/next/src/build/swc/options.ts
+++ b/packages/next/src/build/swc/options.ts
@@ -400,7 +400,7 @@ export function getLoaderSWCOptions({
     },
   }
 
-  if (optimizeServerReact && isServer /* && !development*/) {
+  if (optimizeServerReact && isServer && !development) {
     baseOptions.optimizeServerReact = {
       optimize_use_state: false,
     }
diff --git a/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts b/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
index 064443d84e3ab..05cff01933add 100644
--- a/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
+++ b/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
@@ -111,7 +111,7 @@ export class MinifyPlugin {
                   : {}),
                 compress: {
                   global_defs: {
-                    'process.env.__NEXT_OPTIMIZE_DEC_FALSE': false,
+                    'process.env.__NEXT_OPTIMIZE_FALSE': false,
                   },
                 },
                 mangle: true,
diff --git a/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx b/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
index c7aa8daff83cd..e0656de1b90ac 100644
--- a/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
+++ b/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
@@ -12,9 +12,11 @@ export default function Page() {
 
   // calling action1 fails!!
   useEffect(() => {
-    action1().then((obj) => {
-      console.log('action1 returned:', obj)
-    })
+    if (globalThis.DO_NOT_TREE_SHAKE) {
+      action1().then((obj) => {
+        console.log('action1 returned:', obj)
+      })
+    }
   }, [])
 
   return <MyComponent />

From 633a59d800ec020223220b25147583e199d7880f Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Sun, 15 Sep 2024 00:18:31 +0200
Subject: [PATCH 4/5] re-enable test case

---
 .../use-effect-actions/app/mixed/page.tsx                   | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx b/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
index e0656de1b90ac..5a3604da44cb4 100644
--- a/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
+++ b/test/production/app-dir/actions-tree-shaking/use-effect-actions/app/mixed/page.tsx
@@ -12,10 +12,10 @@ export default function Page() {
 
   // calling action1 fails!!
   useEffect(() => {
+    action1().then((obj) => {
+      console.log('action1 returned:', obj)
+    })
     if (globalThis.DO_NOT_TREE_SHAKE) {
-      action1().then((obj) => {
-        console.log('action1 returned:', obj)
-      })
     }
   }, [])
 

From 7bc0f9acb81dd2b6d5712959ca897d5d50a0335a Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Sun, 15 Sep 2024 14:37:04 +0200
Subject: [PATCH 5/5] rename to __NEXT_PRIVATE_MINIMIZE_MARCO_FALSE

---
 crates/napi/src/minify.rs                              |  2 +-
 .../src/transforms/optimize_server_react.rs            | 10 +++++-----
 .../tests/fixture/optimize_server_react/1/output.js    |  6 +++---
 .../tests/fixture/optimize_server_react/2/output.js    |  4 ++--
 .../tests/fixture/optimize_server_react/4/output.js    |  2 +-
 .../tests/fixture/optimize_server_react/6/output.js    |  2 +-
 .../tests/fixture/optimize_server_react/7/output.js    |  4 ++--
 .../webpack/plugins/minify-webpack-plugin/src/index.ts |  2 +-
 8 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/crates/napi/src/minify.rs b/crates/napi/src/minify.rs
index 0020364d503e5..4856c7d6f942f 100644
--- a/crates/napi/src/minify.rs
+++ b/crates/napi/src/minify.rs
@@ -111,7 +111,7 @@ fn patch_opts(opts: &mut JsMinifyOptions) {
     opts.compress = BoolOrDataConfig::from_obj(TerserCompressorOptions {
         inline: Some(TerserInlineOption::Num(2)),
         global_defs: [(
-            "process.env.__NEXT_OPTIMIZE_FALSE".into(),
+            "process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE".into(),
             "production".into(),
         )]
         .iter()
diff --git a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
index 470628819a613..64590d3631974 100644
--- a/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
+++ b/crates/next-custom-transforms/src/transforms/optimize_server_react.rs
@@ -62,10 +62,10 @@ fn effect_has_side_effect_deps(call: &CallExpr) -> bool {
 
 fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
     // Wrap the call expression with the condition
-    // turn it into `process.env.__NEXT_OPTIMIZE_FALSE` && <call>.
-    // And `process.env.__NEXT_OPTIMIZE_FALSE`` will be treated as `false` in minification.
-    // In this way the expression and dependencies are still available in compilation during
-    // bundling, but will be removed in the final DEC.
+    // turn it into `process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE` && <call>.
+    // And `process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE`` will be treated as `false` in
+    // minification. In this way the expression and dependencies are still available in
+    // compilation during bundling, but will be removed in the final DEC.
     Expr::Bin(BinExpr {
         span: DUMMY_SP,
         left: Box::new(Expr::Member(MemberExpr {
@@ -83,7 +83,7 @@ fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
                 span: DUMMY_SP,
             }))),
             prop: (MemberProp::Ident(IdentName {
-                sym: "__NEXT_OPTIMIZE_FALSE".into(),
+                sym: "__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE".into(),
                 span: DUMMY_SP,
             })),
             span: DUMMY_SP,
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
index 8b756cccbb29f..9e46707814434 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/1/output.js
@@ -1,10 +1,10 @@
 import { useEffect, useLayoutEffect, useMemo } from 'react';
 import React from 'react';
 export default function App() {
-    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>{
         console.log('Hello World');
     }, []);
-    process.env.__NEXT_OPTIMIZE_FALSE && useLayoutEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [
@@ -24,7 +24,7 @@ export default function App() {
     const a = useMemo(()=>{
         return 1;
     }, []);
-    process.env.__NEXT_OPTIMIZE_FALSE && React.useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && React.useEffect(()=>{
         console.log('Hello World');
     });
     return <div>
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
index ec1899cb9fefd..a45bed4f4b8e5 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/2/output.js
@@ -16,7 +16,7 @@ export default function FilterItemDropdown({ list }) {
         ()=>null
     ];
     const ref = useRef(null);
-    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>{
         const handleClickOutside = (event)=>{
             if (ref.current && !ref.current.contains(event.target)) {
                 setOpenSelect(false);
@@ -25,7 +25,7 @@ export default function FilterItemDropdown({ list }) {
         window.addEventListener('click', handleClickOutside);
         return ()=>window.removeEventListener('click', handleClickOutside);
     }, []);
-    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>{
         list.forEach((listItem)=>{
             if ('path' in listItem && pathname === listItem.path || 'slug' in listItem && searchParams.get('sort') === listItem.slug) {
                 setActive(listItem.title);
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
index 241ec69c79f9f..835aae43cfbab 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/4/output.js
@@ -5,7 +5,7 @@ export default function App() {
     useEffect(()=>{
         console.log('Hello World');
     }, []);
-    process.env.__NEXT_OPTIMIZE_FALSE && useLayoutEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
index 4afe2425de82e..0d05a9dd34bd0 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/6/output.js
@@ -5,7 +5,7 @@ const Component = ({ children, fallback })=>{
         false,
         ()=>null
     ];
-    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>setMounted(true), []);
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>setMounted(true), []);
     if (!mounted) {
         return fallback ?? /* @__PURE__ */ jsx(Fragment, {});
     }
diff --git a/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js b/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
index dbca57921f8f7..372b80ad7fbdd 100644
--- a/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
+++ b/crates/next-custom-transforms/tests/fixture/optimize_server_react/7/output.js
@@ -1,10 +1,10 @@
 import { useEffect, useLayoutEffect, useMemo } from 'react';
 import * as React from 'react';
 export default function App() {
-    process.env.__NEXT_OPTIMIZE_FALSE && useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>{
         console.log('Hello World');
     }, []);
-    process.env.__NEXT_OPTIMIZE_FALSE && useLayoutEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [
diff --git a/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts b/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
index 05cff01933add..8c731879a323b 100644
--- a/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
+++ b/packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts
@@ -111,7 +111,7 @@ export class MinifyPlugin {
                   : {}),
                 compress: {
                   global_defs: {
-                    'process.env.__NEXT_OPTIMIZE_FALSE': false,
+                    'process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE': false,
                   },
                 },
                 mangle: true,