optimize-js-library-sizelisted
Install: claude install-skill TomerAberbach/claude-config
Reduce the size of this JavaScript library.
# Goals
- Reduce the minified and gzipped/brotli minified size
- NEVER reduce minified size at the expense of gzipped/brotli minified size
- ALWAYS preserve the public API surface
- Focus on large structural changes instead of small wins
# Workflow
1. Read and understand the library structure
2. Run relevant tests and note which ones already fail (do NOT fix them)
3. Measure size
4. Optimize
5. Rebuild
6. Measure size and compare: if size didn't improve, then revert and go back to
step 4
7. Run relevant tests: if tests are newly failing, then revert and go back to
step 4
8. Repeat from step 4
# Tools
- Ensure `terser` is configured:
```js
{
// Assume modern JavaScript
ecma: 2020,
module: true,
toplevel: true,
// Run multiple times
compress: {
passes: 3,
},
// Mangle underscore prefixed properties
mangle: {
properties: {
regex: `^_[^_]+`,
},
},
}
```
- Use `node` to measure size:
```bash
node --input-type=module << 'EOF'
import { readFileSync } from 'fs'
import { gzipSync, brotliCompressSync } from 'zlib'
const raw = readFileSync('REPLACE_ME.js', 'utf8')
const minified = Buffer.from(raw.replace(/^\/\/# sourceMappingURL=[^\n]+$/m, '').trimEnd())
console.log(`Minified: ${minified.length} | Gzipped: ${gzipSync(minified).length} | Brotli: ${brotliCompressSync(minified).length}`)
EOF
```
# Techniques
## High-level
- Dele