Build: Benchmark individual package's sizes and dependencies #29356

JReinhold · 2024-10-15T09:33:51Z

What I did

Added a bench-packages script that will benchmark any or all packages' sizes and dependencies.

yarn bench-packages --help
Usage: bench-packages [options] [packages...]

Arguments:
  packages                     which packages to bench. If omitted, all packages are benched

Options:
  -b, --baseBranch <string>    The base branch to compare the results with. Requires GCP_CREDENTIALS env var
  -p, --pull-request <number>  The PR number to add compare results to. Only used together with --baseBranch
  -u, --upload                 Upload results to BigQuery. Requires GCP_CREDENTIALS env var
  -h, --help                   display help for command

Eg. yarn bench-packages --baseBranch next --pull-request 123 --upload, or yarn bench-packages @storybook/core @storybook/react to only bench a specific set of packages. Uploading results and/or comparing with base branches requires the GCP_CREDENTIALS environment variable to be set.

Checklist for Contributors

Testing

The changes in this PR are covered in the following automated tests:

stories
unit tests
integration tests
end-to-end tests

Manual testing

This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!

Documentation

Add or update documentation reflecting your changes
If you are deprecating/removing a feature, make sure to update
MIGRATION.MD

Checklist for Maintainers

When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli/src/sandbox-templates.ts
Make sure this PR contains one of the labels below:
Available labels
- bug: Internal changes that fixes incorrect behavior.
- maintenance: User-facing maintenance tasks.
- dependencies: Upgrading (sometimes downgrading) dependencies.
- build: Internal-facing build tooling & test updates. Will not show up in release changelog.
- cleanup: Minor cleanup style change. Will not show up in release changelog.
- documentation: Documentation only changes. Will not show up in release changelog.
- feature request: Introducing a new feature.
- BREAKING CHANGE: Changes that break compatibility in some way with current major version.
- other: Changes that don't fit in the above categories.

🦋 Canary release

This PR does not have a canary release associated. You can request a canary release of this pull request by mentioning the @storybookjs/core team here.

core team members can create a canary release here or locally with gh workflow run --repo storybookjs/storybook canary-release-pr.yml --field pr=<PR_NUMBER>

name	before	after	diff	z	%
createSize	0 B	0 B	0 B	-	-
generateSize	78.2 MB	78.2 MB	60 B	0.75	0%
initSize	143 MB	143 MB	46 B	1.15	0%
diffSize	65.2 MB	65.2 MB	-14 B	3.03	0%
buildSize	6.88 MB	6.88 MB	-14 B	0.42	0%
buildSbAddonsSize	1.51 MB	1.51 MB	-14 B	-0.42	0%
buildSbCommonSize	195 kB	195 kB	0 B	-	0%
buildSbManagerSize	1.9 MB	1.9 MB	0 B	0.43	0%
buildSbPreviewSize	271 kB	271 kB	0 B	-	0%
buildStaticSize	0 B	0 B	0 B	-	-
buildPrebuildSize	3.88 MB	3.88 MB	-14 B	0.42	0%
buildPreviewSize	3 MB	3 MB	0 B	0.42	0%
testBuildSize	0 B	0 B	0 B	-	-
testBuildSbAddonsSize	0 B	0 B	0 B	-	-
testBuildSbCommonSize	0 B	0 B	0 B	-	-
testBuildSbManagerSize	0 B	0 B	0 B	-	-
testBuildSbPreviewSize	0 B	0 B	0 B	-	-
testBuildStaticSize	0 B	0 B	0 B	-	-
testBuildPrebuildSize	0 B	0 B	0 B	-	-
testBuildPreviewSize	0 B	0 B	0 B	-	-

