playbooks

home / skills / openclaw / skills / bundle-analyzer

bundle-analyzer skill

/skills/lxgicstudios/bundle-analyzer

This skill analyzes your bundle output, identifies heavy dependencies, and suggests optimizations to reduce size and improve performance.

npx playbooks add skill openclaw/skills --skill bundle-analyzer

Review the files below or copy the command above to add this skill to your agents.

Files (8)
SKILL.md
2.0 KB
---
name: bundle-checker
description: Analyze bundle size and get AI suggestions to reduce it. Use when your builds are getting bloated.
---

# Bundle Checker

Your bundle is 2MB and you don't know why. This tool analyzes your build output and tells you exactly what's eating up space and how to fix it.

**One command. Zero config. Just works.**

## Quick Start

```bash
npx ai-bundle-check
```

## What It Does

- Analyzes your bundle composition
- Identifies the largest dependencies
- Suggests tree-shaking opportunities
- Recommends lighter alternatives

## Usage Examples

```bash
# Analyze current project
npx ai-bundle-check

# Analyze specific directory
npx ai-bundle-check ./my-project/

# Get detailed breakdown
npx ai-bundle-check --verbose
```

## Best Practices

- **Check before shipping** - catch size regressions early
- **Consider alternatives** - moment.js vs date-fns makes a huge difference
- **Dynamic imports** - split code that isn't needed immediately
- **Monitor trends** - track bundle size in CI

## When to Use This

- Your app loads slowly and you suspect the bundle
- Adding a new dependency and want to check the impact
- Performance audit flagged JavaScript size
- CI bundle size check is failing

## Part of the LXGIC Dev Toolkit

This is one of 110+ free developer tools built by LXGIC Studios. No paywalls, no sign-ups, no API keys on free tiers. Just tools that work.

**Find more:**
- GitHub: https://github.com/LXGIC-Studios
- Twitter: https://x.com/lxgicstudios
- Substack: https://lxgicstudios.substack.com
- Website: https://lxgicstudios.com

## Requirements

No install needed. Just run with npx. Node.js 18+ recommended. Needs OPENAI_API_KEY environment variable.

```bash
npx ai-bundle-check --help
```

## How It Works

Scans your package.json and build output, identifies heavy dependencies, and sends the analysis to GPT-4o-mini. The AI knows common bundle bloat patterns and suggests specific optimizations like switching libraries or adding tree-shaking config.

## License

MIT. Free forever. Use it however you want.

Overview

This skill analyzes your JavaScript bundle and gives concrete, prioritized suggestions to reduce size. It scans build output and package metadata, highlights what’s taking space, and recommends actionable changes like swapping libraries or enabling tree-shaking. Run it with one command and minimal configuration to get fast, AI-powered guidance.

How this skill works

The tool reads your package.json and the build output (bundles, source maps) to map file sizes to dependencies and modules. It uses pattern detection for common bloat sources and sends a summarized analysis to an AI model to generate human-friendly, prioritized recommendations. Results show largest contributors, potential dynamic-import split points, and lighter alternative libraries to consider.

When to use it

  • When page load is slow and you suspect bundle bloat
  • Before shipping a release to catch size regressions
  • After adding a new dependency to measure impact
  • When a CI bundle-size check fails
  • During performance audits to get remediation steps

Best practices

  • Run the checker locally and in CI to spot regressions early
  • Inspect the top 5 largest modules first—small wins add up
  • Prefer tree-shaking-friendly libraries and ES module builds
  • Use dynamic imports to defer rarely used code
  • Consider lighter alternatives (e.g., date-fns instead of moment)

Example use cases

  • Quickly analyze a project: npx ai-bundle-check to get a breakdown and fixes
  • Run on a specific directory to inspect a library bundle: npx ai-bundle-check ./my-lib/
  • Generate a CI report to fail builds when bundle size grows
  • Use --verbose to get file-level detail and source-map mapping
  • Assess the impact of a new dependency before merging a PR

FAQ

Do I need an API key to use the AI suggestions?

Yes, an OPENAI_API_KEY environment variable is required for AI-driven recommendations.

Does it modify my code automatically?

No. It only analyzes and suggests changes; you apply optimizations manually or via your own tooling.