Turbopack: use prototype for turbopack context for better runtime performance (#81547)

### What?

* use prototype for turbopack context for better runtime performance
* remove destructuring when unneeded
* ensure all calls use the correct context
* create static module object at one location

### Why?

Improve performance by reducing allocations in the hot path of module evaluation:

Based on our module-cost benchmark this is about a 15% runtime improvement

* CommonJS Execution Duration: 25.60ms → 21.85ms (14.6% improvement)
* ESM Execution Duration: 53.34ms → 44.82ms (16.0% improvement)

Which addressed most of the known gap with webpack.

Part of PACK-5057

Author: sokra

crates/next-core/src/next_app/app_page_entry.rs

@@ -98,8 +98,8 @@ pub async fn get_app_page_entry(
         fxindexmap! {
             "tree" => loader_tree_code,
             "pages" => StringifyJs(&pages).to_string().into(),
-            "__next_app_require__" => TURBOPACK_REQUIRE.full.into(),
-            "__next_app_load_chunk__" => TURBOPACK_LOAD.full.into(),
+            "__next_app_require__" => TURBOPACK_REQUIRE.bound().into(),
+            "__next_app_load_chunk__" => TURBOPACK_LOAD.bound().into(),
         },
         fxindexmap! {},
     )

packages/next/src/client/next-dev-turbopack.ts

@@ -31,7 +31,9 @@ initialize({
       page: string,
       chunksData: any
     ) => {
-      const chunkPromises = chunksData.map(__turbopack_load__)
+      const chunkPromises = chunksData.map((c: unknown) =>
+        __turbopack_load__(c)
+      )
 
       Promise.all(chunkPromises).catch((err) =>
         console.error('failed to load chunks for page ' + page, err)

packages/next/src/client/next-turbopack.ts

@@ -29,7 +29,9 @@ initialize({})
       page: string,
       chunksData: any
     ) => {
-      const chunkPromises = chunksData.map(__turbopack_load__)
+      const chunkPromises = chunksData.map((c: unknown) =>
+        __turbopack_load__(c)
+      )
 
       Promise.all(chunkPromises).catch((err) =>
         console.error('failed to load chunks for page ' + page, err)

test/development/acceptance-app/error-recovery.test.ts

@@ -286,6 +286,10 @@ describe('Error recovery app', () => {
 
     if (isTurbopack) {
       // TODO(veil): Location of Page should be app/page.js
+      // TODO(sokra): The location is wrong because of an bug with HMR and source maps.
+      // When the code `index.js` changes, this also moves the locations of `app/page.js` in the bundled file.
+      // So the SourceMap is updated to reflect that. But the browser still has the old bundled file loaded.
+      // So we look up locations from the old bundle in the new source maps, which leads to mismatched locations.
       await expect(browser).toDisplayCollapsedRedbox(`
        {
          "description": "oops",
@@ -298,7 +302,7 @@ describe('Error recovery app', () => {
            "Index.useCallback[increment] index.js (7:11)",
            "button <anonymous>",
            "Index index.js (12:7)",
-           "Page index.js (10:6)",
+           "Page index.js (8:16)",
          ],
        }
       `)

turbopack/crates/turbopack-ecmascript-runtime/js/src/browser/runtime/base/build-base.ts

@@ -1,9 +1,8 @@
 /// <reference path="./runtime-base.ts" />
 /// <reference path="./dummy.ts" />
 
-declare var augmentContext: (context: unknown) => unknown
-
 const moduleCache: ModuleCache<Module> = {}
+contextPrototype.c = moduleCache
 
 /**
  * Gets or instantiates a runtime module.
@@ -53,83 +52,17 @@ function instantiateModule(
     // This can happen if modules incorrectly handle HMR disposes/updates,
     // e.g. when they keep a `setTimeout` around which still executes old code
     // and contains e.g. a `require("something")` call.
-    let instantiationReason
-    switch (sourceType) {
-      case SourceType.Runtime:
-        instantiationReason = `as a runtime entry of chunk ${sourceData}`
-        break
-      case SourceType.Parent:
-        instantiationReason = `because it was required from module ${sourceData}`
-        break
-      case SourceType.Update:
-        instantiationReason = 'because of an HMR update'
-        break
-      default:
-        invariant(
-          sourceType,
-          (sourceType) => `Unknown source type: ${sourceType}`
-        )
-    }
-    throw new Error(
-      `Module ${id} was instantiated ${instantiationReason}, but the module factory is not available. It might have been deleted in an HMR update.`
-    )
+    factoryNotAvailable(id, sourceType, sourceData)
   }
 
-  switch (sourceType) {
-    case SourceType.Runtime:
-      runtimeModules.add(id)
-      break
-    case SourceType.Parent:
-      // No need to add this module as a child of the parent module here, this
-      // has already been taken care of in `getOrInstantiateModuleFromParent`.
-      break
-    case SourceType.Update:
-      throw new Error('Unexpected')
-    default:
-      invariant(
-        sourceType,
-        (sourceType) => `Unknown source type: ${sourceType}`
-      )
-  }
-
-  const module: Module = {
-    exports: {},
-    error: undefined,
-    loaded: false,
-    id,
-    namespaceObject: undefined,
-  }
+  const module: Module = createModuleObject(id)
 
   moduleCache[id] = module
 
   // NOTE(alexkirsz) This can fail when the module encounters a runtime error.
   try {
-    const r = commonJsRequire.bind(null, module)
-    moduleFactory(
-      augmentContext({
-        a: asyncModule.bind(null, module),
-        e: module.exports,
-        r: commonJsRequire.bind(null, module),
-        t: runtimeRequire,
-        f: moduleContext,
-        i: esmImport.bind(null, module),
-        s: esmExport.bind(null, module, module.exports, moduleCache),
-        j: dynamicExport.bind(null, module, module.exports, moduleCache),
-        v: exportValue.bind(null, module, moduleCache),
-        n: exportNamespace.bind(null, module, moduleCache),
-        m: module,
-        c: moduleCache,
-        M: moduleFactories,
-        l: loadChunk.bind(null, SourceType.Parent, id),
-        L: loadChunkByUrl.bind(null, SourceType.Parent, id),
-        w: loadWebAssembly.bind(null, SourceType.Parent, id),
-        u: loadWebAssemblyModule.bind(null, SourceType.Parent, id),
-        P: resolveAbsolutePath,
-        U: relativeURL,
-        R: createResolvePathFromModule(r),
-        b: getWorkerBlobURL,
-      })
-    )
+    const context = new (Context as any as ContextConstructor<Module>)(module)
+    moduleFactory(context)
   } catch (error) {
     module.error = error as any
     throw error
@@ -143,3 +76,17 @@ function instantiateModule(
 
   return module
 }
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function registerChunk([
+  chunkScript,
+  chunkModules,
+  runtimeParams,
+]: ChunkRegistration) {
+  const chunkPath = getPathFromScript(chunkScript)
+  for (const [moduleId, moduleFactory] of Object.entries(chunkModules)) {
+    registerCompressedModuleFactory(moduleId, moduleFactory)
+  }
+
+  return BACKEND.registerChunk(chunkPath, runtimeParams)
+}