{"id":25238076,"url":"https://github.com/xanaawakens/bundle-size-tracker","last_synced_at":"2025-06-15T17:32:53.387Z","repository":{"id":270176810,"uuid":"909551521","full_name":"xanaawakens/bundle-size-tracker","owner":"xanaawakens","description":"To track and analyze JavaScript bundle sizes effectively across popular bundlers like Webpack, Rollup, and Vite, you can use tools and plugins designed specifically for this purpose. Here's a detailed breakdown of how to implement and manage this for each bundler:","archived":false,"fork":false,"pushed_at":"2025-02-28T18:29:48.000Z","size":216,"stargazers_count":19,"open_issues_count":0,"forks_count":4,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-06-10T02:15:27.121Z","etag":null,"topics":["build-tools","bundle-size","javascript","monitoring","performance","rollup","typescript","vite","webpack"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/xanaawakens.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":"xanaawakens","patreon":"xanaz","open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"lfx_crowdfunding":null,"polar":null,"buy_me_a_coffee":null,"thanks_dev":null,"custom":null}},"created_at":"2024-12-29T03:45:44.000Z","updated_at":"2025-04-01T18:37:59.000Z","dependencies_parsed_at":null,"dependency_job_id":"1e34fe76-6b83-4bb1-b971-e8a12b4bdced","html_url":"https://github.com/xanaawakens/bundle-size-tracker","commit_stats":null,"previous_names":["avixiii-dev/bundle-size-tracker","xanaawakens/bundle-size-tracker"],"tags_count":5,"template":false,"template_full_name":null,"purl":"pkg:github/xanaawakens/bundle-size-tracker","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xanaawakens%2Fbundle-size-tracker","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xanaawakens%2Fbundle-size-tracker/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xanaawakens%2Fbundle-size-tracker/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xanaawakens%2Fbundle-size-tracker/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/xanaawakens","download_url":"https://codeload.github.com/xanaawakens/bundle-size-tracker/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/xanaawakens%2Fbundle-size-tracker/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":260022535,"owners_count":22947179,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["build-tools","bundle-size","javascript","monitoring","performance","rollup","typescript","vite","webpack"],"created_at":"2025-02-11T16:43:33.029Z","updated_at":"2025-06-15T17:32:53.381Z","avatar_url":"https://github.com/xanaawakens.png","language":"TypeScript","funding_links":["https://github.com/sponsors/xanaawakens","https://patreon.com/xanaz"],"categories":[],"sub_categories":[],"readme":"# Bundle Size Tracker\n\n[![NPM VERSION](https://img.shields.io/npm/v/@avixiii/bundle-size-tracker)](https://www.npmjs.com/package/@avixiii/bundle-size-tracker)\n![NPM TOTAL DOWNLOADS](https://img.shields.io/npm/dt/@avixiii/bundle-size-tracker)\n[![LICENSE: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\n[![TYPESCRIPT READY](https://img.shields.io/badge/TypeScript-Ready-blue.svg)](https://www.typescriptlang.org/)\n\n\nA powerful and flexible tool to track and analyze JavaScript bundle sizes across different build tools. Monitor your bundle sizes, set size limits, and get detailed reports with AI-powered optimization suggestions.\n\n## Features\n\n### Core Features 🎯\n- Track bundle sizes during build process\n- Support for multiple build tools:\n  - Webpack\n  - Rollup\n  - Vite\n- Multiple report formats:\n  - Console output\n  - JSON reports\n  - HTML reports with visualizations\n- File compression analysis:\n  - Gzip compression\n  - Brotli compression\n- Custom size limits per bundle\n- Easy CI/CD integration\n- Full TypeScript support\n- Configurable alerts and warnings\n\n### AI-Powered Optimization 🤖 (New in v0.1.2)\n- Intelligent bundle analysis using OpenAI GPT models\n- Smart code splitting suggestions\n- Tree shaking opportunities detection\n- Dependency analysis and recommendations\n- Performance impact predictions\n- Automated optimization suggestions\n\n### History and Alerts 📊 (New in v0.1.3)\n- Track bundle size changes over time\n- Export and import history data\n- Interactive size visualizations\n- Configurable alerts for:\n  - Total size increases\n  - Individual chunk size changes\n  - Maximum size thresholds\n- Beautiful HTML reports with charts\n- Historical trend analysis\n- Size comparison across builds\n\n### Real User Monitoring 📈 (New in v0.1.4)\n- Track real-world performance metrics:\n  - Load time\n  - First Contentful Paint (FCP)\n  - Largest Contentful Paint (LCP)\n  - First Input Delay (FID)\n  - Cumulative Layout Shift (CLS)\n  - Time to Interactive (TTI)\n  - Total Blocking Time (TBT)\n- Device and network analysis:\n  - Device type detection\n  - Network connection speed\n  - Hardware capabilities\n- Performance recommendations:\n  - Automated performance insights\n  - Device-specific optimizations\n  - Network-based suggestions\n- Customizable data collection:\n  - Configurable sampling rate\n  - Pattern-based URL filtering\n  - Custom endpoint support\n\n\n## Documents\n\n## Installation\n\n```bash\nnpm install @avixiii/bundle-size-tracker --save-dev\n# or\nyarn add -D @avixiii/bundle-size-tracker\n# or\npnpm add -D @avixiii/bundle-size-tracker\n```\n\n## Quick Start\n\n### Webpack\n\n```javascript\n// webpack.config.js\nconst { BundleSizeTrackerPlugin } = require('@avixiii/bundle-size-tracker');\n\nmodule.exports = {\n  // ... other config\n  plugins: [\n    new BundleSizeTrackerPlugin({\n      maxSize: 500, // 500KB limit\n      outputFormat: 'html',\n      outputPath: './reports',\n      history: {\n        enabled: true,\n        thresholds: {\n          totalSizeIncreaseThreshold: 10, // 10% increase warning\n          maxTotalSize: 5 * 1024 * 1024 // 5MB limit\n        }\n      },\n      rum: {\n        enabled: true,\n        sampleRate: 0.1, // Sample 10% of users\n        endpoint: '/api/rum', // Optional custom endpoint\n        excludePatterns: ['/api/*', '/static/*'] // Optional URL patterns to exclude\n      }\n    })\n  ]\n};\n```\n\n### Rollup\n\n```javascript\n// rollup.config.js\nimport { bundleSizeTracker } from '@avixiii/bundle-size-tracker';\n\nexport default {\n  // ... other config\n  plugins: [\n    bundleSizeTracker({\n      maxSize: 300,\n      outputFormat: 'json',\n      history: {\n        enabled: true,\n        thresholds: {\n          chunkSizeIncreaseThreshold: 15 // 15% chunk size increase warning\n        }\n      },\n      rum: {\n        enabled: true,\n        sampleRate: 0.5 // Sample 50% of users\n      }\n    })\n  ]\n};\n```\n\n### Vite\n\n```javascript\n// vite.config.js\nimport { bundleSizeTrackerVite } from '@avixiii/bundle-size-tracker';\n\nexport default {\n  plugins: [\n    bundleSizeTrackerVite({\n      maxSize: 400,\n      history: {\n        enabled: true,\n        exportPath: './bundle-history'\n      },\n      rum: {\n        enabled: true,\n        sampleRate: 1, // Monitor all users\n        excludePatterns: ['/admin/*'] // Exclude admin pages\n      }\n    })\n  ]\n};\n```\n\n## Configuration\n\n### History Options\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `history.enabled` | boolean | `false` | Enable history tracking |\n| `history.maxEntries` | number | `100` | Maximum number of history entries to keep |\n| `history.thresholds.totalSizeIncreaseThreshold` | number | `10` | Percentage threshold for total size increase warning |\n| `history.thresholds.chunkSizeIncreaseThreshold` | number | `15` | Percentage threshold for chunk size increase warning |\n| `history.thresholds.maxTotalSize` | number | `5242880` | Maximum allowed total size in bytes (5MB) |\n| `history.thresholds.maxChunkSize` | number | `2097152` | Maximum allowed chunk size in bytes (2MB) |\n\n### RUM Configuration\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `rum.enabled` | boolean | `false` | Enable Real User Monitoring |\n| `rum.sampleRate` | number | `1` | Percentage of users to monitor (0 to 1) |\n| `rum.endpoint` | string | undefined | Custom endpoint for sending RUM data |\n| `rum.excludePatterns` | string[] | `[]` | URL patterns to exclude from monitoring |\n\n### AI Configuration\n\n| Option | Type | Default | Description |\n|--------|------|---------|-------------|\n| `ai.enabled` | boolean | `false` | Enable AI analysis |\n| `ai.model` | string | `'gpt-3.5-turbo'` | OpenAI model to use |\n| `ai.temperature` | number | `0.7` | Model temperature |\n\n### Compression Options\n\n```javascript\n{\n  compression: {\n    gzip: true,\n    brotli: true,\n    raw: true\n  },\n  reportFormats: ['json', 'html', 'console']\n}\n```\n\n### Custom Rules\n\nYou can set specific size limits for different bundles:\n\n```javascript\n{\n  rules: [\n    {\n      pattern: 'vendor', // or /vendor\\..*\\.js$/\n      maxSize: 800 // 800KB limit for vendor bundles\n    },\n    {\n      pattern: 'main',\n      maxSize: 200 // 200KB limit for main bundle\n    }\n  ]\n}\n```\n\n## Report Examples\n\n### Console Output\n```\nBundle Size Report\n\nGenerated: 2025-01-13T15:52:18+07:00\nStatus: PASS \nTotal Size: 264.09 KB\n\nmain.js\n  Raw: 120.5 KB\n  Gzip: 45.2 KB\n  Brotli: 40.1 KB\n  Status: PASS \n\nvendor.js\n  Raw: 143.59 KB\n  Gzip: 52.8 KB\n  Brotli: 48.3 KB\n  Status: PASS \n\nPerformance Metrics (RUM):\n  Load Time (median): 1.2s\n  First Contentful Paint: 0.8s\n  Largest Contentful Paint: 2.1s\n  First Input Delay: 45ms\n  Cumulative Layout Shift: 0.05\n```\n\n## License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxanaawakens%2Fbundle-size-tracker","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fxanaawakens%2Fbundle-size-tracker","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fxanaawakens%2Fbundle-size-tracker/lists"}