Cursor rule

1---
2description: Webpack/Vite configuration and build process optimization
3globs: webpack.config.js, vite.config.js, *.config.js
4---
5# Enhanced Build Process Optimization
6 
7Ensures optimal build configuration and process for better performance and maintainability.
8 
9## Rule Details
10 
11- **Name:** enhanced_build_optimization
12 
13- **Description:** Enforce standards for optimizing build processes
14 
15## Filters
16- file extension pattern: `"\\.(js|ts|json)$"  # Expanded to cover more config file types`
17 
18## Enforcement Checks
19- Conditions:
20  - pattern `mode:\\s*['\"]development['\"]` – negated `process\\.env\\.NODE_ENV === 'development'` – Set 'mode' to 'production' for production builds unless dynamically set by NODE_ENV.
21  - pattern `devtool:\\s*['\"]eval` – Use 'source-map' or 'hidden-source-map' for production builds to balance performance and debugging.
22  - pattern `optimization:\\s*{[^}]*?splitChunks:\\s*{[^}]*?chunks:\\s*(?!'all')` – Enable code splitting for all chunks in optimization settings.
23  - pattern `optimization:\\s*{[^}]*?usedExports:\\s*(?!true)` – Enable tree shaking by setting 'usedExports' to true.
24  - pattern `output\\s*:\\s*{[^}]*?filename:\\s*['\"][^\\[]+['\"]` – Use content hashing in filenames for better caching (e.g., '[name].[contenthash].js').
25 
26## Suggestions
27- Guidance:
28**Build Optimization Best Practices:**
29- **Code Splitting:** Implement code splitting to load only what's necessary for each page or component.
30- **Tree Shaking:** Enable tree shaking to eliminate dead code, which reduces bundle size.
31- **Asset Optimization:**
32  - Compress images and use modern formats like WebP where supported.
33  - Use lazy loading for images and other media.
34- **Caching:**
35  - Configure proper caching strategies (e.g., HTTP headers, service workers for PWA).
36  - Use long-term caching for static assets with content hashing in filenames.
37- **Modern JavaScript:** 
38  - Use ES6+ features but ensure polyfills for older browsers if needed.
39  - Consider using features like module/nomodule for graceful degradation.
40- **Minification & Compression:** Ensure all JavaScript and CSS are minified and consider enabling gzip compression on the server.
41- **Performance Budgets:** Set performance budgets to keep bundle sizes in check.
42- **Environment Variables:** Use environment variables for configuration differentiation between development and production.
43- **CI/CD:** Integrate with CI/CD pipelines for automated builds and testing, ensuring only optimized code goes to production.
44 
45## Metadata
46- Priority: high
47- Version: 1.2
48