name	before	after	diff	z	%
createTime	7.3s	22.7s	15.3s	1.31	🔺67.6%
generateTime	19.9s	18.7s	-1s -213ms	-0.93	-6.5%
initTime	13.5s	12.8s	-728ms	-1.28	🔰-5.7%
buildTime	8.7s	8.5s	-201ms	-0.12	-2.4%
testBuildTime	0ms	0ms	0ms	-	-
devPreviewResponsive	5s	5.7s	658ms	-0.07	11.5%
devManagerResponsive	3.2s	3.4s	256ms	-0.27	7.3%
devManagerHeaderVisible	477ms	588ms	111ms	0.45	18.9%
devManagerIndexVisible	543ms	614ms	71ms	-0.04	11.6%
devStoryVisibleUncached	1s	938ms	-154ms	-0.28	-16.4%
devStoryVisible	508ms	610ms	102ms	0.04	16.7%
devAutodocsVisible	451ms	486ms	35ms	-0.26	7.2%
devMDXVisible	441ms	537ms	96ms	0.56	17.9%
buildManagerHeaderVisible	483ms	504ms	21ms	-0.66	4.2%
buildManagerIndexVisible	494ms	517ms	23ms	-0.66	4.4%
buildStoryVisible	484ms	499ms	15ms	-0.72	3%
buildAutodocsVisible	411ms	467ms	56ms	0.67	12%
buildMDXVisible	401ms	456ms	55ms	0.12	12.1%

Greptile Summary

Here's my concise review of the PR that adds package benchmarking functionality:

Adds a new benchmarking system to measure and compare package sizes and dependencies across branches, with support for uploading results to BigQuery and GitHub for analysis.

Added scripts/bench/bench-packages.ts implementing core benchmarking logic with size/dependency measurements and comparison thresholds
Added new bench-packages CircleCI job in .circleci/config.yml that runs after build step
Updated scripts/run-registry.ts to use async file cleanup with fs/promises instead of sync operations
Added bench-packages script and tinyexec dependency in scripts/package.json for command execution

The implementation looks solid with good error handling and configurability, though there may be some edge cases around async cleanup that could be improved.

nx-cloud · 2024-10-15T09:35:46Z

☁️ Nx Cloud Report

CI is running/has finished running commands for commit fd821a3. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this CI Pipeline Execution

✅ Successfully ran 1 target

nx run-many -t build --parallel=3

Sent with 💌 from NxCloud.

storybook-pr-benchmarking · 2024-10-22T10:25:04Z

Package Benchmarks

^{Commit: fd821a3, ran on 8 November 2024 at 08:20:09 UTC}

The following packages have significant changes to their size or dependencies:

`@storybook/addon-a11y`

	Before	After	Difference
Dependency count	0	3	🚨 +3 🚨
Self size	0 B	44 KB	🚨 +44 KB 🚨
Dependency size	0 B	2.80 MB	🚨 +2.80 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-actions`

	Before	After	Difference
Dependency count	0	7	🚨 +7 🚨
Self size	0 B	59 KB	🚨 +59 KB 🚨
Dependency size	0 B	3.22 MB	🚨 +3.22 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-backgrounds`

	Before	After	Difference
Dependency count	0	4	🚨 +4 🚨
Self size	0 B	27 KB	🚨 +27 KB 🚨
Dependency size	0 B	99 KB	🚨 +99 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-controls`

	Before	After	Difference
Dependency count	0	3	🚨 +3 🚨
Self size	0 B	260 KB	🚨 +260 KB 🚨
Dependency size	0 B	47 KB	🚨 +47 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-docs`

	Before	After	Difference
Dependency count	0	17	🚨 +17 🚨
Self size	0 B	2.20 MB	🚨 +2.20 MB 🚨
Dependency size	0 B	7.88 MB	🚨 +7.88 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-essentials`

	Before	After	Difference
Dependency count	0	36	🚨 +36 🚨
Self size	0 B	17 KB	🚨 +17 KB 🚨
Dependency size	0 B	13.83 MB	🚨 +13.83 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-mdx-gfm`

	Before	After	Difference
Dependency count	0	69	🚨 +69 🚨
Self size	0 B	4 KB	🚨 +4 KB 🚨
Dependency size	0 B	2.39 MB	🚨 +2.39 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-highlight`

	Before	After	Difference
Dependency count	0	1	🚨 +1 🚨
Self size	0 B	9 KB	🚨 +9 KB 🚨
Dependency size	0 B	5 KB	🚨 +5 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-interactions`

	Before	After	Difference
