Build visualizer output fix (#7701)

* Fixed treemap, treesun and treenet visualizer output

* Enhance build documentation and optimize plugin usage for release builds

Author: kpal81xd

.gitignore

@@ -2,7 +2,7 @@
 .idea/
 .vscode/
 build
-tree*.html
+tree*.*.html
 coverage
 docs
 examples/dist

build.mjs

@@ -9,9 +9,9 @@
  *     - bundleState (unbundled, bundled)
  * Example: target:esm:release:bundled
  *
- * treemap - Enable treemap build visualization.
- * treenet - Enable treenet build visualization.
- * treesun - Enable treesun build visualization.
+ * treemap - Enable treemap build visualization (release only).
+ * treenet - Enable treenet build visualization (release only).
+ * treesun - Enable treesun build visualization (release only).
  */
 
 import { execSync } from 'child_process';

package.json

@@ -108,9 +108,9 @@
     "build:esm": "npm run build target:esm",
     "build:esm:release": "npm run build target:esm:release",
     "build:esm:debug": "npm run build target:esm:debug",
-    "build:treemap": "npm run build target:umd treemap",
-    "build:treenet": "npm run build target:umd treenet",
-    "build:treesun": "npm run build target:umd treesun",
+    "build:treemap": "npm run build target:release treemap",
+    "build:treenet": "npm run build target:release treenet",
+    "build:treesun": "npm run build target:release treesun",
     "build:sourcemaps": "npm run build -- -m",
     "watch": "npm run build -- -w",
     "watch:release": "npm run build target:release -- -w",

utils/rollup-build-target.mjs

@@ -121,30 +121,30 @@ function getJSCCOptions(buildType, isUMD) {
 }
 
 /**
+ * @param {string} type - The type of the output (e.g., 'umd', 'es').
  * @returns {OutputOptions['plugins']} - The output plugins.
  */
-function getOutPlugins() {
-    const plugins = [
-    ];
+function getOutPlugins(type) {
+    const plugins = [];
 
     if (process.env.treemap) {
         plugins.push(visualizer({
-            filename: 'treemap.html',
+            filename: `treemap.${type}.html`,
             brotliSize: true,
             gzipSize: true
         }));
     }
 
     if (process.env.treenet) {
         plugins.push(visualizer({
-            filename: 'treenet.html',
+            filename: `treenet.${type}.html`,
             template: 'network'
         }));
     }
 
     if (process.env.treesun) {
         plugins.push(visualizer({
-            filename: 'treesun.html',
+            filename: `treesun.${type}.html`,
             template: 'sunburst'
         }));
     }
@@ -155,6 +155,10 @@ function getOutPlugins() {
 /**
  * Build a target that Rollup is supposed to build (bundled and unbundled).
  *
+ * For faster subsequent builds, the unbundled and release builds are cached in the HISTORY map to
+ * be used for bundled and minified builds. They are stored in the HISTORY map with the key:
+ * `<debug|release|profiler>-<umd|esm>-<bundled>`.
+ *
  * @param {object} options - The build target options.
  * @param {'umd'|'esm'} options.moduleFormat - The module format.
  * @param {'debug'|'release'|'profiler'|'min'} options.buildType - The build type.
@@ -169,6 +173,9 @@ function buildTarget({ moduleFormat, buildType, bundleState, input = 'src/index.
     const isMin = buildType === 'min';
     const bundled = isUMD || isMin || bundleState === 'bundled';
 
+    const prefix = `${OUT_PREFIX[buildType]}`;
+    const file = `${prefix}${isUMD ? '.js' : '.mjs'}`;
+
     const targets = [];
 
     // bundle from unbundled
@@ -187,7 +194,7 @@ function buildTarget({ moduleFormat, buildType, bundleState, input = 'src/index.
                 sourcemap: isDebug && 'inline',
                 name: 'pc',
                 preserveModules: false,
-                file: `${dir}/${OUT_PREFIX[buildType]}.mjs`
+                file: `${dir}/${prefix}.mjs`
             }
         };
 
@@ -211,8 +218,7 @@ function buildTarget({ moduleFormat, buildType, bundleState, input = 'src/index.
             ],
             output: {
                 banner: isUMD ? getBanner(BANNER[buildType]) : undefined,
-                plugins: getOutPlugins(),
-                file: `${dir}/${OUT_PREFIX[buildType]}${isUMD ? '.js' : '.mjs'}`
+                file: `${dir}/${file}`
             },
             context: isUMD ? 'this' : undefined
         };
@@ -230,15 +236,15 @@ function buildTarget({ moduleFormat, buildType, bundleState, input = 'src/index.
         input,
         output: {
             banner: bundled ? getBanner(BANNER[buildType]) : undefined,
-            plugins: isMin ? getOutPlugins() : undefined,
+            plugins: buildType === 'release' ? getOutPlugins(isUMD ? 'umd' : 'es') : undefined,
             format: isUMD ? 'umd' : 'es',
             indent: '\t',
             sourcemap: bundled && isDebug && 'inline',
             name: 'pc',
             preserveModules: !bundled,
             preserveModulesRoot: !bundled ? rootDir : undefined,
-            file: bundled ? `${dir}/${OUT_PREFIX[buildType]}${isUMD ? '.js' : '.mjs'}` : undefined,
-            dir: !bundled ? `${dir}/${OUT_PREFIX[buildType]}` : undefined,
+            file: bundled ? `${dir}/${file}` : undefined,
+            dir: !bundled ? `${dir}/${prefix}` : undefined,
             entryFileNames: chunkInfo => `${chunkInfo.name.replace(/node_modules/g, 'modules')}.js`
         },
         plugins: [