Skip to content

Commit

Permalink
chore: replace React with Preact and update dependencies
Browse files Browse the repository at this point in the history
- Replace React with Preact for smaller bundle size
- Update MUI to v5
- Replace lodash with lodash-es for better tree shaking
- Add alias configuration for Preact compatibility
  • Loading branch information
Pham Anh Tuan authored and Pham Anh Tuan committed Jan 2, 2025
1 parent 1b21ab2 commit d4b9891
Show file tree
Hide file tree
Showing 8 changed files with 742 additions and 46 deletions.
8 changes: 8 additions & 0 deletions .env.example
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
# OpenAI API Key for AI-powered bundle analysis
OPENAI_API_KEY=your_api_key_here

# OpenAI Model to use (default: gpt-4)
OPENAI_MODEL=gpt-4

# Temperature for AI responses (0-1, default: 0.7)
AI_TEMPERATURE=0.7
80 changes: 80 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ A powerful and flexible tool to track and analyze JavaScript bundle sizes across
- Easy CI/CD integration
- Full TypeScript support
- Configurable alerts and warnings
- AI-powered bundle optimization suggestions

## Installation

Expand Down Expand Up @@ -126,6 +127,85 @@ You can set specific size limits for different bundles:
}
```

## AI-Powered Bundle Optimization

This package now includes AI-powered bundle analysis and optimization suggestions powered by OpenAI's GPT models. This feature provides:

- Intelligent code splitting suggestions
- Tree shaking optimization opportunities
- Smart dependency analysis
- Performance impact predictions

### Setup AI Features

1. Copy `.env.example` to `.env`:
```bash
cp .env.example .env
```

2. Add your OpenAI API key to `.env`:
```env
OPENAI_API_KEY=your_api_key_here
```

3. Configure AI options in your build config:

```javascript
// webpack.config.js
module.exports = {
plugins: [
bundleSizeTrackerWebpack({
// ... other options
ai: {
enabled: true,
model: 'gpt-4', // optional
temperature: 0.7 // optional
}
})
]
};
```

### AI Analysis Results

The AI analysis provides detailed insights including:

- Specific code splitting points with estimated impact
- Unused exports that can be safely removed
- Bundle size optimization recommendations
- Performance improvement estimates

Example output:
```json
{
"aiAnalysis": {
"optimizations": [
"Split vendor chunks for better caching",
"Remove unused moment.js locales",
"Implement dynamic imports for route components"
],
"impact": {
"sizeReduction": 152000,
"performanceImprovement": 35
},
"codeSplitting": {
"splitPoints": [
"src/routes/admin/*",
"src/components/charts/*"
]
},
"treeShaking": {
"unusedExports": [
{
"module": "@material-ui/icons",
"exports": ["UnusedIcon1", "UnusedIcon2"]
}
]
}
}
}
```

## GitHub Actions Integration

Create `.github/workflows/bundle-size.yml`:
Expand Down
Loading

0 comments on commit d4b9891

Please sign in to comment.