perf(breaking)(react-app) - remove prerender options from react app (#…

…9418)

scopes/react/react/apps/web/react-app-options.ts

@@ -2,10 +2,6 @@ import { Bundler, DevServer } from '@teambit/bundler';
 import { WebpackConfigTransformer } from '@teambit/webpack';
 
 import { ReactDeployContext } from './deploy-context';
-import { WebpackPrerenderSPAOptions } from './plugins/prerender';
-
-/** https://github.com/Tofandel/prerenderer */
-export type ReactAppPrerenderOptions = WebpackPrerenderSPAOptions;
 
 export type ReactAppOptions = {
   /**
@@ -43,14 +39,6 @@ export type ReactAppOptions = {
    */
   webpackTransformers?: WebpackConfigTransformer[];
 
-  /**
-   * decide whether to prerender your app. accepts an array of routes. if none, prerender would not apply.
-   *  e.g ['/plugins', '/learn', '/docs/quick-start]
-   * You can also pass a configuration for the proxy, please refer here: https://github.com/webpack/docs/wiki/webpack-dev-server#proxy
-   *
-   */
-  prerender?: ReactAppPrerenderOptions;
-
   /**
    * deploy function.
    */

scopes/react/react/apps/web/react.app-type.ts

@@ -22,7 +22,6 @@ export class ReactAppType implements ApplicationType<ReactAppOptions> {
       this.reactEnv,
       this.logger,
       this.dependencyResolver,
-      options.prerender,
       options.bundler,
       options.ssrBundler,
       options.devServer,

scopes/react/react/apps/web/react.application.ts

@@ -10,15 +10,13 @@ import compact from 'lodash.compact';
 import { WebpackConfigTransformer } from '@teambit/webpack';
 import { BitError } from '@teambit/bit-error';
 import { ReactEnv } from '../../react.env';
-import { prerenderPlugin } from './plugins';
 import { ReactAppBuildResult } from './react-build-result';
 import { html } from '../../webpack';
 import { ReactDeployContext } from './deploy-context';
 import { computeResults } from './compute-results';
 import { clientConfig, ssrConfig, calcOutputPath, ssrBuildConfig, buildConfig } from './webpack/webpack.app.ssr.config';
 import { addDevServer, setOutput, replaceTerserPlugin, setDevServerClient } from './webpack/mutators';
 import { createExpressSsr, loadSsrApp, parseAssets } from './ssr/ssr-express';
-import { WebpackPrerenderSPAOptions } from './plugins/prerender';
 
 export class ReactApp implements Application {
   constructor(
@@ -29,7 +27,6 @@ export class ReactApp implements Application {
     private reactEnv: ReactEnv,
     private logger: Logger,
     private dependencyResolver: DependencyResolverMain,
-    readonly prerender?: WebpackPrerenderSPAOptions,
     readonly bundler?: Bundler,
     readonly ssrBundler?: Bundler,
     readonly devServer?: DevServer,
@@ -257,11 +254,7 @@ export class ReactApp implements Application {
     const bundlerContext = await this.getBuildContext(context, { outputPath });
     const transformers: WebpackConfigTransformer[] = compact([
       (configMutator) => configMutator.merge(buildConfig({ outputPath: join(outputPath, this.dir) })),
-      (config) => {
-        if (this.prerender) config.addPlugin(prerenderPlugin(this.prerender));
-        return config;
-      },
-      replaceTerserPlugin({ prerender: !!this.prerender }),
+      replaceTerserPlugin(),
       ...this.transformers,
     ]);
 
@@ -278,7 +271,7 @@ export class ReactApp implements Application {
     const bundlerContext = await this.getBuildContext(context, { outputPath });
     const transformers: WebpackConfigTransformer[] = compact([
       (configMutator) => configMutator.merge(ssrBuildConfig({ outputPath: join(outputPath, this.ssrDir) })),
-      replaceTerserPlugin({ prerender: !!this.prerender }),
+      replaceTerserPlugin(),
       ...this.transformers,
     ]);
 

scopes/react/react/apps/web/webpack/mutators.ts

@@ -40,15 +40,15 @@ export function setDevServerClient(configMutator: WebpackConfigMutator) {
   return configMutator;
 }
 
-export function replaceTerserPlugin({ prerender = false }: { prerender: boolean }) {
+export function replaceTerserPlugin() {
   return (configMutator: WebpackConfigMutator) => {
     if (!configMutator.raw.optimization?.minimizer) return configMutator;
 
     remove(configMutator.raw.optimization?.minimizer, (minimizer: any) => {
       return minimizer.constructor.name === 'TerserPlugin';
     });
 
-    const terserer = prerender ? CreateTerserPluginForPrerender() : CreateTerserPlugin();
+    const terserer = CreateTerserPlugin();
     configMutator.raw.optimization?.minimizer.push(terserer);
 
     return configMutator;
@@ -65,43 +65,3 @@ function CreateTerserPlugin() {
     },
   });
 }
-
-function CreateTerserPluginForPrerender() {
-  return new TerserPlugin({
-    extractComments: false,
-    terserOptions: {
-      parse: {
-        // We want terser to parse ecma 8 code. However, we don't want it
-        // to apply any minification steps that turns valid ecma 5 code
-        // into invalid ecma 5 code. This is why the 'compress' and 'output'
-        // sections only apply transformations that are ecma 5 safe
-        // https://github.com/facebook/create-react-app/pull/4234
-        ecma: 8,
-      },
-      compress: {
-        ecma: 5,
-        warnings: false,
-        // Disabled because of an issue with Uglify breaking seemingly valid code:
-        // https://github.com/facebook/create-react-app/issues/2376
-        // Pending further investigation:
-        // https://github.com/mishoo/UglifyJS2/issues/2011
-        comparisons: false,
-        // Disabled because of an issue with Terser breaking valid code:
-        // https://github.com/facebook/create-react-app/issues/5250
-        // Pending further investigation:
-        // https://github.com/terser-js/terser/issues/120
-        inline: 2,
-      },
-      mangle: {
-        safari10: true,
-      },
-      output: {
-        ecma: 5,
-        comments: false,
-        // Turned on because emoji and regex is not minified properly using default
-        // https://github.com/facebook/create-react-app/issues/2488
-        ascii_only: true,
-      },
-    },
-  });
-}

workspace.jsonc

@@ -66,9 +66,6 @@
         "@pnpm/types": "900.0.0",
         "@pnpm/worker": "900.0.0",
         "@pnpm/workspace.pkgs-graph": "900.0.1",
-        "@prerenderer/prerenderer": "^1.2.0",
-        "@prerenderer/renderer-jsdom": "^1.1.2",
-        "@prerenderer/webpack-plugin": "^5.2.0",
         "@react-hook/latest": "1.0.3",
         "@svgr/webpack": "8.1.0",
         "@teambit/any-fs": "0.0.5",
@@ -537,7 +534,6 @@
         "prompt": "1.3.0",
         "prop-types": "^15.8.1",
         "punycode": "^2.3.1",
-        "puppeteer": "13.7.0",
         "query-string": "7.0.0",
         "ramda": "0.27.1",
         "react-animate-height": "2.0.23",