javascript-何时使用React框架(例如Next或Gatsby与Create React App)

我处于我的React / javascript学习经验的快速原型开发阶段。 我想知道人们何时会使用Next.js或Gatsby.js这样的框架,而不是标准的Create React App。

我确实挖掘了基于页面的结构和预加载Next.js链接的前景。 但是,我不确定您何时到达CRA甚至退出CRA的下一步。

谢谢!

4个解决方案
20 votes

我在同一条船上。 我从CRA开始创建SPA,这对于开始并克服学习过程非常有用。 但是我很快意识到了两个重要问题:

  1. 在社交网络上共享:我无法更改每条路线的OGP标签。 这样做的效果是,只有在社交网络上共享的基本路线(正确设置了OGP标签)才能生成该卡(推特条款),而您共享的任何其他路线将基本上显示为空白。 Facebook和LinkedIn也是如此。 看这里。
  2. 搜索引擎优化:尽管很少有关于搜索引擎的文章能够正确地对SPA进行索引以进行索引,但是根据我的经验,它并不令人满意。 例如 在Google中,我注意到只有主页被索引了,并且没有正确解析。 来自单独元素的单独标题串联在一起。 必应,似乎没有将其编入索引。 可能是Google为它建立了索引,因为我已经使用Google的Search Console为主页建立了索引。 如果我必须为每个新页面或在更新页面后手动重新编制索引,则这不是可行的解决方案。

Create-React-App:一个非常好的引导程序工具,可以开始创建SPA。

Gatsby / React-Static:类似于Create-React-App,但产生HTML构建输出,而不是“预渲染”。 我尚未对此进行试验。 我希望这能解决(1)和(2),因为我现在可以在HTML中通过静态站点服务器(S3 / Azure Blobs / Github页面)提供不同的OGP标签了,而不是在 取。 我不确定这是否行得通。 此处的附加优势是,由于Gatsby在构建期间已经预先渲染,因此用户可以体验到更好的性能。 (可能是有Gatsby经验的人可以澄清,或者我完成后将编辑此答案。)更新(2/19/2018):我可以确认(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文档中列出的这些替代方法。

dparkar answered 2020-02-10T07:29:28Z
9 votes

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

好消息是它们都共享同一个视图层,因此您可以从一种工具转移到另一种工具。 您可以检查从create-react-app到Gatsby.js的转移,该过程有详细介绍。

Khaled Garbaya answered 2020-02-10T07:29:54Z
0 votes

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

typeoneerror answered 2020-02-10T07:30:14Z
-1 votes

create-react-app最适合构建网站和移动应用程序(反应本机应用程序),因为有很多学习曲线。 另外两个是反应框架(可以说)。

将Gatsby用于单页网站,更快,更易于部署。在使用REST API时使用Next.js(我想...)

由你决定。 一个好的开发人员总会找到他/她的方法来轻松快速地工作。

answered 2020-02-10T07:30:43Z
translate from https://stackoverflow.com:/questions/46009836/when-to-use-a-react-framework-such-as-next-or-gatsby-vs-create-react-app