Remove unused id rsc cache cleaning and avoid rsc refresh existed in …

…client chunk (#37404)

* refactor: remove useless id removal for rsc cache
* avoid refresh root existed in main client chunk
  - x-ref: #36702 
  - x-ref: #35907

packages/next/client/index.tsx

@@ -30,7 +30,6 @@ import measureWebVitals from './performance-relayer'
 import { RouteAnnouncer } from './route-announcer'
 import { createRouter, makePublicRouterInstance } from './router'
 import { getProperError } from '../lib/is-error'
-import { RefreshContext } from './streaming/refresh'
 import { ImageConfigContext } from '../shared/lib/image-config-context'
 import { ImageConfigComplete } from '../shared/lib/image-config'
 import { removeBasePath } from './remove-base-path'
@@ -675,6 +674,7 @@ if (process.env.__NEXT_RSC) {
  createFromFetch,
  createFromReadableStream,
  } = require('next/dist/compiled/react-server-dom-webpack')
+ const { RefreshContext } = require('./streaming/refresh')
 
  const encoder = new TextEncoder()
 

packages/next/server/app-render.tsx

@@ -105,10 +105,11 @@ function preloadDataFetchingRecord(
 
 function useFlightResponse(
  writable: WritableStream<Uint8Array>,
- id: string,
+ cachePrefix: string,
  req: ReadableStream<Uint8Array>,
  serverComponentManifest: any
 ) {
+ const id = cachePrefix + ',' + (React as any).useId()
  let entry = rscCache.get(id)
  if (!entry) {
  const [renderStream, forwardStream] = readableStreamTee(req)
@@ -180,20 +181,18 @@ function createServerComponentRenderer(
 
  const writable = transformStream.writable
  const ServerComponentWrapper = (props: any) => {
- const id = (React as any).useId()
  const reqStream: ReadableStream<Uint8Array> = renderToReadableStream(
  <ComponentToRender {...props} />,
  serverComponentManifest
  )
 
  const response = useFlightResponse(
  writable,
- cachePrefix + ',' + id,
+ cachePrefix,
  reqStream,
  serverComponentManifest
  )
  const root = response.readRoot()
- rscCache.delete(id)
  return root
  }
 

packages/next/server/render.tsx

@@ -313,18 +313,19 @@ function checkRedirectValues(
 const rscCache = new Map()
 
 function useFlightResponse({
- id,
+ cachePrefix,
  req,
  pageData,
  inlinedDataWritable,
  serverComponentManifest,
 }: {
- id: string
+ cachePrefix: string
  req: ReadableStream<Uint8Array>
  pageData: { current: string } | null
  inlinedDataWritable: WritableStream<Uint8Array>
  serverComponentManifest: any
 }) {
+ const id = cachePrefix + ',' + (React as any).useId()
  let entry = rscCache.get(id)
  if (!entry) {
  const [renderStream, forwardStream] = readableStreamTee(req)
@@ -391,23 +392,20 @@ function createServerComponentRenderer(
  }
 ) {
  function ServerComponentWrapper({ router, ...props }: any) {
- const id = (React as any).useId()
-
  const reqStream: ReadableStream<Uint8Array> = renderToReadableStream(
  <Component {...props} />,
  serverComponentManifest
  )
 
  const response = useFlightResponse({
- id: cachePrefix + ',' + id,
+ cachePrefix,
  req: reqStream,
  pageData,
  inlinedDataWritable: inlinedTransformStream.writable,
  serverComponentManifest,
  })
 
  const root = response.readRoot()
- rscCache.delete(id)
  return root
  }
 

test/integration/production/test/index.test.js

@@ -313,7 +313,7 @@ describe('Production Usage', () => {
  expect(content).not.toContain('.currentScript')
  })
 
- it('should not contain useAmp in main chunk', async () => {
+ it('should not contain amp, rsc APIs in main chunk', async () => {
  const globResult = await glob('main-*.js', {
  cwd: join(appDir, '.next/static/chunks'),
  })
@@ -328,6 +328,7 @@ describe('Production Usage', () => {
  )
 
  expect(content).not.toContain('useAmp')
+ expect(content).not.toContain('useRefreshRoot')
  })
 
  describe('With basic usage', () => {