-
Notifications
You must be signed in to change notification settings - Fork 105
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.
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
added bundle size tracking for UI #651
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change | ||||
---|---|---|---|---|---|---|
@@ -0,0 +1,129 @@ | ||||||
# Copyright (c) HashiCorp, Inc. | ||||||
# SPDX-License-Identifier: MPL-2.0 | ||||||
|
||||||
name: 'Next.js Bundle Analysis' | ||||||
|
||||||
on: | ||||||
pull_request: | ||||||
push: | ||||||
branches: | ||||||
- main # change this if your default branch is named differently | ||||||
workflow_dispatch: | ||||||
|
||||||
defaults: | ||||||
run: | ||||||
# change this if your nextjs app does not live at the root of the repo | ||||||
working-directory: ui | ||||||
|
||||||
permissions: | ||||||
contents: read # for checkout repository | ||||||
actions: read # for fetching base branch bundle stats | ||||||
pull-requests: write # for comments | ||||||
|
||||||
jobs: | ||||||
analyze: | ||||||
runs-on: ubuntu-latest | ||||||
steps: | ||||||
- uses: actions/checkout@v3 | ||||||
|
||||||
- name: Install Node.js | ||||||
uses: actions/setup-node@v3 | ||||||
with: | ||||||
node-version: 18 | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
Suggested change
|
||||||
|
||||||
- name: Install dependencies | ||||||
uses: bahmutov/npm-install@v1 | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Looks like this handles caching, should use it on other ui gh actions |
||||||
|
||||||
# If pnpm is used, you need to switch the previous step with the following one. pnpm does not create a package-lock.json | ||||||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. remove |
||||||
# so the step above will fail to pull dependencies | ||||||
# - uses: pnpm/action-setup@v2 | ||||||
# name: Install pnpm | ||||||
# id: pnpm-install | ||||||
# with: | ||||||
# version: 7 | ||||||
# run_install: true | ||||||
|
||||||
- name: Restore next build | ||||||
uses: actions/cache@v3 | ||||||
id: restore-build-cache | ||||||
env: | ||||||
cache-name: cache-next-build | ||||||
with: | ||||||
# if you use a custom build directory, replace all instances of `.next` in this file with your build directory | ||||||
# ex: if your app builds to `dist`, replace `.next` with `dist` | ||||||
path: .next/cache | ||||||
# change this if you prefer a more strict cache | ||||||
key: ${{ runner.os }}-build-${{ env.cache-name }} | ||||||
|
||||||
- name: Build next.js app | ||||||
# change this if your site requires a custom build command | ||||||
run: ./node_modules/.bin/next build | ||||||
|
||||||
# Here's the first place where next-bundle-analysis' own script is used | ||||||
# This step pulls the raw bundle stats for the current bundle | ||||||
- name: Analyze bundle | ||||||
run: npx -p nextjs-bundle-analysis report | ||||||
|
||||||
- name: Upload bundle | ||||||
uses: actions/upload-artifact@v3 | ||||||
with: | ||||||
name: bundle | ||||||
path: .next/analyze/__bundle_analysis.json | ||||||
|
||||||
- name: Download base branch bundle stats | ||||||
uses: dawidd6/action-download-artifact@v2 | ||||||
if: success() && github.event.number | ||||||
with: | ||||||
workflow: nextjs_bundle_analysis.yml | ||||||
branch: ${{ github.event.pull_request.base.ref }} | ||||||
path: .next/analyze/base | ||||||
|
||||||
# And here's the second place - this runs after we have both the current and | ||||||
# base branch bundle stats, and will compare them to determine what changed. | ||||||
# There are two configurable arguments that come from package.json: | ||||||
# | ||||||
# - budget: optional, set a budget (bytes) against which size changes are measured | ||||||
# it's set to 350kb here by default, as informed by the following piece: | ||||||
# https://infrequently.org/2021/03/the-performance-inequality-gap/ | ||||||
# | ||||||
# - red-status-percentage: sets the percent size increase where you get a red | ||||||
# status indicator, defaults to 20% | ||||||
# | ||||||
# Either of these arguments can be changed or removed by editing the `nextBundleAnalysis` | ||||||
# entry in your package.json file. | ||||||
- name: Compare with base branch bundle | ||||||
if: success() && github.event.number | ||||||
run: ls -laR .next/analyze/base && npx -p nextjs-bundle-analysis compare | ||||||
|
||||||
- name: Get Comment Body | ||||||
id: get-comment-body | ||||||
if: success() && github.event.number | ||||||
# https://docs.github.com/en/actions/using-workflows/workflow-commands-for-github-actions#multiline-strings | ||||||
run: | | ||||||
echo "body<<EOF" >> $GITHUB_OUTPUT | ||||||
echo "$(cat .next/analyze/__bundle_analysis_comment.txt)" >> $GITHUB_OUTPUT | ||||||
echo EOF >> $GITHUB_OUTPUT | ||||||
|
||||||
- name: Find Comment | ||||||
uses: peter-evans/find-comment@v2 | ||||||
if: success() && github.event.number | ||||||
id: fc | ||||||
with: | ||||||
issue-number: ${{ github.event.number }} | ||||||
body-includes: '<!-- __NEXTJS_BUNDLE -->' | ||||||
|
||||||
- name: Create Comment | ||||||
uses: peter-evans/create-or-update-comment@v2 | ||||||
if: success() && github.event.number && steps.fc.outputs.comment-id == 0 | ||||||
with: | ||||||
issue-number: ${{ github.event.number }} | ||||||
body: ${{ steps.get-comment-body.outputs.body }} | ||||||
|
||||||
- name: Update Comment | ||||||
uses: peter-evans/create-or-update-comment@v2 | ||||||
if: success() && github.event.number && steps.fc.outputs.comment-id != 0 | ||||||
with: | ||||||
issue-number: ${{ github.event.number }} | ||||||
body: ${{ steps.get-comment-body.outputs.body }} | ||||||
comment-id: ${{ steps.fc.outputs.comment-id }} | ||||||
edit-mode: replace |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.