Dependency count	0	56	🚨 +56 🚨
Self size	0 B	129 KB	🚨 +129 KB 🚨
Dependency size	0 B	12.43 MB	🚨 +12.43 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-jest`

	Before	After	Difference
Dependency count	0	4	🚨 +4 🚨
Self size	0 B	38 KB	🚨 +38 KB 🚨
Dependency size	0 B	84 KB	🚨 +84 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-links`

	Before	After	Difference
Dependency count	0	4	🚨 +4 🚨
Self size	0 B	19 KB	🚨 +19 KB 🚨
Dependency size	0 B	283 KB	🚨 +283 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-measure`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	32 KB	🚨 +32 KB 🚨
Dependency size	0 B	20 KB	🚨 +20 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-onboarding`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	216 KB	🚨 +216 KB 🚨
Dependency size	0 B	235 KB	🚨 +235 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-outline`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	23 KB	🚨 +23 KB 🚨
Dependency size	0 B	32 KB	🚨 +32 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-storysource`

	Before	After	Difference
Dependency count	0	7	🚨 +7 🚨
Self size	0 B	1.89 MB	🚨 +1.89 MB 🚨
Dependency size	0 B	9.99 MB	🚨 +9.99 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/experimental-addon-test`

	Before	After	Difference
Dependency count	0	61	🚨 +61 🚨
Self size	0 B	581 KB	🚨 +581 KB 🚨
Dependency size	0 B	13.85 MB	🚨 +13.85 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-themes`

	Before	After	Difference
Dependency count	0	1	🚨 +1 🚨
Self size	0 B	18 KB	🚨 +18 KB 🚨
Dependency size	0 B	28 KB	🚨 +28 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-toolbars`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	10 KB	🚨 +10 KB 🚨
Dependency size	0 B	659 B	🚨 +659 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/addon-viewport`

	Before	After	Difference
Dependency count	0	2	🚨 +2 🚨
Self size	0 B	27 KB	🚨 +27 KB 🚨
Dependency size	0 B	67 KB	🚨 +67 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/builder-vite`

	Before	After	Difference
Dependency count	0	6	🚨 +6 🚨
Self size	0 B	457 KB	🚨 +457 KB 🚨
Dependency size	0 B	832 KB	🚨 +832 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/builder-webpack5`

	Before	After	Difference
Dependency count	0	223	🚨 +223 🚨
Self size	0 B	79 KB	🚨 +79 KB 🚨
Dependency size	0 B	29.54 MB	🚨 +29.54 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/core`

	Before	After	Difference
Dependency count	0	46	🚨 +46 🚨
Self size	0 B	19.07 MB	🚨 +19.07 MB 🚨
Dependency size	0 B	14.29 MB	🚨 +14.29 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/builder-manager`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	703 B	🚨 +703 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/channels`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	675 B	🚨 +675 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/client-logger`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	695 B	🚨 +695 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/components`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	683 B	🚨 +683 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/core-common`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	687 B	🚨 +687 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/core-events`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	4 KB	🚨 +4 KB 🚨
Dependency size	0 B	687 B	🚨 +687 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/core-server`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	687 B	🚨 +687 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/csf-tools`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	679 B	🚨 +679 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/docs-tools`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	683 B	🚨 +683 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/manager`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	671 B	🚨 +671 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/manager-api`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	687 B	🚨 +687 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/node-logger`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	687 B	🚨 +687 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preview`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	671 B	🚨 +671 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preview-api`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	687 B	🚨 +687 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/router`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	2 KB	🚨 +2 KB 🚨
Dependency size	0 B	667 B	🚨 +667 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/telemetry`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	679 B	🚨 +679 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/theming`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	2 KB	🚨 +2 KB 🚨
Dependency size	0 B	671 B	🚨 +671 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/types`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	663 B	🚨 +663 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/angular`

	Before	After	Difference
