HMR 优化方案

[ClarkXia]

由于 bundle 的大小直接影响 hmr 效果，如果期望 hmr 效果逼近原生 esm，需要将每个组件都独立打包

方案设计

由于大部分三方依赖会以独立 chunk 的方式进行加载，因此仅需要考虑所有源码组件以 dynamic import 的方式引入即可 开启 HMR 优化方案后，所有相对地址的导入将编译为 dynamic import，默认以 top level await 的方式转化所有相对地址的导入：

import Home from '@/components/home';
// 转变为
const Home = await import('@/components/home');

原则上开启方案后，每个独立的组件 chunk 仅包含当前组件源码部分的代码，其他导入内容均以独立 chunk 方式加载

[ClarkXia]

由于 swc 目前不支持 top-level await https://github.com/vercel/next.js/issues/31054 需要重新确定下方案