perf: render pages in parallel (#1094)

Author: sanjaiyan-dev

packages/bundler-vite/src/build/build.ts

@@ -1,6 +1,6 @@
 import type { CreateVueAppFunction } from '@vuepress/client'
 import type { App, Bundler } from '@vuepress/core'
-import { colors, debug, fs, importFile, withSpinner } from '@vuepress/utils'
+import { debug, fs, importFile, withSpinner } from '@vuepress/utils'
 import type { OutputAsset, OutputChunk, RollupOutput } from 'rollup'
 import { build as viteBuild } from 'vite'
 import { resolveViteConfig } from '../resolveViteConfig.js'
@@ -73,20 +73,21 @@ export const build = async (
     const { renderToString } = await import('vue/server-renderer')
 
     // pre-render pages to html files
-    for (const page of app.pages) {
-      if (spinner) spinner.text = `Rendering pages ${colors.magenta(page.path)}`
-      await renderPage({
-        app,
-        page,
-        vueApp,
-        vueRouter,
-        renderToString,
-        ssrTemplate,
-        output: clientOutput.output,
-        outputEntryChunk: clientEntryChunk,
-        outputCssAsset: clientCssAsset,
-      })
-    }
+    await Promise.all(
+      app.pages.map((page) =>
+        renderPage({
+          app,
+          page,
+          vueApp,
+          vueRouter,
+          renderToString,
+          ssrTemplate,
+          output: clientOutput.output,
+          outputEntryChunk: clientEntryChunk,
+          outputCssAsset: clientCssAsset,
+        })
+      )
+    )
   })
 
   // keep the server bundle files in debug mode

packages/bundler-webpack/src/build/build.ts

@@ -1,12 +1,6 @@
 import type { CreateVueAppFunction } from '@vuepress/client'
 import type { App, Bundler } from '@vuepress/core'
-import {
-  colors,
-  debug,
-  fs,
-  importFileDefault,
-  withSpinner,
-} from '@vuepress/utils'
+import { debug, fs, importFileDefault, withSpinner } from '@vuepress/utils'
 import webpack from 'webpack'
 import { resolveWebpackConfig } from '../resolveWebpackConfig.js'
 import type { WebpackBundlerOptions } from '../types.js'
@@ -96,23 +90,22 @@ export const build = async (
     const { renderToString } = await import('vue/server-renderer')
 
     // pre-render pages to html files
-    for (const page of app.pages) {
-      if (spinner) {
-        spinner.text = `Rendering pages ${colors.magenta(page.path)}`
-      }
-      await renderPage({
-        app,
-        page,
-        vueApp,
-        vueRouter,
-        renderToString,
-        ssrTemplate,
-        allFilesMeta,
-        initialFilesMeta,
-        asyncFilesMeta,
-        moduleFilesMetaMap,
-      })
-    }
+    await Promise.all(
+      app.pages.map((page) =>
+        renderPage({
+          app,
+          page,
+          vueApp,
+          vueRouter,
+          renderToString,
+          ssrTemplate,
+          allFilesMeta,
+          initialFilesMeta,
+          asyncFilesMeta,
+          moduleFilesMetaMap,
+        })
+      )
+    )
   })
 
   // keep the server bundle files in debug mode