66

我正处于 React/javascript 学习经历的快速原型设计阶段。我想知道人们何时会使用 Next.js 或 Gatsby.js 之类的框架，而不是标准的 Create React App。

我真的很喜欢基于页面的结构和 Next.js 预加载链接的前景。但是，我不确定您何时会与 CRA 或什至退出 CRA 一样选择 Next。

谢谢！

4

4 回答 4

28

我在同一条船上。我从 CRA 开始创建一个 SPA，它很好地开始并克服了学习曲线。但我很快意识到两个重要问题：

  1. 在社交网络上分享：我无法更改每条路线的 OGP 标签。这样做的效果是，只有您在社交网络上共享的基本路线（使用 OGP 标签正确设置）才能生成卡片（推特术语），您共享的任何其他路线基本上都会显示为空白。Facebook 和 LinkedIn 也是如此。见这里。
  2. 搜索引擎优化：虽然很少有关于搜索引擎能够正确抓取您的 SPA 以进行索引的文章，但根据我的经验，它并不令人满意。例如在谷歌中，我注意到只有主页被索引并且没有被正确解析。来自不同元素的独立标题连接在一起。必应，似乎没有索引它。可能是谷歌索引它，因为我已经使用谷歌的搜索控制台索引了主页。如果我必须为每个新页面或更新页面后手动重新索引，这不是一个可行的解决方案。

Create-React-App ：一个非常好的引导工具，可以开始创建 SPA。

Gatsby/React-Static ：类似于 Create-React-App 但生成 HTML 构建输出而不是“预渲染”。我还没有尝试过这个。我希望这可以解决 (1) 和 (2)，因为我现在可以在静态站点服务器（S3/Azure Blobs/Github Pages）提供的 HTML 中拥有不同的 OGP 标签，而不是在拿来。我不确定这是否可行。这里的额外优势是，由于 Gatsby 已经在构建期间进行了预渲染，因此用户体验到了更好的性能。（可能有盖茨比经验的人可以澄清一下，或者我会在完成后编辑这个答案。）更新（2018 年 2 月 19 日）：我可以确认（1）由 Gatsby.js 解决，同时仍然作为静态托管网站。

Next.js ：如果 Gatsby 不能解决 (1) 和 (2)，Next.js 将成为我创建完整 SSR 应用程序的后备方案。这里的问题是，现在我将不得不使用 PaaS 来托管站点（例如 Azure Web Apps 或 AWS ElasticBeanStalk 或 Heroku），而不是静态站点托管服务（Azure Blob、AWS S3、Github Pages）。设置 CI/CD 管道的成本会稍高一些，而且需要做更多的工作。

另请参阅CRA 文档中列出的这些替代方案。

于 2018-02-12T10:22:44.180 回答
12

我最近对这个主题做了很多研究，尤其是 create-react-app vs Gatsby.js，我发现这两种工具都可以让你立即编写反应代码，而不必过多担心设置。但是，例如，盖茨比在此基础上提供了构建时的服务器端渲染，这对 SEO 至关重要。您不需要任何服务器来呈现您的视图，Next.js 就是这种情况，因为它们已经在构建时完成。当用户访问您的网站时，将首先加载 HTML 版本，一旦加载了 javascript，您的网站将成为功能齐全的 React Web 应用程序。

好消息是它们都共享相同的视图层，因此您可以从一个工具移动到另一个工具。您可以检查从 create-react-app 移动到 Gatsby.js的详细信息。

于 2018-06-16T15:15:03.740 回答
2

我自己在做这项研究。我的理解是 Next.js 提供了开箱即用的服务器端渲染。Create React App 不这样做，因此您需要为 SSR 提供​​自己的解决方案（例如更快的页面加载和 SEO）。

于 2017-11-16T22:12:57.450 回答
-3

create-react-app 最适合构建网站和移动应用程序（反应原生应用程序），因为有很多学习曲线可用。另外两个是反应框架（我们可以说）。

将 Gatsby 用于更快且易于部署的单页网站。在使用 REST API 时使用 Next.js（我猜......）

由你决定。优秀的开发人员总能找到轻松快速的工作方式。

于 2018-12-11T13:57:18.433 回答