Dependency count	0	257	🚨 +257 🚨
Self size	0 B	362 KB	🚨 +362 KB 🚨
Dependency size	0 B	34.19 MB	🚨 +34.19 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/ember`

	Before	After	Difference
Dependency count	0	250	🚨 +250 🚨
Self size	0 B	22 KB	🚨 +22 KB 🚨
Dependency size	0 B	31.94 MB	🚨 +31.94 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/experimental-nextjs-vite`

	Before	After	Difference
Dependency count	0	87	🚨 +87 🚨
Self size	0 B	230 KB	🚨 +230 KB 🚨
Dependency size	0 B	31.03 MB	🚨 +31.03 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/html-vite`

	Before	After	Difference
Dependency count	0	15	🚨 +15 🚨
Self size	0 B	5 KB	🚨 +5 KB 🚨
Dependency size	0 B	1.93 MB	🚨 +1.93 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/html-webpack5`

	Before	After	Difference
Dependency count	0	233	🚨 +233 🚨
Self size	0 B	6 KB	🚨 +6 KB 🚨
Dependency size	0 B	30.09 MB	🚨 +30.09 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/nextjs`

	Before	After	Difference
Dependency count	0	587	🚨 +587 🚨
Self size	0 B	461 KB	🚨 +461 KB 🚨
Dependency size	0 B	83.64 MB	🚨 +83.64 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preact-vite`

	Before	After	Difference
Dependency count	0	13	🚨 +13 🚨
Self size	0 B	6 KB	🚨 +6 KB 🚨
Dependency size	0 B	1.33 MB	🚨 +1.33 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preact-webpack5`

	Before	After	Difference
Dependency count	0	231	🚨 +231 🚨
Self size	0 B	6 KB	🚨 +6 KB 🚨
Dependency size	0 B	29.66 MB	🚨 +29.66 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react-vite`

	Before	After	Difference
Dependency count	0	103	🚨 +103 🚨
Self size	0 B	12 KB	🚨 +12 KB 🚨
Dependency size	0 B	18.54 MB	🚨 +18.54 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react-webpack5`

	Before	After	Difference
Dependency count	0	309	🚨 +309 🚨
Self size	0 B	6 KB	🚨 +6 KB 🚨
Dependency size	0 B	40.83 MB	🚨 +40.83 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/server-webpack5`

	Before	After	Difference
Dependency count	0	241	🚨 +241 🚨
Self size	0 B	14 KB	🚨 +14 KB 🚨
Dependency size	0 B	31.07 MB	🚨 +31.07 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/svelte-vite`

	Before	After	Difference
Dependency count	0	134	🚨 +134 🚨
Self size	0 B	22 KB	🚨 +22 KB 🚨
Dependency size	0 B	36.03 MB	🚨 +36.03 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/svelte-webpack5`

	Before	After	Difference
Dependency count	0	296	🚨 +296 🚨
Self size	0 B	6 KB	🚨 +6 KB 🚨
Dependency size	0 B	37.66 MB	🚨 +37.66 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/sveltekit`

	Before	After	Difference
Dependency count	0	142	🚨 +142 🚨
Self size	0 B	47 KB	🚨 +47 KB 🚨
Dependency size	0 B	39.34 MB	🚨 +39.34 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/vue3-vite`

	Before	After	Difference
Dependency count	0	107	🚨 +107 🚨
Self size	0 B	15 KB	🚨 +15 KB 🚨
Dependency size	0 B	42.08 MB	🚨 +42.08 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/vue3-webpack5`

	Before	After	Difference
Dependency count	0	483	🚨 +483 🚨
Self size	0 B	6 KB	🚨 +6 KB 🚨
Dependency size	0 B	53.93 MB	🚨 +53.93 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/web-components-vite`

	Before	After	Difference
Dependency count	0	16	🚨 +16 🚨
Self size	0 B	5 KB	🚨 +5 KB 🚨
Dependency size	0 B	1.96 MB	🚨 +1.96 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/web-components-webpack5`

	Before	After	Difference
Dependency count	0	231	🚨 +231 🚨
Self size	0 B	5 KB	🚨 +5 KB 🚨
Dependency size	0 B	29.71 MB	🚨 +29.71 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/blocks`

	Before	After	Difference
