Gatsby 的客户端路由 - 我的客户端呈现的页面仍然受益于 Gatsby 的哪些功能？

Question

我构建了一个使用 gatsby 处理静态内容的小型站点，但是对于需要在客户端呈现的某些内容，我在 gatsby 中使用了仅客户端路由。

我不确定我是否完全理解这是如何工作的 - 假设我有一个Header、Footer和我在我的静态站点中使用的字体。在我的仅客户端路由上，我使用相同的Header、Footer和font。之前在我的静态组件中使用过这些元素，我会从中受益吗？例如，是否重新加载字体？

基本上，我想知道我的客户站点内容现在失去了 Gatsby 的哪些功能，以及我应该多注意什么，因为 Gatsby 不会再为我处理这个问题了。尤其是在页面速度方面。

Answer 1

是的，您应该从使用这些组件和字体中受益。

被重用的 React 组件已经在您发送给用户的 JS 包中，不需要再次获取。与字体文件类似 - 但这些将是资产文件 - 不在 JS 包中。

查看正在获取的内容的最佳方法是在浏览器中对其进行测试。

1. 加载静态页面
2. 打开开发工具中的网络选项卡
3. 导航到仅限客户端的页面并检查网络活动

虽然这些资源不应该被获取两次，但我可以想象在某些情况下，错误的设置会获取它们两次 - 所以最好仔细检查。