Repository: MetaMask/metamask-extension
Pull request #31303: chore: updating font family from euclid to centra
Author: login: georgewrmarshall
Labels: name: team-design-system
description: All issues relating to design system in Extension
name: INVALID-PR-TEMPLATE
description: PR's body doesn't match template
name: release-12.17.0
description: Issue or pull request that will be included in release 12.17.0
Created: 2025-03-25T20:31:50Z | Merged: 2025-03-28T20:36:33Z

## Description

This PR updates the default font family across the MetaMask extension from `Euclid Circular B` to `CentraNo1` to align with brand evolution updates. The changes include:

1. Updating font family declarations in SCSS and component files from 'Euclid Circular B' to the design tokens `--font-family-sans`('CentraNo1')
2. Simplifying text component styling by removing brand evolution feature flag
3. Updating SVG text elements and third party components to use CentraNo1 font family

The changes are part of the broader [brand evolution initiative](https://consensys.slack.com/archives/C1L7H42BT/p1742922214475199) to standardize typography across MetaMask products.

## Related issues

Fixes: https://github.com/MetaMask/MetaMask-planning/issues/4408

## Manual testing steps

1. Build and load the extension
2. Ensure the font files load in the network tab
3. Navigate through various screens and verify text rendering
4. Verify that all text elements are using `CentraNo1` font family
5. Check that no visual regressions have been introduced
6. Pay special attention to:
   - Headers and titles
   - Body text
   - Form inputs

## Screenshots/Recordings

### Before

Navigating around the extension with current Euclid Circular B font family in expanded and popup view

https://github.com/user-attachments/assets/48cdd000-1762-47d2-90b3-ac37827add48

https://github.com/user-attachments/assets/6422da7e-c0a9-46b6-859e-2f391aa77830

Text component in storybook with curent Euclid Circular B font family

https://github.com/user-attachments/assets/6dc74c95-9857-4bb5-85d7-e610b60e746a

### After
Navigating around the extension with updated CentraNo1 font family in expanded and popup view

https://github.com/user-attachments/assets/57c06242-5017-4356-8e5f-f7d399404408

https://github.com/user-attachments/assets/f0c8a71b-bc74-4768-a4f3-397c477157b1

Text component in storybook with updated CentraNo1 font family

https://github.com/user-attachments/assets/fee38240-3197-4b01-9a92-849398ab5926

No instances of Euclid left in codebase apart from mock e2e test urls for `snap-account-abstraction-keyring`

![Screenshot 2025-03-27 at 2 45 51 PM](https://github.com/user-attachments/assets/6fab1f49-e1ac-4466-beae-0b37b548e533)

## Pre-merge author checklist

- [x] I've followed [MetaMask Contributor Docs](https://github.com/MetaMask/contributor-docs) and [MetaMask Extension Coding Standards](https://github.com/MetaMask/metamask-extension/blob/main/.github/guidelines/CODING_GUIDELINES.md)
- [x] I've completed the PR template to the best of my ability
- [x] I've included tests (updated text component tests)
- [x] I've documented my code (updated SCSS comments and type definitions)
- [x] I've applied the right labels on the PR

## Pre-merge reviewer checklist

- [ ] I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed)
- [ ] I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots


Diff:
diff --git a/.storybook/metamask-storybook-theme.js b/.storybook/metamask-storybook-theme.js
index 685702767484..a89b8f3f37d7 100644
--- a/.storybook/metamask-storybook-theme.js
+++ b/.storybook/metamask-storybook-theme.js
@@ -2,5 +2,5 @@
 export const metamaskStorybookTheme = {
   brandTitle: 'MetaMask Storybook',
   // Typography
-  fontBase: 'Euclid Circular B, Helvetica, Arial, sans-serif',
+  fontBase: 'var(--font-family-sans)',
 };
diff --git a/package.json b/package.json
index 2cb5a10e6960..3424077e9131 100644
--- a/package.json
+++ b/package.json
@@ -266,7 +266,7 @@
     "@metamask/browser-passworder": "^4.3.0",
     "@metamask/contract-metadata": "^2.5.0",
     "@metamask/controller-utils": "^11.4.0",
-    "@metamask/design-tokens": "^5.1.0",
+    "@metamask/design-tokens": "^6.0.1",
     "@metamask/ens-controller": "^15.0.2",
     "@metamask/ens-resolver-snap": "^0.1.2",
     "@metamask/eth-json-rpc-filters": "^9.0.0",
diff --git a/ui/components/component-library/text/__snapshots__/text.test.tsx.snap b/ui/components/component-library/text/__snapshots__/text.test.tsx.snap
deleted file mode 100644
index 0fcc7b64c6bf..000000000000
--- a/ui/components/component-library/text/__snapshots__/text.test.tsx.snap
+++ /dev/null
@@ -1,71 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Text should render the Text with proper variant class name 1`] = `
-<div>
-  <h1
-    class="mm-box mm-text mm-text--display-md mm-box--color-text-default"
-  >
-    display-md
-  </h1>
-  <h2
-    class="mm-box mm-text mm-text--heading-lg mm-box--color-text-default"
-  >
-    heading-lg
-  </h2>
-  <h3
-    class="mm-box mm-text mm-text--heading-md mm-box--color-text-default"
-  >
-    heading-md
-  </h3>
-  <h4
-    class="mm-box mm-text mm-text--heading-sm mm-box--color-text-default"
-  >
-    heading-sm
-  </h4>
-  <p
-    class="mm-box mm-text mm-text--body-lg-medium mm-box--color-text-default"
-  >
-    body-lg-medium
-  </p>
-  <p
-    class="mm-box mm-text mm-text--body-md mm-box--color-text-default"
-  >
-    body-md
-  </p>
-  <p
-    class="mm-box mm-text mm-text--body-md-medium mm-box--color-text-default"
-  >
-    body-md-medium
-  </p>
-  <p
-    class="mm-box mm-text mm-text--body-md-bold mm-box--color-text-default"
-  >
-    body-md-bold
-  </p>
-  <p
-    class="mm-box mm-text mm-text--body-sm mm-box--color-text-default"
-  >
-    body-sm
-  </p>
-  <p
-    class="mm-box mm-text mm-text--body-sm-medium mm-box--color-text-default"
-  >
-    body-sm-medium
-  </p>
-  <p
-    class="mm-box mm-text mm-text--body-sm-bold mm-box--color-text-default"
-  >
-    body-sm-bold
-  </p>
-  <p
-    class="mm-box mm-text mm-text--body-xs mm-box--color-text-default"
-  >
-    body-xs
-  </p>
-  <p
-    class="mm-box mm-text mm-text--body-xs-medium mm-box--color-text-default"
-  >
-    body-xs-medium
-  </p>
-</div>
-`;
diff --git a/ui/components/component-library/text/text.scss b/ui/components/component-library/text/text.scss
index 4b5d8cbb0c76..4c690a7d1539 100644
--- a/ui/components/component-library/text/text.scss
+++ b/ui/components/component-library/text/text.scss
@@ -7,16 +7,8 @@ $text-variants: (
   body: ("xs", "xs-medium", "sm", "sm-medium", "sm-bold", "md", "md-medium", "md-bold", "lg-medium"),
 );
 
-// Brand evolution font families
-$brand-evolution-font-families: (
-  'display': 'MM Sans',
-  'heading': 'MM Sans',
-  'body': 'CentraNo1',
-);
-
 // Variable output mixin
 // screen size, type, size
-
 @mixin textVariables($type, $size) {
   font-family: var(--typography-s-#{$type}-#{$size}-font-family);
   font-weight: var(--typography-s-#{$type}-#{$size}-font-weight);
@@ -33,17 +25,6 @@ $brand-evolution-font-families: (
   }
 }
 
-// Brand evolution font mixin
-@mixin brand-evolution-font($type) {
-  $font-family: map-get($brand-evolution-font-families, $type);
-
-  font-family: $font-family, var(--font-family-sans);
-
-  @if $type == 'display' or $type == 'heading' {
-    font-weight: var(--font-weight-normal);
-  }
-}
-
 .mm-text {
   // Set default styles
   font-family: var(--font-family-sans);
@@ -61,10 +42,6 @@ $brand-evolution-font-families: (
       @each $size in $size-options {
         &-#{$size} {
           @include textVariables($type, $size);
-          // Apply brand evolution font if the brand evolution modifier class is present
-          &-brand-evo {
-            @include brand-evolution-font($type);
-          }
         }
       }
     }
@@ -108,8 +85,6 @@ $brand-evolution-font-families: (
     }
   }
 
-
-
   &--ellipsis {
     text-overflow: ellipsis;
     white-space: nowrap;
diff --git a/ui/components/component-library/text/text.stories.tsx b/ui/components/component-library/text/text.stories.tsx
index fcb8b26e475f..e085780c6f28 100644
--- a/ui/components/component-library/text/text.stories.tsx
+++ b/ui/components/component-library/text/text.stories.tsx
@@ -286,29 +286,3 @@ export const Strong: StoryFn<typeof Text> = (args) => (
     </Text>
   </>
 );
-
-export const IsBrandEvolution = (args) => (
-  <>
-    {Object.values(TextVariant).map((variant) => {
-      // Wrap TextVariant.inherit in a span to show it's inherited styles
-      if (variant === TextVariant.inherit) {
-        return (
-          <Text as="span" {...args}>
-            <Text {...args} variant={variant} key={variant}>
-              {args.children || variant}
-            </Text>
-          </Text>
-        );
-      }
-      return (
-        <Text {...args} variant={variant} key={variant}>
-          {args.children || variant}
-        </Text>
-      );
-    })}
-  </>
-);
-
-IsBrandEvolution.args = {
-  isBrandEvolution: true,
-};
diff --git a/ui/components/component-library/text/text.test.tsx b/ui/components/component-library/text/text.test.tsx
index dcda0f2c5d18..61ed5c4296c0 100644
--- a/ui/components/component-library/text/text.test.tsx
+++ b/ui/components/component-library/text/text.test.tsx
@@ -67,7 +67,7 @@ describe('Text', () => {
   });
 
   it('should render the Text with proper variant class name', () => {
-    const { getByText, container } = render(
+    const { getByText } = render(
       <>
         <Text variant={TextVariant.displayMd}>display-md</Text>
         <Text variant={TextVariant.headingLg}>heading-lg</Text>
@@ -98,88 +98,6 @@ describe('Text', () => {
     expect(getByText('body-sm-bold')).toHaveClass('mm-text--body-sm-bold');
     expect(getByText('body-xs')).toHaveClass('mm-text--body-xs');
     expect(getByText('body-xs-medium')).toHaveClass('mm-text--body-xs-medium');
-    expect(container).toMatchSnapshot();
-  });
-
-  // Brand Evolution Typography
-  it('should render the Text with proper brand evolution class name', () => {
-    const { getByText } = render(
-      <>
-        <Text variant={TextVariant.displayMd} isBrandEvolution>
-          display-md
-        </Text>
-        <Text variant={TextVariant.headingLg} isBrandEvolution>
-          heading-lg
-        </Text>
-        <Text variant={TextVariant.headingMd} isBrandEvolution>
-          heading-md
-        </Text>
-        <Text variant={TextVariant.headingSm} isBrandEvolution>
-          heading-sm
-        </Text>
-        <Text variant={TextVariant.bodyLgMedium} isBrandEvolution>
-          body-lg-medium
-        </Text>
-        <Text variant={TextVariant.bodyMd} isBrandEvolution>
-          body-md
-        </Text>
-        <Text variant={TextVariant.bodyMdMedium} isBrandEvolution>
-          body-md-medium
-        </Text>
-        <Text variant={TextVariant.bodyMdBold} isBrandEvolution>
-          body-md-bold
-        </Text>
-        <Text variant={TextVariant.bodySm} isBrandEvolution>
-          body-sm
-        </Text>
-        <Text variant={TextVariant.bodySmMedium} isBrandEvolution>
-          body-sm-medium
-        </Text>
-        <Text variant={TextVariant.bodySmBold} isBrandEvolution>
-          body-sm-bold
-        </Text>
-        <Text variant={TextVariant.bodyXs} isBrandEvolution>
-          body-xs
-        </Text>
-        <Text variant={TextVariant.bodyXsMedium} isBrandEvolution>
-          body-xs-medium
-        </Text>
-      </>,
-    );
-
-    expect(getByText('display-md')).toHaveClass(
-      'mm-text--display-md-brand-evo',
-    );
-    expect(getByText('heading-lg')).toHaveClass(
-      'mm-text--heading-lg-brand-evo',
-    );
-    expect(getByText('heading-md')).toHaveClass(
-      'mm-text--heading-md-brand-evo',
-    );
-    expect(getByText('heading-sm')).toHaveClass(
-      'mm-text--heading-sm-brand-evo',
-    );
-    expect(getByText('body-lg-medium')).toHaveClass(
-      'mm-text--body-lg-medium-brand-evo',
-    );
-    expect(getByText('body-md')).toHaveClass('mm-text--body-md-brand-evo');
-    expect(getByText('body-md-medium')).toHaveClass(
-      'mm-text--body-md-medium-brand-evo',
-    );
-    expect(getByText('body-md-bold')).toHaveClass(
-      'mm-text--body-md-bold-brand-evo',
-    );
-    expect(getByText('body-sm')).toHaveClass('mm-text--body-sm-brand-evo');
-    expect(getByText('body-sm-medium')).toHaveClass(
-      'mm-text--body-sm-medium-brand-evo',
-    );
-    expect(getByText('body-sm-bold')).toHaveClass(
-      'mm-text--body-sm-bold-brand-evo',
-    );
-    expect(getByText('body-xs')).toHaveClass('mm-text--body-xs-brand-evo');
-    expect(getByText('body-xs-medium')).toHaveClass(
-      'mm-text--body-xs-medium-brand-evo',
-    );
   });
 
   it('should render the Text with proper font weight class name', () => {
diff --git a/ui/components/component-library/text/text.tsx b/ui/components/component-library/text/text.tsx
index 3b370347622a..6cce7fdb790f 100644
--- a/ui/components/component-library/text/text.tsx
+++ b/ui/components/component-library/text/text.tsx
@@ -42,7 +42,6 @@ export const Text: TextComponent = React.forwardRef(
       ellipsis,
       className = '',
       children,
-      isBrandEvolution, // Enables Brand Evolution Typography do not use unless you are working on the brand evolution
       ...props
     }: TextProps<C>,
     ref?: PolymorphicRef<C>,
@@ -61,7 +60,6 @@ export const Text: TextComponent = React.forwardRef(
         [`mm-text--text-transform-${textTransform}`]: Boolean(textTransform),
         [`mm-text--text-align-${textAlign}`]: Boolean(textAlign),
         [`mm-text--overflow-wrap-${overflowWrap}`]: Boolean(overflowWrap),
-        [`mm-text--${variant}-brand-evo`]: Boolean(isBrandEvolution),
       },
     );
 
diff --git a/ui/components/component-library/text/text.types.ts b/ui/components/component-library/text/text.types.ts
index 68a0585d9301..400bf671dc96 100644
--- a/ui/components/component-library/text/text.types.ts
+++ b/ui/components/component-library/text/text.types.ts
@@ -134,11 +134,6 @@ export interface TextStyleUtilityProps extends StyleUtilityProps {
    * Used for long strings that can be cut off...
    */
   ellipsis?: boolean;
-  /**
-   * Enable Brand Evolution Typography
-   * Do not use unless you are working on the brand evolution
-   */
-  isBrandEvolution?: boolean;
 }
 
 export type TextProps<C extends React.ElementType> =
diff --git a/ui/components/ui/text-field/text-field.component.js b/ui/components/ui/text-field/text-field.component.js
index 0a74978973b3..d748a3c9cbad 100644
--- a/ui/components/ui/text-field/text-field.component.js
+++ b/ui/components/ui/text-field/text-field.component.js
@@ -19,12 +19,9 @@ const inputLabelBase = {
   color: 'var(--color-text-default)',
 };
 
-const fontFamily = [
-  '"Euclid Circular B"',
-  'Helvetica',
-  'Arial',
-  'sans-serif',
-].join(', ');
+const fontFamily = ['"CentraNo1"', 'Helvetica', 'Arial', 'sans-serif'].join(
+  ', ',
+);
 
 const styles = {
   materialLabel: {
diff --git a/ui/css/design-system/_typography.scss b/ui/css/design-system/_typography.scss
index 260ace9ae11f..f29195de34b3 100644
--- a/ui/css/design-system/_typography.scss
+++ b/ui/css/design-system/_typography.scss
@@ -1,6 +1,6 @@
 @use "sass:map";
 
-$font-family: 'Euclid Circular B', Helvetica, Arial, sans-serif;
+$font-family: var(--font-family-sans); // --font-family-sans from @metamask/design-tokens stylesheet
 
 $typography-variants: (
   'h1': 2.5rem,
diff --git a/ui/css/utilities/fonts.scss b/ui/css/utilities/fonts.scss
index a61ec03ad0ab..0087a51d32ac 100644
--- a/ui/css/utilities/fonts.scss
+++ b/ui/css/utilities/fonts.scss
@@ -21,34 +21,6 @@ $font-path: './fonts';
   $fa-font-path: $fa-font-path
 );
 
-@font-face {
-  font-family: 'Euclid Circular B';
-  font-style: normal;
-  font-weight: 400;
-  src: url('#{$font-path}/Euclid/EuclidCircularB-Regular-WebXL.woff2') format('woff2');
-}
-
-@font-face {
-  font-family: 'Euclid Circular B';
-  font-style: italic;
-  font-weight: 400;
-  src: url('#{$font-path}/Euclid/EuclidCircularB-RegularItalic-WebXL.woff2') format('woff2');
-}
-
-@font-face {
-  font-family: 'Euclid Circular B';
-  font-style: normal;
-  font-weight: 500;
-  src: url('#{$font-path}/Euclid/EuclidCircularB-Medium-WebXL.woff2') format('woff2');
-}
-
-@font-face {
-  font-family: 'Euclid Circular B';
-  font-style: normal;
-  font-weight: 700;
-  src: url('#{$font-path}/Euclid/EuclidCircularB-Bold-WebXL.woff2') format('woff2');
-}
-
 // Brand Evolution Font Families
 
 @font-face {
diff --git a/ui/pages/onboarding-flow/pin-extension/pin-billboard.js b/ui/pages/onboarding-flow/pin-extension/pin-billboard.js
index f777b68618cb..6499d0a407ab 100644
--- a/ui/pages/onboarding-flow/pin-extension/pin-billboard.js
+++ b/ui/pages/onboarding-flow/pin-extension/pin-billboard.js
@@ -34,7 +34,7 @@ export default function OnboardingPinBillboard() {
         fill="white"
         xmlSpace="preserve"
         style={{ whiteSpace: 'pre' }}
-        fontFamily="Euclid Circular A"
+        fontFamily="CentraNo1"
         fontSize="29"
         fontWeight="bold"
         letterSpacing="0em"
@@ -47,7 +47,7 @@ export default function OnboardingPinBillboard() {
         fill="var(--color-text-default)"
         xmlSpace="preserve"
         style={{ whiteSpace: 'pre' }}
-        fontFamily="Euclid Circular B"
+        fontFamily="CentraNo1"
         fontSize="18"
         letterSpacing="0em"
       >
@@ -65,7 +65,7 @@ export default function OnboardingPinBillboard() {
         fill="white"
         xmlSpace="preserve"
         style={{ whiteSpace: 'pre' }}
-        fontFamily="Euclid Circular A"
+        fontFamily="CentraNo1"
         fontSize="29"
         fontWeight="bold"
         letterSpacing="0em"
@@ -78,7 +78,7 @@ export default function OnboardingPinBillboard() {
         fill="var(--color-text-default)"
         xmlSpace="preserve"
         style={{ whiteSpace: 'pre' }}
-        fontFamily="Euclid Circular B"
+        fontFamily="CentraNo1"
         fontSize="18"
         letterSpacing="0em"
       >
diff --git a/yarn.lock b/yarn.lock
index f4ae44bfdca6..6637fa1424d5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5140,10 +5140,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@metamask/design-tokens@npm:^5.1.0":
-  version: 5.1.0
-  resolution: "@metamask/design-tokens@npm:5.1.0"
-  checksum: 10/84eaf9d7fd94df8bf853ab32bf1bcdfe8ef325c02ec1c2469e50a4e8818e5af34ff12ee5794a5dbc0a897711c80de2254e33df004c8f0d4772ce2d757f272896
+"@metamask/design-tokens@npm:^6.0.1":
+  version: 6.0.1
+  resolution: "@metamask/design-tokens@npm:6.0.1"
+  checksum: 10/29761650074744845551e04a701924733a4584c5c1f6099ca3c7ac5302d0ff19df697a3167034b8a70e3e5c59cb62a95c28323244583cfb3b75577e329215b7c
   languageName: node
   linkType: hard
 
@@ -27317,7 +27317,7 @@ __metadata:
     "@metamask/build-utils": "npm:^3.0.0"
     "@metamask/contract-metadata": "npm:^2.5.0"
     "@metamask/controller-utils": "npm:^11.4.0"
-    "@metamask/design-tokens": "npm:^5.1.0"
+    "@metamask/design-tokens": "npm:^6.0.1"
     "@metamask/ens-controller": "npm:^15.0.2"
     "@metamask/ens-resolver-snap": "npm:^0.1.2"
     "@metamask/eslint-config": "npm:^9.0.0"


Reviews:
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:27:45Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:29:25Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:29:52Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:30:21Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:31:08Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:31:32Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:32:03Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:35:15Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:35:46Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:36:06Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:36:21Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:36:48Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:37:07Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:37:30Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:39:57Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:48:54Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T21:51:03Z
user: login: georgewrmarshall
state: COMMENTED
author_association: CONTRIBUTOR
submitted_at: 2025-03-27T22:13:01Z
user: login: brianacnguyen
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-03-28T19:32:51Z
user: login: darkwing
state: APPROVED
author_association: CONTRIBUTOR
submitted_at: 2025-03-28T19:45:05Z

Review comments:
diff_hunk: @@ -265,7 +265,7 @@
     "@metamask/browser-passworder": "^4.3.0",
     "@metamask/contract-metadata": "^2.5.0",
     "@metamask/controller-utils": "^11.4.0",
-    "@metamask/design-tokens": "^5.1.0",
+    "@metamask/design-tokens": "^6.0.1",
path: package.json
user: login: georgewrmarshall
body: Updating design tokens to version that sets the `--font-family-sans` CSS variable to CentraNo1
```
--font-family-sans: 'CentraNo1', 'Helvetica Neue', Helvetica, Arial, sans-serif;
```
created_at: 2025-03-27T21:27:45Z
author_association: CONTRIBUTOR
diff_hunk: @@ -2,5 +2,5 @@
 export const metamaskStorybookTheme = {
   brandTitle: 'MetaMask Storybook',
   // Typography
-  fontBase: 'Euclid Circular B, Helvetica, Arial, sans-serif',
+  fontBase: 'CentraNo1, Helvetica, Arial, sans-serif',
path: .storybook/metamask-storybook-theme.js
user: login: georgewrmarshall
body: We might be able to use the `--font-family-sans` here
created_at: 2025-03-27T21:29:25Z
author_association: CONTRIBUTOR
diff_hunk: @@ -7,16 +7,8 @@ $text-variants: (
   body: ("xs", "xs-medium", "sm", "sm-medium", "sm-bold", "md", "md-medium", "md-bold", "lg-medium"),
 );
 
-// Brand evolution font families
-$brand-evolution-font-families: (
-  'display': 'MM Sans',
-  'heading': 'MM Sans',
-  'body': 'CentraNo1',
-);
path: ui/components/component-library/text/text.scss
user: login: georgewrmarshall
body: No longer needed as all Text component variants will use the brand evolution font `CentraNo1`
created_at: 2025-03-27T21:29:52Z
author_association: CONTRIBUTOR
diff_hunk: @@ -33,17 +25,6 @@ $brand-evolution-font-families: (
   }
 }
 
-// Brand evolution font mixin
-@mixin brand-evolution-font($type) {
-  $font-family: map-get($brand-evolution-font-families, $type);
-
-  font-family: $font-family, var(--font-family-sans);
-
-  @if $type == 'display' or $type == 'heading' {
-    font-weight: var(--font-weight-normal);
-  }
-}
path: ui/components/component-library/text/text.scss
user: login: georgewrmarshall
body: Removing the mapping of different font families to variants as we are using `CentraNo1` for all variants
created_at: 2025-03-27T21:30:20Z
author_association: CONTRIBUTOR
diff_hunk: @@ -33,17 +25,6 @@ $brand-evolution-font-families: (
   }
 }
 
-// Brand evolution font mixin
-@mixin brand-evolution-font($type) {
-  $font-family: map-get($brand-evolution-font-families, $type);
-
-  font-family: $font-family, var(--font-family-sans);
-
-  @if $type == 'display' or $type == 'heading' {
-    font-weight: var(--font-weight-normal);
-  }
-}
-
 .mm-text {
   // Set default styles
   font-family: var(--font-family-sans);
path: ui/components/component-library/text/text.scss
user: login: georgewrmarshall
body: `--font-family-sans` has been updated in `@metamask/design-tokens@6.0.1` to:
```
--font-family-sans: 'CentraNo1', 'Helvetica Neue', Helvetica, Arial, sans-serif;
```
created_at: 2025-03-27T21:31:08Z
author_association: CONTRIBUTOR
diff_hunk: @@ -61,10 +42,6 @@ $brand-evolution-font-families: (
       @each $size in $size-options {
         &-#{$size} {
           @include textVariables($type, $size);
-          // Apply brand evolution font if the brand evolution modifier class is present
-          &-brand-evo {
-            @include brand-evolution-font($type);
-          }
path: ui/components/component-library/text/text.scss
user: login: georgewrmarshall
body: Not needed
created_at: 2025-03-27T21:31:31Z
author_association: CONTRIBUTOR
diff_hunk: @@ -286,29 +286,3 @@ export const Strong: StoryFn<typeof Text> = (args) => (
     </Text>
   </>
 );
-
-export const IsBrandEvolution = (args) => (
-  <>
-    {Object.values(TextVariant).map((variant) => {
-      // Wrap TextVariant.inherit in a span to show it's inherited styles
-      if (variant === TextVariant.inherit) {
-        return (
-          <Text as="span" {...args}>
-            <Text {...args} variant={variant} key={variant}>
-              {args.children || variant}
-            </Text>
-          </Text>
-        );
-      }
-      return (
-        <Text {...args} variant={variant} key={variant}>
-          {args.children || variant}
-        </Text>
-      );
-    })}
-  </>
-);
-
-IsBrandEvolution.args = {
-  isBrandEvolution: true,
-};
path: ui/components/component-library/text/text.stories.tsx
user: login: georgewrmarshall
body: We can remove this story documenting the `isBrandEvolution` feature flag prop, as it is removed in this PR.
created_at: 2025-03-27T21:32:03Z
author_association: CONTRIBUTOR
diff_hunk: @@ -42,7 +42,6 @@ export const Text: TextComponent = React.forwardRef(
       ellipsis,
       className = '',
       children,
-      isBrandEvolution, // Enables Brand Evolution Typography do not use unless you are working on the brand evolution
path: ui/components/component-library/text/text.tsx
user: login: georgewrmarshall
body: Removing the temporary feature flag prop that enabled the earlier brand evolution typography. Everything now uses `CentraNo1`, so this is no longer required.
created_at: 2025-03-27T21:35:14Z
author_association: CONTRIBUTOR
diff_hunk: @@ -98,88 +97,6 @@ describe('Text', () => {
     expect(getByText('body-sm-bold')).toHaveClass('mm-text--body-sm-bold');
     expect(getByText('body-xs')).toHaveClass('mm-text--body-xs');
     expect(getByText('body-xs-medium')).toHaveClass('mm-text--body-xs-medium');
-    expect(container).toMatchSnapshot();
-  });
-
-  // Brand Evolution Typography
-  it('should render the Text with proper brand evolution class name', () => {
-    const { getByText } = render(
-      <>
-        <Text variant={TextVariant.displayMd} isBrandEvolution>
-          display-md
-        </Text>
-        <Text variant={TextVariant.headingLg} isBrandEvolution>
-          heading-lg
-        </Text>
-        <Text variant={TextVariant.headingMd} isBrandEvolution>
-          heading-md
-        </Text>
-        <Text variant={TextVariant.headingSm} isBrandEvolution>
-          heading-sm
-        </Text>
-        <Text variant={TextVariant.bodyLgMedium} isBrandEvolution>
-          body-lg-medium
-        </Text>
-        <Text variant={TextVariant.bodyMd} isBrandEvolution>
-          body-md
-        </Text>
-        <Text variant={TextVariant.bodyMdMedium} isBrandEvolution>
-          body-md-medium
-        </Text>
-        <Text variant={TextVariant.bodyMdBold} isBrandEvolution>
-          body-md-bold
-        </Text>
-        <Text variant={TextVariant.bodySm} isBrandEvolution>
-          body-sm
-        </Text>
-        <Text variant={TextVariant.bodySmMedium} isBrandEvolution>
-          body-sm-medium
-        </Text>
-        <Text variant={TextVariant.bodySmBold} isBrandEvolution>
-          body-sm-bold
-        </Text>
-        <Text variant={TextVariant.bodyXs} isBrandEvolution>
-          body-xs
-        </Text>
-        <Text variant={TextVariant.bodyXsMedium} isBrandEvolution>
-          body-xs-medium
-        </Text>
-      </>,
-    );
-
-    expect(getByText('display-md')).toHaveClass(
-      'mm-text--display-md-brand-evo',
-    );
-    expect(getByText('heading-lg')).toHaveClass(
-      'mm-text--heading-lg-brand-evo',
-    );
-    expect(getByText('heading-md')).toHaveClass(
-      'mm-text--heading-md-brand-evo',
-    );
-    expect(getByText('heading-sm')).toHaveClass(
-      'mm-text--heading-sm-brand-evo',
-    );
-    expect(getByText('body-lg-medium')).toHaveClass(
-      'mm-text--body-lg-medium-brand-evo',
-    );
-    expect(getByText('body-md')).toHaveClass('mm-text--body-md-brand-evo');
-    expect(getByText('body-md-medium')).toHaveClass(
-      'mm-text--body-md-medium-brand-evo',
-    );
-    expect(getByText('body-md-bold')).toHaveClass(
-      'mm-text--body-md-bold-brand-evo',
-    );
-    expect(getByText('body-sm')).toHaveClass('mm-text--body-sm-brand-evo');
-    expect(getByText('body-sm-medium')).toHaveClass(
-      'mm-text--body-sm-medium-brand-evo',
-    );
-    expect(getByText('body-sm-bold')).toHaveClass(
-      'mm-text--body-sm-bold-brand-evo',
-    );
-    expect(getByText('body-xs')).toHaveClass('mm-text--body-xs-brand-evo');
-    expect(getByText('body-xs-medium')).toHaveClass(
-      'mm-text--body-xs-medium-brand-evo',
-    );
path: ui/components/component-library/text/text.test.tsx
user: login: georgewrmarshall
body: Removing snapshot test and `isBrandEvolution` feature flag prop test as we are removing the `isBrandEvolution` prop in this PR
created_at: 2025-03-27T21:35:46Z
author_association: CONTRIBUTOR
diff_hunk: @@ -61,7 +60,6 @@ export const Text: TextComponent = React.forwardRef(
         [`mm-text--text-transform-${textTransform}`]: Boolean(textTransform),
         [`mm-text--text-align-${textAlign}`]: Boolean(textAlign),
         [`mm-text--overflow-wrap-${overflowWrap}`]: Boolean(overflowWrap),
-        [`mm-text--${variant}-brand-evo`]: Boolean(isBrandEvolution),
path: ui/components/component-library/text/text.tsx
user: login: georgewrmarshall
body: Removing brand evolution classname 
created_at: 2025-03-27T21:36:05Z
author_association: CONTRIBUTOR
diff_hunk: @@ -134,11 +134,6 @@ export interface TextStyleUtilityProps extends StyleUtilityProps {
    * Used for long strings that can be cut off...
    */
   ellipsis?: boolean;
-  /**
-   * Enable Brand Evolution Typography
-   * Do not use unless you are working on the brand evolution
-   */
-  isBrandEvolution?: boolean;
path: ui/components/component-library/text/text.types.ts
user: login: georgewrmarshall
body: Removing the temporary brand evolution feature flag prop from types
created_at: 2025-03-27T21:36:20Z
author_association: CONTRIBUTOR
diff_hunk: @@ -19,12 +19,9 @@ const inputLabelBase = {
   color: 'var(--color-text-default)',
 };
 
-const fontFamily = [
-  '"Euclid Circular B"',
-  'Helvetica',
-  'Arial',
-  'sans-serif',
-].join(', ');
+const fontFamily = ['"CentraNo1"', 'Helvetica', 'Arial', 'sans-serif'].join(
+  ', ',
+);
path: ui/components/ui/text-field/text-field.component.js
user: login: georgewrmarshall
body: Updating Material UI text field component to use Centra instead of Euclid
created_at: 2025-03-27T21:36:48Z
author_association: CONTRIBUTOR
diff_hunk: @@ -1,6 +1,6 @@
 @use "sass:map";
 
-$font-family: 'Euclid Circular B', Helvetica, Arial, sans-serif;
+$font-family: 'CentraNo1', Helvetica, Arial, sans-serif;
path: ui/css/design-system/_typography.scss
user: login: georgewrmarshall
body: Updating default font family variable to use CentraNo1 instead of Euclid
created_at: 2025-03-27T21:37:07Z
author_association: CONTRIBUTOR
diff_hunk: @@ -21,34 +21,6 @@ $font-path: './fonts';
   $fa-font-path: $fa-font-path
 );
 
-@font-face {
-  font-family: 'Euclid Circular B';
-  font-style: normal;
-  font-weight: 400;
-  src: url('#{$font-path}/Euclid/EuclidCircularB-Regular-WebXL.woff2') format('woff2');
-}
-
-@font-face {
-  font-family: 'Euclid Circular B';
-  font-style: italic;
-  font-weight: 400;
-  src: url('#{$font-path}/Euclid/EuclidCircularB-RegularItalic-WebXL.woff2') format('woff2');
-}
-
-@font-face {
-  font-family: 'Euclid Circular B';
-  font-style: normal;
-  font-weight: 500;
-  src: url('#{$font-path}/Euclid/EuclidCircularB-Medium-WebXL.woff2') format('woff2');
-}
-
-@font-face {
-  font-family: 'Euclid Circular B';
-  font-style: normal;
-  font-weight: 700;
-  src: url('#{$font-path}/Euclid/EuclidCircularB-Bold-WebXL.woff2') format('woff2');
-}
path: ui/css/utilities/fonts.scss
user: login: georgewrmarshall
body: Removing @font-face definitions for Euclid from SCSS
created_at: 2025-03-27T21:37:30Z
author_association: CONTRIBUTOR
diff_hunk: @@ -78,7 +78,7 @@ export default function OnboardingPinBillboard() {
         fill="var(--color-text-default)"
         xmlSpace="preserve"
         style={{ whiteSpace: 'pre' }}
-        fontFamily="Euclid Circular B"
+        fontFamily="CentraNo1"
         fontSize="18"
         letterSpacing="0em"
       >
path: ui/pages/onboarding-flow/pin-extension/pin-billboard.js
user: login: georgewrmarshall
body: ### Before

<img width="944" alt="Screenshot 2025-03-27 at 3 15 57 PM" src="https://github.com/user-attachments/assets/cbf9168b-ccda-4d5f-809c-99ae0eb5a137" />


### After

<img width="825" alt="Screenshot 2025-03-27 at 2 38 08 PM" src="https://github.com/user-attachments/assets/67a7c602-39cf-4b43-b900-6179235d08c9" />

created_at: 2025-03-27T21:39:57Z
author_association: CONTRIBUTOR
diff_hunk: @@ -2,5 +2,5 @@
 export const metamaskStorybookTheme = {
   brandTitle: 'MetaMask Storybook',
   // Typography
-  fontBase: 'Euclid Circular B, Helvetica, Arial, sans-serif',
+  fontBase: 'var(--font-family-sans)',
path: .storybook/metamask-storybook-theme.js
user: login: georgewrmarshall
body: Using the CSS variable for font family from the design tokens package
```
--font-family-sans: 'CentraNo1', 'Helvetica Neue', Helvetica, Arial, sans-serif;
```
created_at: 2025-03-27T21:48:53Z
author_association: CONTRIBUTOR
path: ui/components/component-library/text/__snapshots__/text.test.tsx.snap
user: login: georgewrmarshall
body: Removed the snapshot test in `text.test.tsx` as I think it's not needed
created_at: 2025-03-27T21:51:03Z
author_association: CONTRIBUTOR
diff_hunk: @@ -1,6 +1,6 @@
 @use "sass:map";
 
-$font-family: 'Euclid Circular B', Helvetica, Arial, sans-serif;
+$font-family: var(--font-family-sans); // --font-family-sans from @metamask/design-tokens stylesheet
path: ui/css/design-system/_typography.scss
user: login: georgewrmarshall
body: Updating sass variable to use the design tokens CSS variable 
created_at: 2025-03-27T22:13:01Z
author_association: CONTRIBUTOR

PR comments:
user: login: github-actions[bot]
created_at: 2025-03-25T20:32:06Z
body: **CLA Signature Action:** All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.
author_association: CONTRIBUTOR
user: login: metamaskbot
created_at: 2025-03-27T20:56:37Z
body: <!-- METAMASK-CODEOWNERS-BOT -->
✨ Files requiring CODEOWNER review ✨
---
🎨 @MetaMask/design-system-engineers
- `ui/components/component-library/text/__snapshots__/text.test.tsx.snap`
- `ui/components/component-library/text/text.scss`
- `ui/components/component-library/text/text.stories.tsx`
- `ui/components/component-library/text/text.test.tsx`
- `ui/components/component-library/text/text.tsx`
- `ui/components/component-library/text/text.types.ts`

🖥️ @MetaMask/wallet-ux
- `ui/css/design-system/_typography.scss`
- `ui/css/utilities/fonts.scss`
- `ui/pages/onboarding-flow/pin-extension/pin-billboard.js`


author_association: COLLABORATOR
user: login: metamaskbot
created_at: 2025-03-27T21:28:54Z
body: <details><summary>Builds ready [0835111]</summary><ul><li>builds: <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/builds/metamask-chrome-12.14.2.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/builds-mv2/metamask-firefox-12.14.2.zip">firefox</a></li>
<li>builds (flask): <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/builds-flask/metamask-flask-chrome-12.14.2-flask.0.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/builds-flask-mv2/metamask-flask-firefox-12.14.2-flask.0.zip">firefox</a></li>
<li>builds (test): <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/builds-test/metamask-chrome-12.14.2.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/builds-test-mv2/metamask-firefox-12.14.2.zip">firefox</a></li>
<li>builds (test-flask): <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/builds-test-flask/metamask-flask-chrome-12.14.2-flask.0.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/builds-test-flask-mv2/metamask-flask-firefox-12.14.2-flask.0.zip">firefox</a></li>
<li>build viz: <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/build-viz/index.html">Build System</a></li>
<li>bundle size: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14116483434/bundle-size/bundle_size.json">Bundle Size Stats</a></li>
<li>user-actions-benchmark: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14116483434/benchmarks/benchmark-chrome-browserify-userActions.json">User Actions Stats</a></li>
<li>storybook: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14116483434/storybook-build/index.html">Storybook</a></li>
<li>typescript migration: <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/ts-migration-dashboard/index.html">Dashboard</a></li>
<li><a href="https://app.circleci.com/pipelines/github/MetaMask/metamask-extension/jobs/4696398/artifacts/">all CircleCI artifacts</a></li>
<li><details>
       <summary>bundle viz:</summary>
       <ul><li>background: <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/background-8.html">8</a></li><li>common: <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-8.html">8</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-9.html">9</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-10.html">10</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-11.html">11</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-12.html">12</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-13.html">13</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/common-14.html">14</a></li><li>ui: <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-8.html">8</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-9.html">9</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-10.html">10</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-11.html">11</a>, <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/ui-12.html">12</a></li><li>content-script: <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/content-script-0.html">0</a></li><li>offscreen: <a href="https://output.circle-artifacts.com/output/job/22ae09a6-85f7-4d3f-8c34-b15e54b4eeed/artifacts/0/build-artifacts/source-map-explorer/offscreen-0.html">0</a></li></ul>
     </details></li></ul></details>

<details><summary>UI Startup Metrics (1239 ± 64 ms)</summary><table><thead><tr><th>Platform</th><th>BuildType</th><th>Page</th><th>Metric</th><th>Mean (ms)</th><th>Min (ms)</th><th>Max (ms)</th><th>Std Dev (ms)</th><th>P 75 (ms)</th><th>P 95 (ms)</th></tr></thead><tbody><tr><td rowspan="22">Chrome</td><td rowspan="11">Browserify</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">1239</td><td align="right">1098</td><td align="right">1416</td><td align="right">64</td><td align="right">1286</td><td align="right">1357</td></tr><tr><td>load</td><td align="right">1092</td><td align="right">963</td><td align="right">1257</td><td align="right">63</td><td align="right">1157</td><td align="right">983</td></tr><tr><td>domContentLoaded</td><td align="right">1086</td><td align="right">959</td><td align="right">1249</td><td align="right">63</td><td align="right">1166</td><td align="right">992</td></tr><tr><td>domInteractive</td><td align="right">17</td><td align="right">13</td><td align="right">72</td><td align="right">7</td><td align="right">16</td><td align="right">29</td></tr><tr><td>firstPaint</td><td align="right">797</td><td align="right">78</td><td align="right">1208</td><td align="right">427</td><td align="right">169</td><td align="right">279</td></tr><tr><td>backgroundConnect</td><td align="right">9</td><td align="right">6</td><td align="right">22</td><td align="right">2</td><td align="right">9</td><td align="right">10</td></tr><tr><td>firstReactRender</td><td align="right">20</td><td align="right">15</td><td align="right">44</td><td align="right">6</td><td align="right">20</td><td align="right">34</td></tr><tr><td>getState</td><td align="right">10</td><td align="right">4</td><td align="right">27</td><td align="right">6</td><td align="right">6</td><td align="right">8</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">0</td></tr><tr><td>loadScripts</td><td align="right">830</td><td align="right">715</td><td align="right">983</td><td align="right">60</td><td align="right">870</td><td align="right">939</td></tr><tr><td>setupStore</td><td align="right">7</td><td align="right">4</td><td align="right">17</td><td align="right">2</td><td align="right">7</td><td align="right">8</td></tr><tr><td rowspan="11">Webpack</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">908</td><td align="right">793</td><td align="right">1097</td><td align="right">58</td><td align="right">926</td><td align="right">942</td></tr><tr><td>load</td><td align="right">781</td><td align="right">577</td><td align="right">943</td><td align="right">62</td><td align="right">815</td><td align="right">884</td></tr><tr><td>domContentLoaded</td><td align="right">776</td><td align="right">571</td><td align="right">940</td><td align="right">62</td><td align="right">807</td><td align="right">875</td></tr><tr><td>domInteractive</td><td align="right">14</td><td align="right">12</td><td align="right">34</td><td align="right">6</td><td align="right">13</td><td align="right">32</td></tr><tr><td>firstPaint</td><td align="right">462</td><td align="right">52</td><td align="right">904</td><td align="right">333</td><td align="right">805</td><td align="right">880</td></tr><tr><td>backgroundConnect</td><td align="right">14</td><td align="right">10</td><td align="right">33</td><td align="right">4</td><td align="right">14</td><td align="right">24</td></tr><tr><td>firstReactRender</td><td align="right">13</td><td align="right">12</td><td align="right">24</td><td align="right">2</td><td align="right">13</td><td align="right">15</td></tr><tr><td>getState</td><td align="right">6</td><td align="right">4</td><td align="right">13</td><td align="right">2</td><td align="right">6</td><td align="right">8</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">0</td></tr><tr><td>loadScripts</td><td align="right">773</td><td align="right">561</td><td align="right">938</td><td align="right">61</td><td align="right">805</td><td align="right">865</td></tr><tr><td>setupStore</td><td align="right">7</td><td align="right">4</td><td align="right">13</td><td align="right">1</td><td align="right">8</td><td align="right">9</td></tr><tr><td rowspan="22">Firefox</td><td rowspan="11">Browserify</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">1370</td><td align="right">1148</td><td align="right">2021</td><td align="right">165</td><td align="right">1409</td><td align="right">1831</td></tr><tr><td>load</td><td align="right">1225</td><td align="right">1023</td><td align="right">1839</td><td align="right">155</td><td align="right">1255</td><td align="right">1674</td></tr><tr><td>domContentLoaded</td><td align="right">1225</td><td align="right">1023</td><td align="right">1838</td><td align="right">155</td><td align="right">1255</td><td align="right">1673</td></tr><tr><td>domInteractive</td><td align="right">107</td><td align="right">41</td><td align="right">217</td><td align="right">34</td><td align="right">87</td><td align="right">96</td></tr><tr><td>firstPaint</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td></tr><tr><td>backgroundConnect</td><td align="right">26</td><td align="right">17</td><td align="right">141</td><td align="right">16</td><td align="right">26</td><td align="right">40</td></tr><tr><td>firstReactRender</td><td align="right">23</td><td align="right">19</td><td align="right">51</td><td align="right">4</td><td align="right">24</td><td align="right">32</td></tr><tr><td>getState</td><td align="right">7</td><td align="right">4</td><td align="right">34</td><td align="right">3</td><td align="right">7</td><td align="right">9</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">1200</td><td align="right">1006</td><td align="right">1814</td><td align="right">152</td><td align="right">1236</td><td align="right">1641</td></tr><tr><td>setupStore</td><td align="right">6</td><td align="right">4</td><td align="right">40</td><td align="right">4</td><td align="right">6</td><td align="right">7</td></tr><tr><td rowspan="11">Webpack</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">977</td><td align="right">836</td><td align="right">1556</td><td align="right">157</td><td align="right">891</td><td align="right">978</td></tr><tr><td>load</td><td align="right">859</td><td align="right">728</td><td align="right">1347</td><td align="right">141</td><td align="right">845</td><td align="right">958</td></tr><tr><td>domContentLoaded</td><td align="right">858</td><td align="right">728</td><td align="right">1346</td><td align="right">141</td><td align="right">844</td><td align="right">958</td></tr><tr><td>domInteractive</td><td align="right">114</td><td align="right">33</td><td align="right">261</td><td align="right">34</td><td align="right">223</td><td align="right">97</td></tr><tr><td>firstPaint</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td></tr><tr><td>backgroundConnect</td><td align="right">20</td><td align="right">13</td><td align="right">84</td><td align="right">10</td><td align="right">23</td><td align="right">33</td></tr><tr><td>firstReactRender</td><td align="right">19</td><td align="right">16</td><td align="right">30</td><td align="right">2</td><td align="right">19</td><td align="right">23</td></tr><tr><td>getState</td><td align="right">7</td><td align="right">4</td><td align="right">19</td><td align="right">2</td><td align="right">7</td><td align="right">8</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">842</td><td align="right">713</td><td align="right">1317</td><td align="right">138</td><td align="right">830</td><td align="right">967</td></tr><tr><td>setupStore</td><td align="right">9</td><td align="right">4</td><td align="right">66</td><td align="right">10</td><td align="right">7</td><td align="right">8</td></tr></tbody></table></details>

<details><summary>Bundle size diffs [🚀 Bundle size reduced!]</summary><ul><li>background: 0 Bytes (0%)</li>
<li>ui: -367 Bytes (-0.01%)</li>
<li>common: -58 Bytes (0%)</li></ul></details>


author_association: COLLABORATOR
user: login: metamaskbot
created_at: 2025-03-27T22:10:18Z
body: <details><summary>Builds ready [8261916]</summary><ul><li>builds: <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/builds/metamask-chrome-12.14.2.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/builds-mv2/metamask-firefox-12.14.2.zip">firefox</a></li>
<li>builds (flask): <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/builds-flask/metamask-flask-chrome-12.14.2-flask.0.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/builds-flask-mv2/metamask-flask-firefox-12.14.2-flask.0.zip">firefox</a></li>
<li>builds (test): <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/builds-test/metamask-chrome-12.14.2.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/builds-test-mv2/metamask-firefox-12.14.2.zip">firefox</a></li>
<li>builds (test-flask): <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/builds-test-flask/metamask-flask-chrome-12.14.2-flask.0.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/builds-test-flask-mv2/metamask-flask-firefox-12.14.2-flask.0.zip">firefox</a></li>
<li>build viz: <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/build-viz/index.html">Build System</a></li>
<li>bundle size: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14117139834/bundle-size/bundle_size.json">Bundle Size Stats</a></li>
<li>user-actions-benchmark: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14117139834/benchmarks/benchmark-chrome-browserify-userActions.json">User Actions Stats</a></li>
<li>storybook: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14117139834/storybook-build/index.html">Storybook</a></li>
<li>typescript migration: <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/ts-migration-dashboard/index.html">Dashboard</a></li>
<li><a href="https://app.circleci.com/pipelines/github/MetaMask/metamask-extension/jobs/4696710/artifacts/">all CircleCI artifacts</a></li>
<li><details>
       <summary>bundle viz:</summary>
       <ul><li>background: <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/background-8.html">8</a></li><li>common: <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-8.html">8</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-9.html">9</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-10.html">10</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-11.html">11</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-12.html">12</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-13.html">13</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/common-14.html">14</a></li><li>ui: <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-8.html">8</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-9.html">9</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-10.html">10</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-11.html">11</a>, <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/ui-12.html">12</a></li><li>content-script: <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/content-script-0.html">0</a></li><li>offscreen: <a href="https://output.circle-artifacts.com/output/job/3b88ed17-7226-489c-a528-2eec8eb178c8/artifacts/0/build-artifacts/source-map-explorer/offscreen-0.html">0</a></li></ul>
     </details></li></ul></details>

<details><summary>UI Startup Metrics (1177 ± 67 ms)</summary><table><thead><tr><th>Platform</th><th>BuildType</th><th>Page</th><th>Metric</th><th>Mean (ms)</th><th>Min (ms)</th><th>Max (ms)</th><th>Std Dev (ms)</th><th>P 75 (ms)</th><th>P 95 (ms)</th></tr></thead><tbody><tr><td rowspan="22">Chrome</td><td rowspan="11">Browserify</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">1177</td><td align="right">1056</td><td align="right">1538</td><td align="right">67</td><td align="right">1217</td><td align="right">1268</td></tr><tr><td>load</td><td align="right">1024</td><td align="right">929</td><td align="right">1395</td><td align="right">62</td><td align="right">953</td><td align="right">991</td></tr><tr><td>domContentLoaded</td><td align="right">1018</td><td align="right">924</td><td align="right">1390</td><td align="right">62</td><td align="right">965</td><td align="right">998</td></tr><tr><td>domInteractive</td><td align="right">16</td><td align="right">11</td><td align="right">39</td><td align="right">5</td><td align="right">16</td><td align="right">27</td></tr><tr><td>firstPaint</td><td align="right">723</td><td align="right">79</td><td align="right">1396</td><td align="right">405</td><td align="right">274</td><td align="right">993</td></tr><tr><td>backgroundConnect</td><td align="right">10</td><td align="right">6</td><td align="right">57</td><td align="right">6</td><td align="right">8</td><td align="right">9</td></tr><tr><td>firstReactRender</td><td align="right">19</td><td align="right">14</td><td align="right">44</td><td align="right">4</td><td align="right">19</td><td align="right">30</td></tr><tr><td>getState</td><td align="right">11</td><td align="right">4</td><td align="right">32</td><td align="right">7</td><td align="right">7</td><td align="right">9</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">806</td><td align="right">723</td><td align="right">1059</td><td align="right">54</td><td align="right">829</td><td align="right">897</td></tr><tr><td>setupStore</td><td align="right">8</td><td align="right">5</td><td align="right">16</td><td align="right">2</td><td align="right">7</td><td align="right">8</td></tr><tr><td rowspan="11">Webpack</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">977</td><td align="right">743</td><td align="right">1244</td><td align="right">76</td><td align="right">976</td><td align="right">990</td></tr><tr><td>load</td><td align="right">830</td><td align="right">601</td><td align="right">984</td><td align="right">67</td><td align="right">858</td><td align="right">934</td></tr><tr><td>domContentLoaded</td><td align="right">823</td><td align="right">583</td><td align="right">972</td><td align="right">68</td><td align="right">852</td><td align="right">930</td></tr><tr><td>domInteractive</td><td align="right">16</td><td align="right">12</td><td align="right">42</td><td align="right">6</td><td align="right">14</td><td align="right">32</td></tr><tr><td>firstPaint</td><td align="right">525</td><td align="right">64</td><td align="right">977</td><td align="right">346</td><td align="right">845</td><td align="right">874</td></tr><tr><td>backgroundConnect</td><td align="right">17</td><td align="right">11</td><td align="right">53</td><td align="right">9</td><td align="right">15</td><td align="right">41</td></tr><tr><td>firstReactRender</td><td align="right">15</td><td align="right">12</td><td align="right">29</td><td align="right">4</td><td align="right">14</td><td align="right">27</td></tr><tr><td>getState</td><td align="right">7</td><td align="right">4</td><td align="right">18</td><td align="right">2</td><td align="right">7</td><td align="right">8</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">0</td></tr><tr><td>loadScripts</td><td align="right">821</td><td align="right">572</td><td align="right">971</td><td align="right">68</td><td align="right">850</td><td align="right">928</td></tr><tr><td>setupStore</td><td align="right">8</td><td align="right">5</td><td align="right">17</td><td align="right">2</td><td align="right">8</td><td align="right">9</td></tr><tr><td rowspan="22">Firefox</td><td rowspan="11">Browserify</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">1353</td><td align="right">1166</td><td align="right">1985</td><td align="right">135</td><td align="right">1396</td><td align="right">1682</td></tr><tr><td>load</td><td align="right">1217</td><td align="right">1054</td><td align="right">1775</td><td align="right">126</td><td align="right">1267</td><td align="right">1528</td></tr><tr><td>domContentLoaded</td><td align="right">1217</td><td align="right">1053</td><td align="right">1775</td><td align="right">126</td><td align="right">1266</td><td align="right">1528</td></tr><tr><td>domInteractive</td><td align="right">99</td><td align="right">35</td><td align="right">228</td><td align="right">28</td><td align="right">87</td><td align="right">97</td></tr><tr><td>firstPaint</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td></tr><tr><td>backgroundConnect</td><td align="right">25</td><td align="right">16</td><td align="right">146</td><td align="right">15</td><td align="right">25</td><td align="right">42</td></tr><tr><td>firstReactRender</td><td align="right">21</td><td align="right">18</td><td align="right">30</td><td align="right">2</td><td align="right">22</td><td align="right">27</td></tr><tr><td>getState</td><td align="right">7</td><td align="right">4</td><td align="right">40</td><td align="right">5</td><td align="right">7</td><td align="right">8</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">1193</td><td align="right">1037</td><td align="right">1754</td><td align="right">124</td><td align="right">1242</td><td align="right">1503</td></tr><tr><td>setupStore</td><td align="right">7</td><td align="right">4</td><td align="right">80</td><td align="right">9</td><td align="right">5</td><td align="right">8</td></tr><tr><td rowspan="11">Webpack</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">1008</td><td align="right">852</td><td align="right">1653</td><td align="right">172</td><td align="right">906</td><td align="right">975</td></tr><tr><td>load</td><td align="right">882</td><td align="right">735</td><td align="right">1447</td><td align="right">153</td><td align="right">809</td><td align="right">915</td></tr><tr><td>domContentLoaded</td><td align="right">882</td><td align="right">735</td><td align="right">1446</td><td align="right">153</td><td align="right">809</td><td align="right">915</td></tr><tr><td>domInteractive</td><td align="right">114</td><td align="right">35</td><td align="right">198</td><td align="right">28</td><td align="right">151</td><td align="right">97</td></tr><tr><td>firstPaint</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td></tr><tr><td>backgroundConnect</td><td align="right">21</td><td align="right">14</td><td align="right">70</td><td align="right">9</td><td align="right">22</td><td align="right">33</td></tr><tr><td>firstReactRender</td><td align="right">19</td><td align="right">16</td><td align="right">30</td><td align="right">3</td><td align="right">19</td><td align="right">25</td></tr><tr><td>getState</td><td align="right">10</td><td align="right">4</td><td align="right">78</td><td align="right">13</td><td align="right">8</td><td align="right">9</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">864</td><td align="right">719</td><td align="right">1416</td><td align="right">149</td><td align="right">797</td><td align="right">984</td></tr><tr><td>setupStore</td><td align="right">9</td><td align="right">4</td><td align="right">59</td><td align="right">9</td><td align="right">7</td><td align="right">8</td></tr></tbody></table></details>

<details><summary>Bundle size diffs [🚨 Warning! Bundle size has increased!]</summary><ul><li>background: -9.73 KiB (-0.16%)</li>
<li>ui: -2.83 KiB (-0.04%)</li>
<li>common: 107.45 KiB (1.16%)</li></ul></details>


author_association: COLLABORATOR
user: login: socket-security[bot]
created_at: 2025-03-27T22:13:52Z
body: **Updated dependencies detected.** Learn more about [Socket for GitHub ↗︎](https://socket.dev?utm_medium=gh)


| Package | New capabilities | Transitives | Size | Publisher |
|:--- |:--- |:--- |:--- |:--- |
| [npm/@metamask/design-tokens@5.1.0](https://socket.dev/npm/package/@metamask/design-tokens/overview/5.1.0) ➜ [6.0.1](https://socket.dev/npm/package/@metamask/design-tokens/overview/6.0.1) | None | <a href="https://socket.dev/npm/package/@metamask/design-tokens/dependencies/6.0.1">`0`</a> | 292 kB | <a href="https://socket.dev/npm/user/metamaskbot">metamaskbot</a> |



[**View full report↗︎**](https://socket.dev/dashboard/org/MetaMask/diff/af1ebf83-e3b1-410c-b5a6-342fb89eaa1a/26951cba-65ea-4fd1-b251-642b642fad1b)

<!-- overview-comment -->
author_association: NONE
user: login: metamaskbot
created_at: 2025-03-27T22:58:07Z
body: <details><summary>Builds ready [542b9c1]</summary><ul><li>builds: <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/builds/metamask-chrome-12.14.2.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/builds-mv2/metamask-firefox-12.14.2.zip">firefox</a></li>
<li>builds (flask): <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/builds-flask/metamask-flask-chrome-12.14.2-flask.0.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/builds-flask-mv2/metamask-flask-firefox-12.14.2-flask.0.zip">firefox</a></li>
<li>builds (test): <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/builds-test/metamask-chrome-12.14.2.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/builds-test-mv2/metamask-firefox-12.14.2.zip">firefox</a></li>
<li>builds (test-flask): <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/builds-test-flask/metamask-flask-chrome-12.14.2-flask.0.zip">chrome</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/builds-test-flask-mv2/metamask-flask-firefox-12.14.2-flask.0.zip">firefox</a></li>
<li>build viz: <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/build-viz/index.html">Build System</a></li>
<li>bundle size: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14117782471/bundle-size/bundle_size.json">Bundle Size Stats</a></li>
<li>user-actions-benchmark: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14117782471/benchmarks/benchmark-chrome-browserify-userActions.json">User Actions Stats</a></li>
<li>storybook: <a href="https://diuv6g5fj9pvx.cloudfront.net/metamask-extension/14117782471/storybook-build/index.html">Storybook</a></li>
<li>typescript migration: <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/ts-migration-dashboard/index.html">Dashboard</a></li>
<li><a href="https://app.circleci.com/pipelines/github/MetaMask/metamask-extension/jobs/4696953/artifacts/">all CircleCI artifacts</a></li>
<li><details>
       <summary>bundle viz:</summary>
       <ul><li>background: <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/background-8.html">8</a></li><li>common: <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-8.html">8</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-9.html">9</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-10.html">10</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-11.html">11</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-12.html">12</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-13.html">13</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/common-14.html">14</a></li><li>ui: <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-0.html">0</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-1.html">1</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-2.html">2</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-3.html">3</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-4.html">4</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-5.html">5</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-6.html">6</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-7.html">7</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-8.html">8</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-9.html">9</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-10.html">10</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-11.html">11</a>, <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/ui-12.html">12</a></li><li>content-script: <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/content-script-0.html">0</a></li><li>offscreen: <a href="https://output.circle-artifacts.com/output/job/9bfa501b-3422-4724-bc7d-5196b950aafa/artifacts/0/build-artifacts/source-map-explorer/offscreen-0.html">0</a></li></ul>
     </details></li></ul></details>

<details><summary>UI Startup Metrics (1202 ± 69 ms)</summary><table><thead><tr><th>Platform</th><th>BuildType</th><th>Page</th><th>Metric</th><th>Mean (ms)</th><th>Min (ms)</th><th>Max (ms)</th><th>Std Dev (ms)</th><th>P 75 (ms)</th><th>P 95 (ms)</th></tr></thead><tbody><tr><td rowspan="22">Chrome</td><td rowspan="11">Browserify</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">1202</td><td align="right">1087</td><td align="right">1427</td><td align="right">69</td><td align="right">1245</td><td align="right">1346</td></tr><tr><td>load</td><td align="right">1047</td><td align="right">947</td><td align="right">1262</td><td align="right">65</td><td align="right">956</td><td align="right">978</td></tr><tr><td>domContentLoaded</td><td align="right">1041</td><td align="right">942</td><td align="right">1256</td><td align="right">65</td><td align="right">946</td><td align="right">973</td></tr><tr><td>domInteractive</td><td align="right">16</td><td align="right">13</td><td align="right">39</td><td align="right">5</td><td align="right">16</td><td align="right">31</td></tr><tr><td>firstPaint</td><td align="right">778</td><td align="right">173</td><td align="right">1261</td><td align="right">388</td><td align="right">265</td><td align="right">979</td></tr><tr><td>backgroundConnect</td><td align="right">10</td><td align="right">6</td><td align="right">51</td><td align="right">6</td><td align="right">9</td><td align="right">10</td></tr><tr><td>firstReactRender</td><td align="right">19</td><td align="right">15</td><td align="right">44</td><td align="right">6</td><td align="right">19</td><td align="right">36</td></tr><tr><td>getState</td><td align="right">12</td><td align="right">4</td><td align="right">46</td><td align="right">9</td><td align="right">6</td><td align="right">8</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">828</td><td align="right">712</td><td align="right">1040</td><td align="right">65</td><td align="right">861</td><td align="right">923</td></tr><tr><td>setupStore</td><td align="right">8</td><td align="right">4</td><td align="right">24</td><td align="right">3</td><td align="right">7</td><td align="right">9</td></tr><tr><td rowspan="11">Webpack</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">925</td><td align="right">828</td><td align="right">1153</td><td align="right">69</td><td align="right">943</td><td align="right">965</td></tr><tr><td>load</td><td align="right">784</td><td align="right">579</td><td align="right">905</td><td align="right">63</td><td align="right">825</td><td align="right">872</td></tr><tr><td>domContentLoaded</td><td align="right">778</td><td align="right">569</td><td align="right">901</td><td align="right">63</td><td align="right">816</td><td align="right">859</td></tr><tr><td>domInteractive</td><td align="right">15</td><td align="right">12</td><td align="right">44</td><td align="right">6</td><td align="right">13</td><td align="right">32</td></tr><tr><td>firstPaint</td><td align="right">484</td><td align="right">53</td><td align="right">864</td><td align="right">340</td><td align="right">816</td><td align="right">843</td></tr><tr><td>backgroundConnect</td><td align="right">16</td><td align="right">10</td><td align="right">54</td><td align="right">8</td><td align="right">14</td><td align="right">37</td></tr><tr><td>firstReactRender</td><td align="right">14</td><td align="right">12</td><td align="right">28</td><td align="right">4</td><td align="right">13</td><td align="right">25</td></tr><tr><td>getState</td><td align="right">7</td><td align="right">4</td><td align="right">27</td><td align="right">3</td><td align="right">7</td><td align="right">8</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">776</td><td align="right">559</td><td align="right">898</td><td align="right">63</td><td align="right">814</td><td align="right">849</td></tr><tr><td>setupStore</td><td align="right">7</td><td align="right">5</td><td align="right">21</td><td align="right">2</td><td align="right">7</td><td align="right">8</td></tr><tr><td rowspan="22">Firefox</td><td rowspan="11">Browserify</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">1393</td><td align="right">1208</td><td align="right">1992</td><td align="right">145</td><td align="right">1421</td><td align="right">1769</td></tr><tr><td>load</td><td align="right">1252</td><td align="right">1085</td><td align="right">1836</td><td align="right">140</td><td align="right">1278</td><td align="right">1610</td></tr><tr><td>domContentLoaded</td><td align="right">1252</td><td align="right">1085</td><td align="right">1836</td><td align="right">140</td><td align="right">1278</td><td align="right">1610</td></tr><tr><td>domInteractive</td><td align="right">102</td><td align="right">38</td><td align="right">224</td><td align="right">31</td><td align="right">90</td><td align="right">96</td></tr><tr><td>firstPaint</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td></tr><tr><td>backgroundConnect</td><td align="right">23</td><td align="right">16</td><td align="right">54</td><td align="right">6</td><td align="right">24</td><td align="right">34</td></tr><tr><td>firstReactRender</td><td align="right">22</td><td align="right">19</td><td align="right">32</td><td align="right">2</td><td align="right">23</td><td align="right">27</td></tr><tr><td>getState</td><td align="right">7</td><td align="right">4</td><td align="right">36</td><td align="right">4</td><td align="right">7</td><td align="right">9</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">2</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">1230</td><td align="right">1069</td><td align="right">1815</td><td align="right">139</td><td align="right">1258</td><td align="right">1583</td></tr><tr><td>setupStore</td><td align="right">7</td><td align="right">4</td><td align="right">34</td><td align="right">4</td><td align="right">6</td><td align="right">7</td></tr><tr><td rowspan="11">Webpack</td><td rowspan="11">Home</td><td>uiStartup</td><td align="right">976</td><td align="right">842</td><td align="right">1457</td><td align="right">136</td><td align="right">901</td><td align="right">991</td></tr><tr><td>load</td><td align="right">858</td><td align="right">740</td><td align="right">1276</td><td align="right">123</td><td align="right">857</td><td align="right">974</td></tr><tr><td>domContentLoaded</td><td align="right">857</td><td align="right">740</td><td align="right">1276</td><td align="right">123</td><td align="right">857</td><td align="right">973</td></tr><tr><td>domInteractive</td><td align="right">116</td><td align="right">32</td><td align="right">209</td><td align="right">27</td><td align="right">141</td><td align="right">89</td></tr><tr><td>firstPaint</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td><td align="right">NaN</td></tr><tr><td>backgroundConnect</td><td align="right">19</td><td align="right">13</td><td align="right">73</td><td align="right">9</td><td align="right">20</td><td align="right">35</td></tr><tr><td>firstReactRender</td><td align="right">18</td><td align="right">16</td><td align="right">26</td><td align="right">2</td><td align="right">18</td><td align="right">23</td></tr><tr><td>getState</td><td align="right">8</td><td align="right">4</td><td align="right">67</td><td align="right">8</td><td align="right">7</td><td align="right">9</td></tr><tr><td>initialActions</td><td align="right">0</td><td align="right">0</td><td align="right">1</td><td align="right">0</td><td align="right">0</td><td align="right">1</td></tr><tr><td>loadScripts</td><td align="right">840</td><td align="right">726</td><td align="right">1243</td><td align="right">119</td><td align="right">852</td><td align="right">961</td></tr><tr><td>setupStore</td><td align="right">8</td><td align="right">4</td><td align="right">69</td><td align="right">8</td><td align="right">7</td><td align="right">8</td></tr></tbody></table></details>

<details><summary>Bundle size diffs [🚀 Bundle size reduced!]</summary><ul><li>background: 0 Bytes (0%)</li>
<li>ui: -367 Bytes (-0.01%)</li>
<li>common: -58 Bytes (0%)</li></ul></details>


author_association: COLLABORATOR