Dependency count	0	4	🚨 +4 🚨
Self size	0 B	604 KB	🚨 +604 KB 🚨
Dependency size	0 B	1.49 MB	🚨 +1.49 MB 🚨
Bundle Size Analyzer	Link	Link

`storybook`

	Before	After	Difference
Dependency count	0	47	🚨 +47 🚨
Self size	0 B	22 KB	🚨 +22 KB 🚨
Dependency size	0 B	33.37 MB	🚨 +33.37 MB 🚨
Bundle Size Analyzer	Link	Link

`sb`

	Before	After	Difference
Dependency count	0	48	🚨 +48 🚨
Self size	0 B	1 KB	🚨 +1 KB 🚨
Dependency size	0 B	33.39 MB	🚨 +33.39 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/cli`

	Before	After	Difference
Dependency count	0	390	🚨 +390 🚨
Self size	0 B	480 KB	🚨 +480 KB 🚨
Dependency size	0 B	74.30 MB	🚨 +74.30 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/codemod`

	Before	After	Difference
Dependency count	0	270	🚨 +270 🚨
Self size	0 B	612 KB	🚨 +612 KB 🚨
Dependency size	0 B	64.29 MB	🚨 +64.29 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/core-webpack`

	Before	After	Difference
Dependency count	0	3	🚨 +3 🚨
Self size	0 B	16 KB	🚨 +16 KB 🚨
Dependency size	0 B	2.39 MB	🚨 +2.39 MB 🚨
Bundle Size Analyzer	Link	Link

`create-storybook`

	Before	After	Difference
Dependency count	0	105	🚨 +105 🚨
Self size	0 B	1.11 MB	🚨 +1.11 MB 🚨
Dependency size	0 B	42.37 MB	🚨 +42.37 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/csf-plugin`

	Before	After	Difference
Dependency count	0	3	🚨 +3 🚨
Self size	0 B	10 KB	🚨 +10 KB 🚨
Dependency size	0 B	789 KB	🚨 +789 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/instrumenter`

	Before	After	Difference
Dependency count	0	5	🚨 +5 🚨
Self size	0 B	218 KB	🚨 +218 KB 🚨
Dependency size	0 B	277 KB	🚨 +277 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react-dom-shim`

	Before	After	Difference
Dependency count	0	0	0
Self size	0 B	10 KB	🚨 +10 KB 🚨
Dependency size	0 B	795 B	🚨 +795 B 🚨
Bundle Size Analyzer	Link	Link

`@storybook/source-loader`

	Before	After	Difference
Dependency count	0	5	🚨 +5 🚨
Self size	0 B	41 KB	🚨 +41 KB 🚨
Dependency size	0 B	9.93 MB	🚨 +9.93 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/test`

	Before	After	Difference
Dependency count	0	53	🚨 +53 🚨
Self size	0 B	1.52 MB	🚨 +1.52 MB 🚨
Dependency size	0 B	8.09 MB	🚨 +8.09 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-create-react-app`

	Before	After	Difference
Dependency count	0	68	🚨 +68 🚨
Self size	0 B	18 KB	🚨 +18 KB 🚨
Dependency size	0 B	6.03 MB	🚨 +6.03 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-html-webpack`

	Before	After	Difference
Dependency count	0	93	🚨 +93 🚨
Self size	0 B	4 KB	🚨 +4 KB 🚨
Dependency size	0 B	20.16 MB	🚨 +20.16 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-preact-webpack`

	Before	After	Difference
Dependency count	0	4	🚨 +4 🚨
Self size	0 B	5 KB	🚨 +5 KB 🚨
Dependency size	0 B	2.40 MB	🚨 +2.40 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-react-webpack`

	Before	After	Difference
Dependency count	0	182	🚨 +182 🚨
Self size	0 B	24 KB	🚨 +24 KB 🚨
Dependency size	0 B	30.92 MB	🚨 +30.92 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-server-webpack`

	Before	After	Difference
