argyleink / open-props

CSS custom properties to help accelerate adaptive and consistent design.
https://open-props.style
MIT License
4.52k stars 184 forks source link

Add script to generate bundle sizes #474

Closed bjorntheart closed 4 months ago

bjorntheart commented 4 months ago

This PR fixes https://github.com/argyleink/open-props/issues/25.

To generate the bundle size report, run npm run bundle:sizes.

I've attached the generated bundle-sizes.json file as an example.

The structure of the size objects are as follows:

/**
 * @typedef {Object} Size
 * @propety {number} raw - Unminified size in bytes
 * @property {string} size - Unminified size in KiB
 * @property {string} minified - Minified size in KiB
 * @property {string} brotli - Brotli compressed minified size in KiB
 * @property {string} gzip - Gzip compressed minified size in KiB
 */

To calculate the brotli and gzip compression sizes I added two packages brotli-size and gzip-size .

@argyleink looks like I found some time to finish this after all 😅

stackblitz[bot] commented 4 months ago

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.