Add keepAlive to node-fetch polyfill (#27376)

Fixes #27109 

This PR adds a default `agent` as described in the [`node-fetch` docs](https://github.com/node-fetch/node-fetch#custom-agent).

We should see about 2x perf according to some [benchmarks](https://github.com/Ethan-Arrowood/undici-fetch/blob/main/benchmarks.md#fetch).

Author: styfle

packages/next/server/node-polyfill-fetch.js

@@ -1,8 +1,22 @@
 import fetch, { Headers, Request, Response } from 'node-fetch'
+import { Agent as HttpAgent } from 'http'
+import { Agent as HttpsAgent } from 'https'
 
 // Polyfill fetch() in the Node.js environment
 if (!global.fetch) {
-  global.fetch = fetch
+  const httpAgent = new HttpAgent({ keepAlive: true })
+  const httpsAgent = new HttpsAgent({ keepAlive: true })
+  const agent = ({ protocol }) =>
+    protocol === 'http:' ? httpAgent : httpsAgent
+  const fetchWithAgent = (url, opts, ...rest) => {
+    if (!opts) {
+      opts = { agent }
+    } else if (!opts.agent) {
+      opts.agent = agent
+    }
+    return fetch(url, opts, ...rest)
+  }
+  global.fetch = fetchWithAgent
   global.Headers = Headers
   global.Request = Request
   global.Response = Response

test/integration/node-fetch-keep-alive/pages/api/json.js

@@ -0,0 +1,5 @@
+export default async function handler(_req, res) {
+  const fetchRes = await fetch('http://localhost:44001')
+  const props = await fetchRes.json()
+  res.json(props)
+}

test/integration/node-fetch-keep-alive/pages/ssg.js

@@ -0,0 +1,9 @@
+export default function SSG(props) {
+  return <pre id="props">{JSON.stringify(props)}</pre>
+}
+
+export async function getStaticProps() {
+  const res = await fetch('http://localhost:44001')
+  const props = await res.json()
+  return { props }
+}

test/integration/node-fetch-keep-alive/pages/ssr.js

@@ -0,0 +1,9 @@
+export default function SSR(props) {
+  return <pre id="props">{JSON.stringify(props)}</pre>
+}
+
+export async function getServerSideProps() {
+  const res = await fetch('http://localhost:44001')
+  const props = await res.json()
+  return { props }
+}

test/integration/node-fetch-keep-alive/test/index.test.js

@@ -0,0 +1,66 @@
+/* eslint-env jest */
+
+import { join } from 'path'
+import { createServer } from 'http'
+import {
+  fetchViaHTTP,
+  nextBuild,
+  findPort,
+  nextStart,
+  killApp,
+} from 'next-test-utils'
+import webdriver from 'next-webdriver'
+
+jest.setTimeout(1000 * 60 * 1)
+
+const appDir = join(__dirname, '../')
+
+let appPort
+let app
+let mockServer
+
+describe('node-fetch-keep-alive', () => {
+  beforeAll(async () => {
+    mockServer = createServer((req, res) => {
+      // we can test request headers by sending them
+      // back with the response
+      const { connection } = req.headers
+      res.end(JSON.stringify({ connection }))
+    })
+    mockServer.listen(44001)
+    const { stdout, stderr } = await nextBuild(appDir, [], {
+      stdout: true,
+      stderr: true,
+    })
+    if (stdout) console.log(stdout)
+    if (stderr) console.error(stderr)
+    appPort = await findPort()
+    app = await nextStart(appDir, appPort)
+  })
+  afterAll(async () => {
+    await killApp(app)
+    mockServer.close()
+  })
+
+  it('should send keep-alive for json API', async () => {
+    const res = await fetchViaHTTP(appPort, '/api/json')
+    const obj = await res.json()
+    expect(obj).toEqual({ connection: 'keep-alive' })
+  })
+
+  it('should send keep-alive for getStaticProps', async () => {
+    const browser = await webdriver(appPort, '/ssg')
+    const props = await browser.elementById('props').text()
+    const obj = JSON.parse(props)
+    expect(obj).toEqual({ connection: 'keep-alive' })
+    await browser.close()
+  })
+
+  it('should send keep-alive for getServerSideProps', async () => {
+    const browser = await webdriver(appPort, '/ssr')
+    const props = await browser.elementById('props').text()
+    const obj = JSON.parse(props)
+    expect(obj).toEqual({ connection: 'keep-alive' })
+    await browser.close()
+  })
+})