Dependency count	0	20	🚨 +20 🚨
Self size	0 B	10 KB	🚨 +10 KB 🚨
Dependency size	0 B	3.84 MB	🚨 +3.84 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-svelte-webpack`

	Before	After	Difference
Dependency count	0	103	🚨 +103 🚨
Self size	0 B	14 KB	🚨 +14 KB 🚨
Dependency size	0 B	12.76 MB	🚨 +12.76 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preset-vue3-webpack`

	Before	After	Difference
Dependency count	0	366	🚨 +366 🚨
Self size	0 B	9 KB	🚨 +9 KB 🚨
Dependency size	0 B	44.86 MB	🚨 +44.86 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/html`

	Before	After	Difference
Dependency count	0	6	🚨 +6 🚨
Self size	0 B	47 KB	🚨 +47 KB 🚨
Dependency size	0 B	40 KB	🚨 +40 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/preact`

	Before	After	Difference
Dependency count	0	6	🚨 +6 🚨
Self size	0 B	23 KB	🚨 +23 KB 🚨
Dependency size	0 B	40 KB	🚨 +40 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/react`

	Before	After	Difference
Dependency count	0	6	🚨 +6 🚨
Self size	0 B	924 KB	🚨 +924 KB 🚨
Dependency size	0 B	24 KB	🚨 +24 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/server`

	Before	After	Difference
Dependency count	0	9	🚨 +9 🚨
Self size	0 B	13 KB	🚨 +13 KB 🚨
Dependency size	0 B	972 KB	🚨 +972 KB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/svelte`

	Before	After	Difference
Dependency count	0	106	🚨 +106 🚨
Self size	0 B	96 KB	🚨 +96 KB 🚨
Dependency size	0 B	10.60 MB	🚨 +10.60 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/vue3`

	Before	After	Difference
Dependency count	0	17	🚨 +17 🚨
Self size	0 B	86 KB	🚨 +86 KB 🚨
Dependency size	0 B	6.08 MB	🚨 +6.08 MB 🚨
Bundle Size Analyzer	Link	Link

`@storybook/web-components`

	Before	After	Difference
Dependency count	0	7	🚨 +7 🚨
Self size	0 B	62 KB	🚨 +62 KB 🚨
Dependency size	0 B	55 KB	🚨 +55 KB 🚨
Bundle Size Analyzer	Link	Link

…t-up-tooling-to-warnhighlight-on-regressions-in-package-size-and-dependency-graph

…ressions-in-package-size-and-dependency-graph

…-package-size-and-dependency-graph' of github.com:storybookjs/storybook into 29322-set-up-tooling-to-warnhighlight-on-regressions-in-package-size-and-dependency-graph

greptile-apps

_{4 file(s) reviewed, 9 comment(s)}
_{Edit PR Review Bot Settings | Greptile}

.circleci/config.yml

scripts/bench/bench-packages.ts

scripts/run-registry.ts

…ressions-in-package-size-and-dependency-graph

…-package-size-and-dependency-graph' of github.com:storybookjs/storybook into 29322-set-up-tooling-to-warnhighlight-on-regressions-in-package-size-and-dependency-graph

JReinhold added 5 commits October 11, 2024 22:53

initial script to bench individual packages

03dea27

use node apis instead of CLIs to rm files in run-registry script

ca5efc0

improve readability

4224e79

add circleci job for package benching

c212880

save results to file

a21f321

JReinhold linked an issue Oct 15, 2024 that may be closed by this pull request

Set up tooling to warn/highlight on regressions in package size and dependency graph #29322

Closed

JReinhold self-assigned this Oct 15, 2024

JReinhold added the ci:normal label Oct 15, 2024

JReinhold changed the title ~~29322-set-up-tooling-to-warnhighlight-on-regressions-in-package-size-and-dependency-graph~~ Build: Benchmark individual package's sizes and dependencies Oct 15, 2024

fix result path

10ec1ed

JReinhold added the build Internal-facing build tooling & test updates label Oct 15, 2024

JReinhold added 8 commits October 15, 2024 22:53

add support for comparing bench results with a base

