ProSculpt | React Performance &

ProSculpt | React Performance & Bundle Optimization

ProSculpt is a production SaaS platform where I worked on frontend architecture and performance optimization.

As the application grew, its React production build had reached 68 MB, resulting in slower deployments, larger uploads, and unnecessary code being shipped to users.

I investigated the production bundle using Webpack Bundle Analyzer and traced the problem beyond individual components to how dependencies were structured across the application.

Key improvements:

• Reduced the production build from 68 MB to 21 MB • Reduced build time from 3mins to 50secs • Identified root-level imports that were silently defeating route-based code splitting • Removed Highcharts from the main bundle and isolated it to dashboard routes where it was actually needed • Removed unused static assets that were increasing deployment size • Improved dependency boundaries so heavy feature-specific libraries weren't shipped to every user • Improved deployment performance and overall bundle architecture

One of the key findings was that route-level lazy loading wasn't enough. A globally imported charting dependency was still pulling Highcharts into the main bundle, meaning users who never opened a dashboard were downloading it anyway.

Moving that configuration into the relevant feature modules reduced the build further to 21 MB and restored the intended code-splitting boundaries.

This work changed the application from simply using lazy loading to having dependency boundaries that actually reflected its feature architecture.

Tech: React, JavaScript, Webpack, Webpack Bundle Analyzer, Highcharts, Day.js, Code Splitting, Lazy Loading