首页 > 解决方案 > 使用 next.js 提高应用程序的性能

问题描述

我有一个应用程序next.js,我想进行代码拆分以减少我的捆绑包,以便按需加载页面。

但是我没有找到办法做到这一点,因为我不在乎我的路线。作为使用 的示例react-router,我们可以dynamic imports在路线上使用。

有谁知道这个的解决方案?

标签: javascriptreactjstypescriptperformancenext.js

解决方案


Next.js 在构建步骤中开箱即用地处理这个问题。

可以作为入口点存在的每条路由都将被构建为具有首次加载版本和将由路由器加载的增量。

您可以通过运行yarn build && yarn start而不是yarn dev.

如果您仍想拆分和动态加载部分 JS,可以查看 Next 的动态导入https://nextjs.org/docs/advanced-features/dynamic-import


推荐阅读