fix: remove globalThis check and align with what bundlers can accept

cspell.yml

@@ -19,6 +19,10 @@ overrides:
       - clsx
       - infima
       - noopener
+      - Vite
+      - craco
+      - esbuild
+      - swcrc
       - noreferrer
       - xlink
 

src/jsutils/instanceOf.ts

@@ -1,5 +1,11 @@
 import { inspect } from './inspect';
 
+/* c8 ignore next 3 */
+const isProduction =
+  globalThis.process &&
+  // eslint-disable-next-line no-undef
+  process.env.NODE_ENV === 'production';
+
 /**
  * A replacement for instanceof which includes an error warning when multi-realm
  * constructors are detected.
@@ -9,7 +15,7 @@ import { inspect } from './inspect';
 export const instanceOf: (value: unknown, constructor: Constructor) => boolean =
   /* c8 ignore next 6 */
   // FIXME: https://github.com/graphql/graphql-js/issues/2317
-  globalThis.process && globalThis.process.env.NODE_ENV === 'production'
+  isProduction
     ? function instanceOf(value: unknown, constructor: Constructor): boolean {
         return value instanceof constructor;
       }

website/docs/tutorials/going-to-production.md

@@ -0,0 +1,127 @@
+---
+title: Going to production
+category: FAQ
+---
+
+GraphQL.JS contains a few development checks which in production will cause slower performance and
+an increase in bundle-size. Every bundler goes about these changes different, in here we'll list
+out the most popular ones.
+
+## Bundler-specific configuration
+
+Here are some bundler-specific suggestions for configuring your bundler to remove `globalThis.process` and `process.env.NODE_ENV` on build time.
+
+### Vite
+
+```js
+export default defineConfig({
+  // ...
+  define: {
+    'globalThis.process': JSON.stringify(true),
+    'process.env.NODE_ENV': JSON.stringify('production'),
+  },
+});
+```
+
+### Next.js
+
+```js
+// ...
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  webpack(config, { webpack }) {
+    config.plugins.push(
+      new webpack.DefinePlugin({
+        'globalThis.process': JSON.stringify(true),
+        'process.env.NODE_ENV': JSON.stringify('production'),
+      }),
+    );
+    return config;
+  },
+};
+
+module.exports = nextConfig;
+```
+
+### create-react-app
+
+With `create-react-app`, you need to use a third-party package like [`craco`](https://craco.js.org/) to modify the bundler configuration.
+
+```js
+const webpack = require('webpack');
+module.exports = {
+  webpack: {
+    plugins: [
+      new webpack.DefinePlugin({
+        'globalThis.process': JSON.stringify(true),
+        'process.env.NODE_ENV': JSON.stringify('production'),
+      }),
+    ],
+  },
+};
+```
+
+### esbuild
+
+```json
+{
+  "define": {
+    "globalThis.process": true,
+    "process.env.NODE_ENV": "production"
+  }
+}
+```
+
+### Webpack
+
+```js
+config.plugins.push(
+  new webpack.DefinePlugin({
+    'globalThis.process': JSON.stringify(true),
+    'process.env.NODE_ENV': JSON.stringify('production'),
+  }),
+);
+```
+
+### Rollup
+
+```js
+export default [
+  {
+    // ... input, output, etc.
+    plugins: [
+      minify({
+        mangle: {
+          toplevel: true,
+        },
+        compress: {
+          toplevel: true,
+          global_defs: {
+            '@globalThis.process': JSON.stringify(true),
+            '@process.env.NODE_ENV': JSON.stringify('production'),
+          },
+        },
+      }),
+    ],
+  },
+];
+```
+
+### SWC
+
+```json title=".swcrc"
+{
+  "jsc": {
+    "transform": {
+      "optimizer": {
+        "globals": {
+          "vars": {
+            "globalThis.process": true,
+            "process.env.NODE_ENV": "production"
+          }
+        }
+      }
+    }
+  }
+}
+```

website/sidebars.js

@@ -15,6 +15,11 @@ module.exports = {
       label: 'Advanced',
       items: ['tutorials/constructing-types'],
     },
+    {
+      type: 'category',
+      label: 'FAQ',
+      items: ['tutorials/going-to-production'],
+    },
     'tutorials/express-graphql',
   ],
 };