Skip to content

Webpack — alert on bundle-size growth in PRs

Someone added `import * from 'lodash'` — the bundle grew 70 KB. CI passed (tests OK), but first user load got 300 ms slower. Catch in CI before merge.

Recipe

bash
#!/usr/bin/env bash
# .github/workflows/bundle-size.yml step:
# - run: /opt/bundle-size-check.sh

# Save baseline once on main:
#   webpack --json > stats.json && jq '[.assets[] | select(.name|endswith(".js")) | .size] | add' stats.json > .bundle-baseline

DIFF_PCT=${DIFF_PCT:-5}               # alert above 5 % growth

webpack --mode=production --json > /tmp/stats.json 2>/dev/null
NEW=$(jq '[.assets[] | select(.name|endswith(".js")) | .size] | add' /tmp/stats.json)
OLD=$(cat .bundle-baseline 2>/dev/null || echo 0)
[ "$OLD" -eq 0 ] && exit 0            # first run, no baseline

GROWTH=$(( (NEW - OLD) * 100 / OLD ))
if [ "$GROWTH" -gt "$DIFF_PCT" ]; then
  KB_NEW=$((NEW / 1024))
  KB_OLD=$((OLD / 1024))
  curl -fsS "$HEARTBEAT_URL" --data "bundle_growth_pct=$GROWTH,new_kb=$KB_NEW,old_kb=$KB_OLD"
  exit 2
fi
echo "OK (growth=${GROWTH}%)"

Same thing in Enterno.io

Wire to an Enterno heartbeat in CI — every PR is checked for bundle rise, regressions are blocked before merge.

Set up API monitor → ← All recipes

Related recipes