perf: skip gzip size calculation for non-compressible assets

e2e/cases/assets/assets-url/index.test.ts

@@ -1,12 +1,10 @@
 import { build } from '@e2e/helper';
 import { expect, test } from '@playwright/test';
-import { pluginReact } from '@rsbuild/plugin-react';
 
 test('should allow to get assets URL with `?url`', async ({ page }) => {
   const rsbuild = await build({
     cwd: __dirname,
     page,
-    plugins: [pluginReact()],
   });
 
   await expect(

e2e/cases/assets/assets-url/rsbuild.config.ts

@@ -0,0 +1,6 @@
+import { defineConfig } from '@rsbuild/core';
+import { pluginReact } from '@rsbuild/plugin-react';
+
+export default defineConfig({
+  plugins: [pluginReact()],
+});

e2e/cases/assets/assets-url/src/App.jsx

@@ -1,4 +1,4 @@
-import img from '@assets/icon.png?url';
+import img from '../../../../assets/icon.png?url';
 
 function App() {
   return (

e2e/cases/print-file-size/basic/index.test.ts

@@ -243,4 +243,32 @@ test.describe('should print file size correctly', async () => {
     expect(logs.some((log) => log.includes('.js'))).toBeTruthy();
     expect(logs.some((log) => log.includes('.css'))).toBeTruthy();
   });
+
+  test('should not calculate gzip size if the asset is not compressible', async () => {
+    await build({
+      cwd,
+      rsbuildConfig: {
+        performance: {
+          printFileSize: true,
+        },
+      },
+    });
+
+    for (const log of logs) {
+      if (log.includes('File')) {
+        const lines = log.split('\n');
+        for (const line of lines) {
+          // dist/static/js/index.js should have gzip size
+          if (line.includes('.js')) {
+            expect(line.split('kB').length).toBe(3);
+          }
+
+          // dist/static/image/icon.png should not have gzip size
+          if (line.includes('.png')) {
+            expect(line.split('kB').length).toBe(2);
+          }
+        }
+      }
+    }
+  });
 });

e2e/cases/print-file-size/basic/src/App.jsx

@@ -1,5 +1,11 @@
 import './App.css';
+import img from '../../../../assets/icon.png?url';
 
-const App = () => <div id="test">Hello Rsbuild!</div>;
+const App = () => (
+  <div id="test">
+    <img src={img} alt="test" />
+    Hello Rsbuild!
+  </div>
+);
 
 export default App;

packages/core/src/plugins/fileSize.ts

@@ -81,6 +81,12 @@ const coloringAssetName = (assetName: string) => {
   return color.magenta(assetName);
 };
 
+const COMPRESSIBLE_REGEX =
+  /\.(?:js|css|html|json|svg|txt|xml|xhtml|wasm|manifest)$/i;
+
+const isCompressible = (assetName: string) =>
+  COMPRESSIBLE_REGEX.test(assetName);
+
 async function printFileSizes(
   options: PrintFileSizeOptions,
   stats: Rspack.Stats,
@@ -100,7 +106,10 @@ async function printFileSizes(
     const fileName = asset.name.split('?')[0];
     const contents = await fs.promises.readFile(path.join(distPath, fileName));
     const size = contents.length;
-    const gzippedSize = options.compressed ? await gzipSize(contents) : null;
+    const gzippedSize =
+      options.compressed && isCompressible(fileName)
+        ? await gzipSize(contents)
+        : null;
     const gzipSizeLabel = gzippedSize
       ? getAssetColor(gzippedSize)(calcFileSize(gzippedSize))
       : null;