Skip to content

Conversation

@vineethasok
Copy link
Collaborator

Enabling minification reduces bundle size significantly while maintaining full debugging capability through source maps.

Size reductions (what consumers download over network):

📦 STANDARD BUILD
ES Module:
Raw: 2,299 KB → 1,714 KB (25.4% reduction)
Gzipped: 486 KB → 423 KB (12.9% reduction)

UMD Module:
Raw: 2,425 KB → 1,361 KB (43.8% reduction)
Gzipped: 492 KB → 384 KB (21.9% reduction)

📦 BUNDLED BUILD (with styled-components)
ES Module:
Raw: 2,361 KB → 1,767 KB (25.1% reduction)
Gzipped: 506 KB → 441 KB (12.7% reduction)

UMD Module:
Raw: 2,487 KB → 1,400 KB (43.7% reduction)
Gzipped: 511 KB → 400 KB (21.8% reduction)

Average: 34.5% reduction (raw), 17.3% reduction (gzipped)

Background:

Benefits:

  • Smaller bundle size for faster downloads and better CDN caching
  • Source maps still provide full TypeScript source-level debugging
  • Follows industry standard (React, Material-UI, etc. all ship minified)
  • Browsers load source maps on-demand only when devtools are open

Consumer Impact:

  • Consumers download 60-111 KB less per bundle (gzipped)
  • No loss of debugging capability - stack traces show original TypeScript
  • DevTools display original source code, not minified code

Enabling minification reduces bundle size significantly while maintaining full
debugging capability through source maps.

Size reductions (what consumers download over network):

📦 STANDARD BUILD
  ES Module:
    Raw:     2,299 KB → 1,714 KB  (25.4% reduction)
    Gzipped:   486 KB →   423 KB  (12.9% reduction)

  UMD Module:
    Raw:     2,425 KB → 1,361 KB  (43.8% reduction)
    Gzipped:   492 KB →   384 KB  (21.9% reduction)

📦 BUNDLED BUILD (with styled-components)
  ES Module:
    Raw:     2,361 KB → 1,767 KB  (25.1% reduction)
    Gzipped:   506 KB →   441 KB  (12.7% reduction)

  UMD Module:
    Raw:     2,487 KB → 1,400 KB  (43.7% reduction)
    Gzipped:   511 KB →   400 KB  (21.8% reduction)

Average: 34.5% reduction (raw), 17.3% reduction (gzipped)

Background:
- minify: false was added in March 2024 (PR #371) to aid debugging
- sourcemap: true was added in July 2024 (PR #644) to improve stack traces
- With source maps enabled, minification no longer affects debugging experience

Benefits:
- Smaller bundle size for faster downloads and better CDN caching
- Source maps still provide full TypeScript source-level debugging
- Follows industry standard (React, Material-UI, etc. all ship minified)
- Browsers load source maps on-demand only when devtools are open

Consumer Impact:
- Consumers download 60-111 KB less per bundle (gzipped)
- No loss of debugging capability - stack traces show original TypeScript
- DevTools display original source code, not minified code
@vercel
Copy link

vercel bot commented Dec 23, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
click-ui Ready Ready Preview, Comment Dec 23, 2025 4:28pm

Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR enables JavaScript minification for production builds to reduce bundle sizes while preserving debugging capabilities through existing source maps. The change reduces raw bundle sizes by an average of 34.5% and gzipped sizes by 17.3% across ES and UMD module formats.

Key Changes:

  • Enabled minification in Vite build configuration by changing minify: false to minify: true

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

@vineethasok vineethasok merged commit 106b293 into main Dec 24, 2025
6 checks passed
@vineethasok vineethasok deleted the enable-minification branch December 24, 2025 00:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants