Use rs minify to replace the optimize cond and fix typo

crates/napi/src/minify.rs

@@ -111,8 +111,8 @@ fn patch_opts(opts: &mut JsMinifyOptions) {
     opts.compress = BoolOrDataConfig::from_obj(TerserCompressorOptions {
         inline: Some(TerserInlineOption::Num(2)),
         global_defs: [(
-            "process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE".into(),
-            "production".into(),
+            "process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE".into(),
+            false.into(),
         )]
         .iter()
         .cloned()

crates/next-custom-transforms/src/transforms/optimize_server_react.rs

@@ -62,8 +62,8 @@ 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_PRIVATE_MINIMIZE_MARCO_FALSE` && <call>.
-    // And `process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE`` will be treated as `false` in
+    // turn it into `process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && <call>`.
+    // And `process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_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 {
@@ -75,15 +75,14 @@ fn wrap_expr_with_env_prod_condition(call: CallExpr) -> Expr {
                     span: DUMMY_SP,
                     ..Default::default()
                 }))),
-
                 prop: MemberProp::Ident(IdentName {
                     sym: "env".into(),
                     span: DUMMY_SP,
                 }),
                 span: DUMMY_SP,
             }))),
             prop: (MemberProp::Ident(IdentName {
-                sym: "__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE".into(),
+                sym: "__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE".into(),
                 span: DUMMY_SP,
             })),
             span: DUMMY_SP,

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_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>{
         console.log('Hello World');
     }, []);
-    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useLayoutEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [
@@ -24,7 +24,7 @@ export default function App() {
     const a = useMemo(()=>{
         return 1;
     }, []);
-    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && React.useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && React.useEffect(()=>{
         console.log('Hello World');
     });
     return <div>

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_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_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_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>{
         list.forEach((listItem)=>{
             if ('path' in listItem && pathname === listItem.path || 'slug' in listItem && searchParams.get('sort') === listItem.slug) {
                 setActive(listItem.title);

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_PRIVATE_MINIMIZE_MARCO_FALSE && useLayoutEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [

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_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>setMounted(true), []);
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>setMounted(true), []);
     if (!mounted) {
         return fallback ?? /* @__PURE__ */ jsx(Fragment, {});
     }

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_PRIVATE_MINIMIZE_MARCO_FALSE && useEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useEffect(()=>{
         console.log('Hello World');
     }, []);
-    process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE && useLayoutEffect(()=>{
+    process.env.__NEXT_PRIVATE_MINIMIZE_MACRO_FALSE && useLayoutEffect(()=>{
         function foo() {}
         return ()=>{};
     }, [

packages/next/src/build/webpack/plugins/minify-webpack-plugin/src/index.ts

@@ -109,11 +109,7 @@ export class MinifyPlugin {
                       },
                     }
                   : {}),
-                compress: {
-                  global_defs: {
-                    'process.env.__NEXT_PRIVATE_MINIMIZE_MARCO_FALSE': false,
-                  },
-                },
+                compress: true,
                 mangle: true,
                 module: 'unknown',
                 output: {

test/production/optimize-server-react/optimize-server-react.test.ts

@@ -0,0 +1,19 @@
+import { nextTestSetup } from 'e2e-utils'
+;(process.env.TURBOPACK ? describe.skip : describe)(
+  'optimize-server-react',
+  () => {
+    const { next } = nextTestSetup({
+      files: __dirname,
+    })
+
+    it('should work with useEffect', async () => {
+      const browser = await next.browser('/')
+      expect(await browser.elementByCss('p').text()).toBe('hello world')
+    })
+
+    it('should optimize useEffect call on server side', async () => {
+      const file = await next.readFile('.next/server/pages/index.js')
+      expect(file).not.toContain('useEffect')
+    })
+  }
+)

test/production/optimize-server-react/pages/index.tsx

@@ -0,0 +1,13 @@
+import { useEffect } from 'react'
+
+export default function Page() {
+  useEffect(() => {
+    console.log('use-effect-call-log')
+  }, [])
+  return <p>hello world</p>
+}
+
+// Mark as dynamic
+export function getServerSideProps() {
+  return { props: {} }
+}