Efficient Static Assets Pipeline with Webpack

Опубликовано: 05 Октябрь 2024
на канале: Association for Computing Machinery (ACM)
5,151
47

To be successful, a large single-page application has to be maintainable, reliable and performant. Maintainability is achieved by modularization and breaking down the code into hundreds of small and cohesive JavaScript and CSS files.

Performance implies concatenation of this plethora of files into a few bundles and on-demand loading on Production.

Reliability requires you to ensure your dev and production environments are as similar as possible.

At Hootsuite we managed to reconcile those incompatible requirements by designing a robust static assets pipeline with Webpack, an open source static assets bundler.

During this talk, I'll explain how it compares to RequireJS and Browserify both in terms of performance and ease of use, walk you through its main assets like code-splitting, clever static analysis, automatic reloading in the dev environment, detection of shared code across bundles... I'll show how we put them to use to reduce the size of our bundles, improve our page load time and our JavaScript cyclomatic complexity.

Alexandrine Boissiere

http://dx.doi.org/10.1145/2742580.274...