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.

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

[TRAH-3259]: chore: add comment to pull requests with bundle size information #15172

Merged
merged 2 commits into from
May 20, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
90 changes: 83 additions & 7 deletions .github/actions/analyze/action.yml
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,9 @@ inputs:
DATADOG_SESSION_SAMPLE_RATE:
markw-deriv marked this conversation as resolved.
Show resolved Hide resolved
description: 'Datadog session sample rate'
required: false
GITHUB_TOKEN:
description: 'Github token for downloading artifacts'
required: true
GD_API_KEY:
description: 'Google drive api key'
required: false
Expand Down Expand Up @@ -58,6 +61,54 @@ inputs:
runs:
using: composite
steps:

- name: Get latest commit hash from master
id: latest_commit
shell: bash
run: |
git fetch origin master
latest_commit=$(git rev-parse origin/master)
echo "latest_commit=$latest_commit" >> $GITHUB_OUTPUT

- name: Check if previous artifact exists
env:
LATEST_COMMIT: ${{ steps.latest_commit.outputs.latest_commit }}
id: artifact_check
shell: bash
run: |
ARTIFACT_EXISTS=$(curl -s -H "Authorization: Bearer ${{ github.token }}" "https://api.github.com/repos/${{ github.repository }}/actions/artifacts?name=reports-$LATEST_COMMIT" | jq '.total_count' | awk '{print $1}')
if [[ $ARTIFACT_EXISTS -gt 0 ]]; then
echo "artifact_exists=true" >> $GITHUB_OUTPUT
else
echo "artifact_exists=false" >> $GITHUB_OUTPUT
fi

- name: Get artifact URL
id: get_artifact_url
env:
GITHUB_TOKEN: ${{ inputs.GITHUB_TOKEN }}
LATEST_COMMIT: ${{ steps.latest_commit.outputs.latest_commit }}
shell: bash
run: |
ARTIFACT_URL=$(curl -s -H "Authorization: Bearer $GITHUB_TOKEN" \
"https://api.github.com/repos/${{ github.repository }}/actions/artifacts?name=reports-${LATEST_COMMIT}" | \
jq -r '.artifacts[0].archive_download_url')
echo "artifact_url=$ARTIFACT_URL" >> $GITHUB_OUTPUT

- name: Download artifact
if: steps.get_artifact_url.outputs.artifact_url != 'null'
env:
ARTIFACT_URL: ${{ steps.get_artifact_url.outputs.artifact_url }}
GITHUB_TOKEN: ${{ inputs.GITHUB_TOKEN }}
shell: bash
run: |
curl -L -H "Authorization: Bearer $GITHUB_TOKEN" \
"$ARTIFACT_URL" \
-o artifact.zip
unzip artifact.zip -d old
cd old
unzip reports.zip

- name: Analyze all packages
env:
NODE_ENV: ${{ inputs.NODE_ENV }}
Expand All @@ -78,17 +129,42 @@ runs:
REF_NAME: ${{ inputs.REF_NAME }}
REMOTE_CONFIG_URL: ${{ inputs.REMOTE_CONFIG_URL }}
NODE_OPTIONS: "--max_old_space_size=4096"
run: npm run build:prod && npm run analyze:stats
shell: bash
run: npm run build:prod && npm run analyze:stats && npm run analyze:build

- name: Zip all stats.json files
- name: Compare report to master
id: diff
if: steps.get_artifact_url.outputs.artifact_url != 'null'
shell: bash
run: |
zip -r stats.zip packages/*/stats.json
DIFF_OUTPUT=$(node .github/workflows/compareReports.js)
echo "diff_output<<EOF" >> $GITHUB_OUTPUT
echo "$DIFF_OUTPUT" >> $GITHUB_OUTPUT
echo "EOF" >> $GITHUB_OUTPUT

- name: Comment on PR with Diff Output
if: github.event_name == 'pull_request' && steps.get_artifact_url.outputs.artifact_url != 'null'
uses: actions/github-script@v5
env:
DIFF_OUTPUT: ${{ steps.diff.outputs.diff_output }}
with:
script: |
const diffOutput = process.env.DIFF_OUTPUT;
github.rest.issues.createComment({
owner: context.repo.owner,
repo: context.repo.repo,
issue_number: context.issue.number,
body: `${diffOutput}`
});

- name: Zip all report.json files
shell: bash
run: |
zip -r reports.zip packages/*/report.json

