Can it recommend alternatives to heavy libraries?

Yes, it identifies problematic dependencies like Moment.js or full Lodash builds and suggests tree-shakable alternatives like date-fns or lodash-es.

Does it integrate with my CI/CD pipeline?

Yes, it includes instructions for setting up size-limit and GitHub Actions to automatically monitor bundle growth in every pull request.

Can it help me improve my Google Lighthouse score?

Yes, by reducing bundle size and implementing code-splitting, it directly improves 'Total Blocking Time' and 'Largest Contentful Paint' metrics.

How does it identify duplicate dependencies?

It leverages tools like webpack-bundle-analyzer and source-map-explorer to visualize the dependency tree and spot multiple versions of the same package.

Which bundlers are supported by this skill?

The skill provides specialized configurations for Webpack, Vite, Rollup, Next.js, and Create React App (CRA).

Bundle Size Analyzer

Name: Bundle Size Analyzer
Author: Dexploarer

byDexploarer

•

分析与监控

Optimizes JavaScript application performance by identifying large dependencies and suggesting bundle size reduction strategies for modern build tools.

Bundle Size Analyzer is a specialized capability for Claude Code designed to audit and improve web application performance. It automatically detects your build environment—whether it's Webpack, Vite, Rollup, or Next.js—and provides step-by-step instructions to visualize and reduce your bundle weight. By identifying bloated dependencies, duplicate packages, and tree-shaking failures, this skill helps developers implement advanced code-splitting patterns and size budgets to ensure fast, production-ready applications.

主要功能

01CI/CD integration for automated bundle size budgeting

02Multi-bundler support for Webpack, Vite, Rollup, and Next.js

03Automated detection of bloated and duplicate dependencies

04Step-by-step configuration for visual analysis tools

052 GitHub stars

06Actionable optimization patterns like tree shaking and lazy loading

使用场景

01Setting up performance monitoring and size limits in GitHub Actions

02Reducing initial load times for slow React or Next.js applications

03Migrating heavy legacy libraries to lightweight, modern alternatives

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add dexploarer/hyper-forge bundle-analyzer

For use in Claude.ai and ChatGPT

Download Skill