Next.js：条件包装器的代码拆分
Next.js: Codesplitting for conditional wrapper
我是 Next.js 新手。
我想知道如何实现以下目标：
我的目标是为现有页面创建某种后端/管理区域。我的想法是在 _app.js 内创建一个身份验证包装器，它将始终检查本地存储中是否存储了身份验证令牌。如果是，如果不是，将简单地显示访问的页面。否则，身份验证成功后，我想注入一些编辑功能。
现在我担心性能问题。由于 React 将被捆绑，所有的编辑功能不会被捆绑到代码中吗？即使它们不会被普通用户使用，并且只供管理员使用。
当组件变得非常大时，这对我来说是个问题，因为大多数用户会下载他们永远不会接触的代码。
我知道 Next.js 具有开箱即用的代码拆分功能，但据我理解，Next.js 将按页拆分代码，并且由于编辑器组件会被注入对于每一页，每一页都会有它，不是吗？
所以基本上，我怎样才能将编辑器组件拆分成一个文件，只有当 auth 组件的条件 returns 为真时才会下载该文件？
我读到了 React.lazy()，但我不确定这是否适用于此类用例。另外，我很好奇，如果同样的概念适用，我如何只用 React 而不仅仅是 Next.js 做同样的事情。
感谢大家的帮助！
好的，经过一些修改我想我自己找到了解决方案。
首先我尝试使用 React.lazy()，但是 Next.js 还不支持（准确地说，ReactDOMServer 不支持）。
所以我从Next.js中找到了dynamic方法，它似乎在做同样的事情。我创建了一个简单的包装器，它将在几秒钟后将条件设置为真，并且能够观察到对动态加载组件的网络请求在这些秒后出现，这意味着它有效。
不过，我对此经验不多。如果有人找到更好的方法，请告诉我！
我是 Next.js 新手。
我想知道如何实现以下目标：
我的目标是为现有页面创建某种后端/管理区域。我的想法是在 _app.js 内创建一个身份验证包装器，它将始终检查本地存储中是否存储了身份验证令牌。如果是，如果不是，将简单地显示访问的页面。否则，身份验证成功后，我想注入一些编辑功能。
现在我担心性能问题。由于 React 将被捆绑，所有的编辑功能不会被捆绑到代码中吗？即使它们不会被普通用户使用，并且只供管理员使用。
当组件变得非常大时，这对我来说是个问题，因为大多数用户会下载他们永远不会接触的代码。
我知道 Next.js 具有开箱即用的代码拆分功能，但据我理解，Next.js 将按页拆分代码，并且由于编辑器组件会被注入对于每一页，每一页都会有它，不是吗？
所以基本上，我怎样才能将编辑器组件拆分成一个文件，只有当 auth 组件的条件 returns 为真时才会下载该文件？
我读到了 React.lazy()，但我不确定这是否适用于此类用例。另外，我很好奇，如果同样的概念适用，我如何只用 React 而不仅仅是 Next.js 做同样的事情。
感谢大家的帮助！
好的，经过一些修改我想我自己找到了解决方案。
首先我尝试使用 React.lazy()，但是 Next.js 还不支持（准确地说，ReactDOMServer 不支持）。
所以我从Next.js中找到了dynamic方法，它似乎在做同样的事情。我创建了一个简单的包装器，它将在几秒钟后将条件设置为真，并且能够观察到对动态加载组件的网络请求在这些秒后出现，这意味着它有效。
不过，我对此经验不多。如果有人找到更好的方法，请告诉我！