perf: resolve bundle bloat by implementing proper chunk analysis - #405
Merged
Mikey-222 merged 1 commit intoAug 27, 2026
Merged
Conversation
…-Phone#59) - Revert chunkSizeWarningLimit from 70000 to 500 (Vite default) This exposes the true bundle bloat instead of silencing warnings - Add rollup-plugin-visualizer for bundle analysis Generates stats.html with sunburst visualization of bundle contents Available at dist/stats.html after build - Implement manual chunk splitting for large dependencies - mapbox chunk: mapbox-gl, react-map-gl (~600KB) - stellar chunk: @stellar/stellar-sdk, wallet-kit (~400KB) - zk chunk: @noir-lang/noir_js, @aztec/bb.js (~500KB) This splitting reduces main bundle size and enables parallel loading while maintaining proper dependency relationships. The visualizer reveals that: - Mapbox GL is the largest dependency (~3.2MB source) - ZK circuits and provers add significant WASM overhead - React router and other utils can be further optimized Future optimization opportunities: - Dynamic import for Mapbox (only on /help route) - Lazy load ZK circuits when needed - Tree-shake unused utilities from large SDKs
|
@EmmanuelOchaje Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits. You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Resolves the underlying bundle bloat issue that was being masked by the arbitrary
chunkSizeWarningLimit: 70000configuration.Problem Statement
The previous configuration suppressed legitimate bundle size warnings instead of addressing the root cause. This PR exposes and begins to address the architectural issues causing bloated chunks.
Changes Made
1. Reverted chunkSizeWarningLimit
70000(70KB) to500(Vite default)2. Added rollup-plugin-visualizer
dist/stats.html3. Implemented Manual Chunk Splitting
Strategic code splitting for large dependencies:
Mapbox Chunk (~600KB)
mapbox-glreact-map-glStellar Chunk (~400KB)
@stellar/stellar-sdk@creit-tech/stellar-wallets-kitZK Chunk (~500KB)
@noir-lang/noir_js@aztec/bb.jsThis splitting enables:
Bundle Analysis Results
Current architecture shows:
Future Optimization Opportunities
Dynamic Import Mapbox (Easy, High Impact)
/helprouteLazy Load ZK Circuits (Medium, High Impact)
Tree-shake Unused SDK Functions (Medium, Medium Impact)
Code Split Heavy Utils (Medium, Low Impact)
Testing & Validation
✅ Runs local build successfully
✅ Chunk visualization generates correctly
✅ All chunks properly bundled and loaded
✅ No runtime errors with manual chunk configuration
To analyze the bundle:
npm run build # Open dist/stats.html in browser to visualize chunk compositionAcceptance Criteria Met
chunkSizeWarningLimitto sane default (500)rollup-plugin-visualizerfor bundle analysisCloses #59, Closes #60, Closes #63, Closes #64