7af86e2

cleanup

fcd2d96

start upload benches

8a40fd3

upload to BigQuery

738c6bb

compare with base branch from bigquery

caf693a

upload comparisons to github

c99cb88

better logging

00be90c

refactor comparison result structure

8b3d1cf

JReinhold and others added 9 commits October 22, 2024 12:36

fix results sent to github

6af79dd

use --json for npm install

4871e90

compare with zero when package not found in base

be33759

send raw results to github bot

de8f3d2

Merge branch 'next' of github.com:storybookjs/storybook into 29322-se…

59c4c6b

…t-up-tooling-to-warnhighlight-on-regressions-in-package-size-and-dependency-graph

fix lock-file

76079d0

Merge branch 'next' into 29322-set-up-tooling-to-warnhighlight-on-reg…

aba3a60

…ressions-in-package-size-and-dependency-graph

remove auto handling of the registry

a2a4794

Merge branch '29322-set-up-tooling-to-warnhighlight-on-regressions-in…

d11fb10

…-package-size-and-dependency-graph' of github.com:storybookjs/storybook into 29322-set-up-tooling-to-warnhighlight-on-regressions-in-package-size-and-dependency-graph

JReinhold marked this pull request as ready for review October 29, 2024 20:56

JReinhold requested a review from ndelangen October 29, 2024 20:56

greptile-apps bot reviewed Oct 29, 2024

View reviewed changes

ndelangen approved these changes Nov 5, 2024

View reviewed changes

JReinhold and others added 5 commits November 5, 2024 14:29

Merge branch 'next' into 29322-set-up-tooling-to-warnhighlight-on-reg…

3aaa3ee

…ressions-in-package-size-and-dependency-graph

fix typos

81a5d07

Merge branch '29322-set-up-tooling-to-warnhighlight-on-regressions-in…

884e9ef

…-package-size-and-dependency-graph' of github.com:storybookjs/storybook into 29322-set-up-tooling-to-warnhighlight-on-regressions-in-package-size-and-dependency-graph

run registry before package benching

a496226

wait for local registry

fd821a3

JReinhold merged commit f317144 into next Nov 8, 2024
60 checks passed

JReinhold deleted the 29322-set-up-tooling-to-warnhighlight-on-regressions-in-package-size-and-dependency-graph branch November 8, 2024 08:52

JReinhold mentioned this pull request Nov 8, 2024

CI: Fix package benchmarking failing on next #29578

Merged

8 tasks

github-actions bot mentioned this pull request Nov 11, 2024

Release: Prerelease 8.5.0-alpha.4 #29585

Merged

13 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Build: Benchmark individual package's sizes and dependencies #29356

Build: Benchmark individual package's sizes and dependencies #29356

JReinhold commented Oct 15, 2024 •

edited by storybook-pr-benchmarking bot

Loading

nx-cloud bot commented Oct 15, 2024 •

edited

Loading

storybook-pr-benchmarking bot commented Oct 22, 2024 •

edited

Loading

greptile-apps bot left a comment

Build: Benchmark individual package's sizes and dependencies #29356

Build: Benchmark individual package's sizes and dependencies #29356

Conversation

JReinhold commented Oct 15, 2024 • edited by storybook-pr-benchmarking bot Loading

What I did

Checklist for Contributors

Testing

The changes in this PR are covered in the following automated tests:

Manual testing

Documentation

Checklist for Maintainers

🦋 Canary release

Greptile Summary

nx-cloud bot commented Oct 15, 2024 • edited Loading

☁️ Nx Cloud Report

storybook-pr-benchmarking bot commented Oct 22, 2024 • edited Loading

Package Benchmarks

@storybook/addon-a11y

@storybook/addon-actions

@storybook/addon-backgrounds

@storybook/addon-controls

@storybook/addon-docs

@storybook/addon-essentials

@storybook/addon-mdx-gfm

@storybook/addon-highlight

@storybook/addon-interactions

@storybook/addon-jest

@storybook/addon-links

@storybook/addon-measure

@storybook/addon-onboarding

