适用于现代 Web 应用的捆绑方式
现代 Web 应用通常使用捆绑工具来创建经过优化和缩减的生产“文件包”(脚本、样式表等),让用户在更短的时间内完成下载。在使用 webpack 优化 Web 性能中,我们将介绍如何使用 webpack 有效优化网站资源。这有助于用户更快地加载您的网站并与之互动。
![Webpack 徽标。](https://web.developers.google.cn/static/articles/webpack/image/webpack-logo.png?authuser=5&hl=sk)
webpack 是当今使用最多的捆绑工具之一。利用其功能来优化现代代码,将代码拆分脚本拆分为关键和非关键部分,并剔除未使用的代码(仅列举几项优化措施)可确保您的应用以最低的网络和处理费用实现目标。
![应用 JavaScript 优化之前和之后。改善了可交互时间](https://web.developers.google.cn/static/articles/webpack/image/before-after-applying-ja-4050ad9acad04.png?authuser=5&hl=sk)
灵感来自 Susie Lu 的 Bundle Buddy 中的代码拆分
首先,我们来看看如何优化现代应用中最昂贵的资源之一 - JavaScript。