- name: Upload stats.zip
- name: Upload reports.zip
uses: actions/upload-artifact@v4
with:
name: stats-${{ github.sha }}
path: stats.zip
retention-days: 1
name: reports-${{ github.sha }}
path: reports.zip
retention-days: 5
122 changes: 122 additions & 0 deletions .github/actions/analyze/compareReports.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,122 @@
const fs = require('fs');
const path = require('path');

function roundUpToDecimals(num, decimals) {
const factor = Math.pow(10, decimals);
return Math.ceil(num * factor) / factor;
}

function readJsonFile(filePath) {
if (fs.existsSync(filePath)) {
const data = fs.readFileSync(filePath, 'utf-8');
return JSON.parse(data);
}
return null;
}

function calculateDiff(oldSize, newSize) {
return newSize - oldSize;
}

function calculatePercentage(oldSize, newSize) {
if (oldSize === 0) {
return newSize === 0 ? 0 : 100;
}
return ((newSize - oldSize) / oldSize) * 100;
}

function formatSize(size, roundUp) {
if (size === null) {
return '-';
}

const formattedSize = roundUp ? roundUpToDecimals(size / 1024, 2) + 'kb' : (size / 1024).toFixed(2) + 'kb';
return formattedSize;
}

const packagesDir = './packages';
const oldPackagesDir = './old/packages';
const packages = [...new Set([...fs.readdirSync(packagesDir), ...fs.readdirSync(oldPackagesDir)])];

let tableRows = '';

for (const pkg of packages) {
const oldReport = readJsonFile(path.join(oldPackagesDir, pkg, 'report.json'));
const newReport = readJsonFile(path.join(packagesDir, pkg, 'report.json'));

const oldSize = oldReport ? oldReport[0].gzipSize : null;
const newSize = newReport ? newReport[0].gzipSize : null;
let diff = oldSize && newSize ? calculateDiff(oldSize, newSize) : null;

if (oldSize === null) {
diff = newSize;
}

if (newSize === null) {
diff = oldSize;
}

let diffText = '-';

if (diff !== 0) {
diffText = diff < 0 ? '-' : '+' + formatSize(diff, true);
} else {
diffText = '+0kb';
}

let percentage = oldSize && newSize ? calculatePercentage(oldSize, newSize) : null;

if (oldSize === null) {
percentage = 100;
}

if (newSize === null) {
percentage = -100;
}

let percentageText = '-';
let percentageEmoji;

if (percentage === 0) {
percentageEmoji = '';
} else if (percentage < 0) {
percentageEmoji = '🟢'; // green for decrease
markw-deriv marked this conversation as resolved.
Show resolved Hide resolved
} else if (percentage >= 0 && percentage <= 5) {
percentageEmoji = '🟡'; // yellow for small increase
} else {
percentageEmoji = '🔴'; // red for larger increase
}

if (percentage !== 0) {
percentageText = percentage.toFixed(2) + '%';
} else {
percentageText = '0%';
}

tableRows += `
<tr>
<td>${pkg}</td>
<td>${formatSize(oldSize)}</td>
<td>${formatSize(newSize)}</td>
<td>${diffText}</td>
<td>${percentageText} ${percentageEmoji}</td>
</tr>
`.trim();
}

console.log(
`
<table>
<thead>
<th>package</th>
<th>old</th>
<th>new</th>
<th>diff</th>
<th>percentage</th>
</thead>
<tbody>
${tableRows}
</tbody>
</table>
`.trim()
);
5 changes: 5 additions & 0 deletions .github/workflows/analyze.yml
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,15 @@ on:
branches:
- master


jobs:
build_and_test:
name: Analyze Bundle
runs-on: Runner_16cores_Deriv-app
environment: Preview
permissions:
contents: read
pull-requests: write
steps:
- name: Checkout
uses: actions/checkout@b4ffde65f46336ab88eb53be808477a3936bae11
Expand All @@ -31,6 +35,7 @@ jobs:
DATADOG_SESSION_REPLAY_SAMPLE_RATE: ${{ vars.DATADOG_SESSION_REPLAY_SAMPLE_RATE }}
DATADOG_SESSION_SAMPLE_RATE: ${{ vars.DATADOG_SESSION_SAMPLE_RATE }}
DATADOG_SESSION_SAMPLE_RATE_LOGS: ${{ vars.DATADOG_SESSION_SAMPLE_RATE_LOGS }}
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
GD_API_KEY: ${{ secrets.GD_API_KEY }}
GD_APP_ID: ${{ secrets.GD_APP_ID }}
GD_CLIENT_ID: ${{ secrets.GD_CLIENT_ID }}
Expand Down