MetaMask / MetaMask/metamask-extension

Optimize stylesheets by minifying CSS

Open
#19,484 0 comments 0 reactions 1 assignee Claimed by @georgewrmarshall View on GitHub
team-design-system
Dominant language
TypeScript
Stars
13.2k
Forks
5.6k
Avg merge
2d 5h
Merged PRs (30d)
451

Description

### Description
Currently, it seems the extensions CSS stylesheet `index.css` is not minified and contains unnecessary whitespace, comments, and redundant code that can affect the performance of the platform. By minifying the CSS files, we can significantly reduce their file size and improve the loading time for the extension. This issue proposes implementing a minification process for the CSS files used in GitHub to optimize the platform's stylesheets.

Currently the stylesheet for the extension is `4.8mb` after running some quick experiments we should be able to get that down to ~`1.5mb`

![Screenshot 2023-06-06 at 4 00 47 PM](https://github.com/MetaMask/metamask-extension/assets/8112138/98432dc8-8251-49fd-8fbd-539473348db9)

### Technical Details
- Add minification process to the build system for the extension

### Acceptance Criteria
- Size of stylesheets have greatly reduced
- Low impact on the build time of the extension
- No visual degradation due to minification process

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.