Wrapping up the webpack series
This final installment of the series on webpack summarizes the key performance strategies covered so far. The core message is to keep your application lean and efficient at every stage of the build.
Four main principles round out the series:
- Cut unnecessary bytes. Always compress assets, eliminate dead code, and carefully evaluate any new dependency before adding it.
- Split code by routes. Load only the code needed for the current view, and take advantage of lazy-loading for everything else.
- Cache code. Separate update-heavy code from more static parts of the application. This way, users only have to re-download files when their actual content changes.
- Keep track of the size. Keep an eye on bundle sizes with community tools like webpack-dashboard and webpack-bundle-analyzer, and revisit overall app performance every few months.
Webpack is only one part of a performance strategy. For better user experience, investigate Progressive Web App features and set up automated audits with tools like Lighthouse for continuous improvement suggestions.
Consult the official webpack guides for more details, and consider experimenting with the webpack training project to practice what you have learned.