@storybook/addon-outline

@storybook/addon-storysource

@storybook/experimental-addon-test

@storybook/addon-themes

@storybook/addon-toolbars

@storybook/addon-viewport

@storybook/builder-vite

@storybook/builder-webpack5

@storybook/core

@storybook/builder-manager

@storybook/channels

@storybook/client-logger

@storybook/components

@storybook/core-common

@storybook/core-events

@storybook/core-server

@storybook/csf-tools

@storybook/docs-tools

@storybook/manager

@storybook/manager-api

@storybook/node-logger

@storybook/preview

@storybook/preview-api

@storybook/router

@storybook/telemetry

@storybook/theming

@storybook/types

@storybook/angular

@storybook/ember

@storybook/experimental-nextjs-vite

@storybook/html-vite

@storybook/html-webpack5

@storybook/nextjs

@storybook/preact-vite

@storybook/preact-webpack5

@storybook/react-vite

@storybook/react-webpack5

@storybook/server-webpack5

@storybook/svelte-vite

@storybook/svelte-webpack5

@storybook/sveltekit

@storybook/vue3-vite

@storybook/vue3-webpack5

@storybook/web-components-vite

@storybook/web-components-webpack5

@storybook/blocks

storybook

sb

@storybook/cli

@storybook/codemod

JReinhold commented Oct 15, 2024 •

edited by storybook-pr-benchmarking bot

Loading

nx-cloud bot commented Oct 15, 2024 •

edited

Loading

storybook-pr-benchmarking bot commented Oct 22, 2024 •

edited

Loading

`@storybook/addon-a11y`

`@storybook/addon-actions`

`@storybook/addon-backgrounds`

`@storybook/addon-controls`

`@storybook/addon-docs`

`@storybook/addon-essentials`

`@storybook/addon-mdx-gfm`

`@storybook/addon-highlight`

`@storybook/addon-interactions`

`@storybook/addon-jest`

`@storybook/addon-links`

`@storybook/addon-measure`

`@storybook/addon-onboarding`

`@storybook/addon-outline`

`@storybook/addon-storysource`

`@storybook/experimental-addon-test`

`@storybook/addon-themes`

`@storybook/addon-toolbars`

`@storybook/addon-viewport`

`@storybook/builder-vite`

`@storybook/builder-webpack5`

`@storybook/core`

`@storybook/builder-manager`

`@storybook/channels`

`@storybook/client-logger`

`@storybook/components`

`@storybook/core-common`

`@storybook/core-events`

`@storybook/core-server`

`@storybook/csf-tools`

`@storybook/docs-tools`

`@storybook/manager`

`@storybook/manager-api`

`@storybook/node-logger`

`@storybook/preview`

`@storybook/preview-api`

`@storybook/router`

`@storybook/telemetry`

`@storybook/theming`

`@storybook/types`

`@storybook/angular`

`@storybook/ember`

`@storybook/experimental-nextjs-vite`

`@storybook/html-vite`

`@storybook/html-webpack5`

`@storybook/nextjs`

`@storybook/preact-vite`

`@storybook/preact-webpack5`

`@storybook/react-vite`

`@storybook/react-webpack5`

`@storybook/server-webpack5`

`@storybook/svelte-vite`

`@storybook/svelte-webpack5`

`@storybook/sveltekit`

`@storybook/vue3-vite`

`@storybook/vue3-webpack5`

`@storybook/web-components-vite`

`@storybook/web-components-webpack5`

`@storybook/blocks`

`storybook`

`sb`

`@storybook/cli`

`@storybook/codemod`

`@storybook/core-webpack`

`create-storybook`

`@storybook/csf-plugin`

`@storybook/instrumenter`

`@storybook/react-dom-shim`

`@storybook/source-loader`

`@storybook/test`

`@storybook/preset-create-react-app`

`@storybook/preset-html-webpack`

`@storybook/preset-preact-webpack`

`@storybook/preset-react-webpack`

`@storybook/preset-server-webpack`

`@storybook/preset-svelte-webpack`

`@storybook/preset-vue3-webpack`