fix(@angular/build): format sizes using decimal byte units consistently

Ensure that file sizes are consistently formatted using decimal byte units, adhering to the International System of Units (SI) convention. This aligns with clarity and standardization across the project.

- Kilobyte (kB): 10^3 bytes (1000 bytes)
- Megabyte (MB): 10^6 bytes (1,000,000 bytes)
- Gigabyte (GB): 10^9 bytes (1,000,000,000 bytes)

Closes: #27580
(cherry picked from commit 9e13a8b)

packages/angular/build/src/utils/bundle-calculator_spec.ts

@@ -8,7 +8,7 @@
 
 import { BudgetEntry, BudgetType, ThresholdSeverity, checkBudgets } from './bundle-calculator';
 
-const KB = 1024;
+const kB = 1000;
 
 describe('bundle-calculator', () => {
  describe('checkBudgets()', () => {
@@ -24,11 +24,11 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.js',
- size: 1.5 * KB,
+ size: 1.5 * kB,
  },
  {
  name: 'bar.js',
- size: 0.5 * KB,
+ size: 0.5 * kB,
  },
  ],
  };
@@ -55,11 +55,11 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.js',
- size: 1.5 * KB,
+ size: 1.5 * kB,
  },
  {
  name: 'bar.js',
- size: 0.5 * KB,
+ size: 0.5 * kB,
  },
  ],
  };
@@ -93,11 +93,11 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.js',
- size: 0.75 * KB,
+ size: 0.75 * kB,
  },
  {
  name: 'bar.js',
- size: 0.75 * KB,
+ size: 0.75 * kB,
  },
  ],
  };
@@ -131,11 +131,11 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.js',
- size: 0.5 * KB,
+ size: 0.5 * kB,
  },
  {
  name: 'bar.js',
- size: 0.75 * KB,
+ size: 0.75 * kB,
  },
  ],
  };
@@ -169,15 +169,15 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.js',
- size: 0.75 * KB,
+ size: 0.75 * kB,
  },
  {
  name: 'bar.js',
- size: 0.75 * KB,
+ size: 0.75 * kB,
  },
  {
  name: 'baz.css',
- size: 1.5 * KB,
+ size: 1.5 * kB,
  },
  ],
  };
@@ -211,11 +211,11 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.js',
- size: 0.75 * KB,
+ size: 0.75 * kB,
  },
  {
  name: 'bar.css',
- size: 0.75 * KB,
+ size: 0.75 * kB,
  },
  ],
  };
@@ -249,11 +249,11 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.css',
- size: 1.5 * KB,
+ size: 1.5 * kB,
  },
  {
  name: 'bar.js',
- size: 0.5 * KB,
+ size: 0.5 * kB,
  },
  ],
  };
@@ -282,11 +282,11 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.js',
- size: 1.5 * KB,
+ size: 1.5 * kB,
  },
  {
  name: 'bar.js',
- size: 0.5 * KB,
+ size: 0.5 * kB,
  },
  ],
  };
@@ -320,11 +320,11 @@ describe('bundle-calculator', () => {
  assets: [
  {
  name: 'foo.ext',
- size: 1.5 * KB,
+ size: 1.5 * kB,
  },
  {
  name: 'bar.ext',
- size: 0.5 * KB,
+ size: 0.5 * kB,
  },
  ],
  };

packages/angular/build/src/utils/format-bytes.ts

@@ -12,8 +12,8 @@ export function formatSize(size: number): string {
  }
 
  const abbreviations = ['bytes', 'kB', 'MB', 'GB'];
- const index = Math.floor(Math.log(size) / Math.log(1024));
- const roundedSize = size / Math.pow(1024, index);
+ const index = Math.floor(Math.log(size) / Math.log(1000));
+ const roundedSize = size / Math.pow(1000, index);
  // bytes don't have a fraction
  const fractionDigits = index === 0 ? 0 : 2;
 

packages/angular/build/src/utils/format-bytes_spec.ts

@@ -0,0 +1,27 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import { formatSize } from './format-bytes';
+
+describe('formatSize', () => {
+ it('1000 bytes to be 1kB', () => {
+ expect(formatSize(1000)).toBe('1.00 kB');
+ });
+
+ it('1_000_000 bytes to be 1MB', () => {
+ expect(formatSize(1_000_000)).toBe('1.00 MB');
+ });
+
+ it('1_500_000 bytes to be 1.5MB', () => {
+ expect(formatSize(1_500_000)).toBe('1.50 MB');
+ });
+
+ it('1_000_000_000 bytes to be 1GB', () => {
+ expect(formatSize(1_000_000_000)).toBe('1.00 GB');
+ });
+});

packages/schematics/angular/application/index.ts

@@ -194,31 +194,31 @@ function addAppToWorkspaceFile(
  }
 
  const sourceRoot = join(normalize(projectRoot), 'src');
- let budgets = [];
+ let budgets: { type: string; maximumWarning: string; maximumError: string }[] = [];
  if (options.strict) {
  budgets = [
  {
  type: 'initial',
- maximumWarning: '500kb',
- maximumError: '1mb',
+ maximumWarning: '500kB',
+ maximumError: '1MB',
  },
  {
  type: 'anyComponentStyle',
- maximumWarning: '2kb',
- maximumError: '4kb',
+ maximumWarning: '2kB',
+ maximumError: '4kB',
  },
  ];
  } else {
  budgets = [
  {
  type: 'initial',
- maximumWarning: '2mb',
- maximumError: '5mb',
+ maximumWarning: '2MB',
+ maximumError: '5MB',
  },
  {
  type: 'anyComponentStyle',
- maximumWarning: '6kb',
- maximumError: '10kb',
+ maximumWarning: '6kB',
+ maximumError: '10kB',
  },
  ];
  }