Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Build: Write and store esbuild metafiles #29117

Merged
merged 25 commits into from
Sep 26, 2024
Merged

Build: Write and store esbuild metafiles #29117

merged 25 commits into from
Sep 26, 2024

Conversation

JReinhold
Copy link
Contributor

@JReinhold JReinhold commented Sep 13, 2024 •
edited by storybook-pr-benchmarking bot
Loading

Closes #29105

What I did

  1. Save all esbuild metafiles from all packages under bench/esbuild-metafiles
  2. Made them available as artifacts in CircleCI. See eg. https://app.circleci.com/pipelines/github/storybookjs/storybook/83887/workflows/dde373c2-a6c9-4698-8e38-623e0fb1958a/jobs/706709/artifacts
  3. Created a Bench story in the UI Storybook that inputs those metafiles to the esbuild analyzer directly in the story, by just selecting the metafile in the Control. See eg. https://635781f3500dd2c49e189caf-rjflqvpgls.chromatic.com/?path=/story/bench--es-build-analyzer&args=metafile:docs_SLASH_metafile_DOT_esm_DOT_json

image

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 77.5 MB 77.5 MB 659 B 1.21 0%
initSize 162 MB 163 MB 11.2 kB 1.34 0%
diffSize 85 MB 85 MB 10.5 kB 1.1 0%
buildSize 7.57 MB 7.57 MB 0 B -0.35 0%
buildSbAddonsSize 1.66 MB 1.66 MB 0 B - 0%
buildSbCommonSize 195 kB 195 kB 0 B - 0%
buildSbManagerSize 2.34 MB 2.34 MB 0 B 1.73 0%
buildSbPreviewSize 352 kB 352 kB 0 B - 0%
buildStaticSize 0 B 0 B 0 B - -
buildPrebuildSize 4.55 MB 4.55 MB 0 B 1.73 0%
buildPreviewSize 3.02 MB 3.02 MB 0 B -2.31 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.5s 6.3s -1s -204ms -0.9 -19%
generateTime 25.3s 20.9s -4s -355ms -0.2 -20.8%
initTime 22.7s 16.6s -6s -53ms -0.05 -36.2%
buildTime 14.4s 10.2s -4s -137ms -0.95 -40.2%
testBuildTime 0ms 0ms 0ms - -
devPreviewResponsive 6.3s 7.7s 1.3s 0.75 17.6%
devManagerResponsive 4.2s 4.9s 673ms 0.66 13.7%
devManagerHeaderVisible 758ms 875ms 117ms 0.58 13.4%
devManagerIndexVisible 800ms 927ms 127ms 0.61 13.7%
devStoryVisibleUncached 1.2s 1.2s 46ms -0.36 3.6%
devStoryVisible 799ms 928ms 129ms 0.65 13.9%
devAutodocsVisible 661ms 740ms 79ms -0.09 10.7%
devMDXVisible 625ms 686ms 61ms -0.36 8.9%
buildManagerHeaderVisible 677ms 752ms 75ms -0.27 10%
buildManagerIndexVisible 678ms 760ms 82ms -0.44 10.8%
buildStoryVisible 738ms 828ms 90ms -0.09 10.9%
buildAutodocsVisible 617ms 982ms 365ms 2.77 🔺37.2%
buildMDXVisible 624ms 685ms 61ms -0.26 8.9%

Greptile Summary

This PR implements the saving and storing of esbuild metafiles, enhancing build analysis capabilities for Storybook.

  • Added functionality to save esbuild metafiles in bench/esbuild-metafiles directory
  • Created a new Storybook story (bench.stories.tsx) for visualizing and analyzing metafiles using the esbuild analyzer
  • Modified CircleCI configuration to store metafiles as artifacts for easier access
  • Updated build scripts in prep.ts, addon-bundle.ts, and bundle.ts to generate and save metafiles
  • Added metafile output configuration in nx.json for improved build process analysis

@JReinhold JReinhold linked an issue Sep 13, 2024 that may be closed by this pull request
Save ESBuild metafiles and make them available from CI #29105
Closed
@JReinhold JReinhold self-assigned this Sep 13, 2024
@JReinhold JReinhold added ci:normal build Internal-facing build tooling & test updates labels Sep 13, 2024
@nx-cloud Nx Cloud
Copy link

nx-cloud bot commented Sep 13, 2024 •
edited
Loading

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 0266e9e. 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

Sent with 💌 from NxCloud.

@JReinhold JReinhold marked this pull request as ready for review September 17, 2024 14:14
greptile-apps[bot]
greptile-apps bot reviewed Sep 17, 2024
View reviewed changes
Copy link
Contributor

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

9 file(s) reviewed, 2 comment(s)
Edit PR Review Bot Settings

code/.storybook/bench.stories.tsx Show resolved Hide resolved
scripts/prepare/bundle.ts Outdated Show resolved Hide resolved
JReinhold
JReinhold commented Sep 25, 2024
View reviewed changes
.circleci/config.yml Outdated Show resolved Hide resolved
@JReinhold
Merge branch '29105-save-esbuild-metafiles-and-make-them-available-fr…
f02e568 
…om-ci' of github.com:storybookjs/storybook into 29105-save-esbuild-metafiles-and-make-them-available-from-ci
@JReinhold JReinhold merged commit be1b97e into next Sep 26, 2024
56 checks passed
@JReinhold JReinhold deleted the 29105-save-esbuild-metafiles-and-make-them-available-from-ci branch September 26, 2024 13:37
@github-actions github-actions bot mentioned this pull request Sep 26, 2024
Merged
10 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@greptile-apps greptile-apps[bot] greptile-apps[bot] left review comments

@ndelangen ndelangen ndelangen approved these changes

@kasperpeulen kasperpeulen kasperpeulen approved these changes

Assignees

@JReinhold JReinhold

Labels
build Internal-facing build tooling & test updates ci:normal
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Save ESBuild metafiles and make them available from CI
3 participants
@JReinhold @kasperpeulen @ndelangen