盖茨比曾经是街区上的新孩子，但这已经不复存在了。现在，这是一个完善的元框架，与57,000+实时网站和静态站点生成器之间的~23%市场份额（SSG）。

使盖茨比如此受欢迎的是其技术选择。用Gatsby创建的网站已预渲染；因此，它们可以很快出现在屏幕上。并使用综合的GraphQl层使数据加载变得简单。

尽管盖茨比（Gatsby）推动开发人员遵守特定技术，但它足够灵活：借助插件，您可以采用您喜欢的任何数据获取协议或渲染方法。

让我们检查盖茨比的工作原理。但是我们首先需要探索为什么要使用静态站点。

快速介绍静态站点生成器

过去，人们用一些HTML/CSS和一些魔术手工编写静态网站。但是，创建和维护网站，尤其是对于非开发人员而花费了很多工作。然后WordPress (WP)进来并缓解了需要了解任何编程的必要性。

因为WP非常方便，所以静态的站点被遗忘了一段时间。但是随后，开发人员意识到WP可能太重，满足特定需求。因此，静态站点返回了场景，但是这次不是手工制作的，而是从一组Markdown文件和模板中生成的生成的。相应的工具称为静态站点发电机（SSGS）。

ssgs录制了大量博客文章，并将它们与图像结合在一起，并将其结合到HTML页面中。这些存储在服务器上并应要求发送到客户端。即使没有CMS，用户也可以通过添加.md文件来添加新内容。

第一代SSG，例如Jekyll或Hugo，非常适合构建非相互作用的网站。这是因为他们的负载时间很短！

加载时间解释了

静态站点生成是一种渲染策略，在页面加载时间上得分出色。让我们看一下现代渲染方法，并将其在负载速度上进行比较，以扎根声明。

如果您的网站依赖客户端渲染（CSR），则浏览器执行大量JavaScript以获取HTML页面。但是，由于服务器比客户端设备具有更多的计算能力，因此渲染页面并将现成的HTML发送到浏览器更快。这就是服务器端渲染（SSR）。

在SSR中，每个请求都会重新构建页面，这需要时间，并且可能会超载服务器。对于SSGS而言，它不是相同的：您可以立即收到可以显示的内容，因为您的所有页面都会提前呈现并存储到下一个构建之前。

因此，加载时间是SSG中最短的。

SSG的好处

由于负载时间很短，因此静态站点是SEO的理想候选者。 Google确保用户从顶级搜索结果中获得最佳体验。因此，它对更高加载的网站进行排名！

此外，静态站点的漏洞比客户范围的网站少。在CSR中，浏览器会收到JS代码，因此恶意演员可以针对它来收集敏感数据。在SSG中，页面不那么复杂，因此，几乎没有针对的JS代码。当提出请求时，后端没有接触到数据源；因此，不可能进行SQL注射或XS。

静态站点非常可扩展，因为它们可以在更接近用户位置的内容交付网络（CDN）上缓存。这样，服务器不会超负荷，速度会增加。

，但SSG的上升并不是因为企业放弃动态内容，支持较短的加载时间和安全性。相反，比以往任何时候都需要动态内容。多亏了JAMstack架构，静态网站不再是静态的。

jamstack：结合静态和动态

如果您问what is Jamstack，答案很可能是：j javaScript，a是适用于apis，而m则用于标记。

但是，这个答案没有清理，可以吗？

您需要知道的是创建Jamstack的原因。然后您去：最初的目标是为静态生成的内容提供更多的交互性。这样，可以在更多场合应用静态生成的好处。但是该怎么做？

这个想法是将罕见的计算移动以构建时间，同时在运行时执行更频繁的计算。因此，想象一下您正在创建一个网站，发布前一天的货币最高波动。

从技术上讲，数据是动态的，但是它很少发生变化。因此，您没有在每个请求中查找数据库中的值，而是每天重建静态站点时检查一次API。但是，如果用户问，当前值是什么，则提出了新的API请求。

是的，jamstack依赖于 apis ，这是我们难题的第一个元素。通过API，前端，后端和3-D派对服务进行通信。总体而言，API允许分开内容和演示部分，这是脱钩体系结构的骨干。

因为这对于jamstack来说是基础，所以让我们确保您了解脱钩的方法。如您所知，在像WordPress这样的经典CMS中，前端和后端坐在一个地方 - 它们紧密地结合了。您可以将生成HTML的代码与与数据库交互的代码分开。

与此相反，在脱钩的架构中，前端和后端是独立的。他们可能会使用不同的技术堆栈并托管在不同的平台上。例如，最新趋势是将无头内容管理系统用于后端解决方案。

让我们回到jamstack。通过使用 JavaScript 通过HTTPS进行API调用来实现交互性。本质上，您加载静态内容，并且仅需要JS在交互时加载额外的数据。

然后来到 m arkup。包括在果酱中包括的意味着我们正在预先渲染HTML页面（HTML是标记语言）。但是许多人认为，MARD代表Markdown，这是不正确的。因为JAM’ was ambiguous是Tech Stack背后的公司，Netlify,已脱离了首字母缩写词。如今，他们仅将Jamstack（未大写）作为对发展理念的参考。

根据统计数据，Jamstack的流行：2022年网站的2.7%使用它。为什么是？

jamstack的好处

首先，jamstack是表演者，这意味着您的网站加载迅速并且适合SEO。它还保留了静态内容的其他好处，例如较小的攻击表面和更好的可扩展性，同时允许交互性，这是经典SSG的特征。

jamstack的独特功能是它消除了所谓的数据库延迟。在WP等经典CMS中，后端检索数据库每次提出请求时都会填充HTML。获取数据，渲染页面并将其发送回客户端需要时间。在jamstack中，前两个步骤发生在构建时，并以这种方式仅服务页面。

然后，jamstack固有的脱钩方法带来了很多好处。例如，您不绑定特定的预定义技术堆栈，并且您的数据更加安全，因为它存储在专有的CMS中。

一眼盖茨比

现在，我们讨论了静态发电和jamstack的所有好处，现在该解释为什么选择盖茨比作为jamstack提供商。

Gatsby是一种元框架，因此，如果您之前与React合作，您可能会发现与Gatsby一起工作。它具有基于文件系统的路由，受到开发人员的喜爱。

它的体系结构，就像WordPress一样，基于插件。插件生态系统庞大，并得到社区的积极支持。您可能会找到所需的任何功能。但是，盖茨比的主要特征是我们接下来讨论的。

盖茨比和詹斯塔克

Gatsby对Jamstack有所了解：获取数据的默认方法是通过GraphQl层。 GraphQL是一种允许您定义自己的模式的API。查询语言很简单，您只能获取所需的数据，因此您不会过度取回（就像有时需要休息的那样）。而且您不需要使用异步thunks；您可以直接从React组件获取数据。

但是，谁需要一个限制您与全球非graphql服务的72%集成的框架？没有人在盖茨比限制您！问题是，GraphQL仅用于数据编排。对于每个构建，所有数据都是通过服务使用的协议预先提取的，然后通过GraphQL内部提供。这样，盖茨比为开发人员提供了更好的体验。

盖茨比和反应

您可能会想知道，如果Server渲染了盖茨比，盖茨比如何基于React。经典的单页应用程序（SPA）是客户渲染的 - 所有网站内容均以一个JS文件发送给客户端，后来执行以获取HTML。但是Gatsby在HTML中发送页面，而不是在JS！

中发送页面

这里的答案：可以通过所谓的水合将静态页面组装到水疗中。这意味着将JS捆绑包与HTML一起发送到浏览器，以将所有内容整合在一起。与经典的水疗中心相比，执行JS的JS要少得多。盖茨比（Gatsby）保留了他们的主要好处：与多页网站相比，与网络相关的流量较少。

盖茨比的好处

该框架继承了其基础技术的所有好处 - SSGS，Jamstack和Decloped Architecture。这就是为什么我们要详细讨论它们。回顾：SSG/JAMSTACK站点是交互式，快速，安全和可扩展的。但是盖茨比加起来了这些素质。因此，让我们探索它到底添加了什么！

盖茨比的突出特征之一是图像优化。 Gatsby最大程度地减少了图像文件大小以缩短请求往返，并为不同的设备尺寸生成响应式图像。此外，它立即在折叠图像上方获取上方，然后推迟以后获取其他图片。

在加载图像时，盖茨比在整个图像的预览中显示了渐进式图像。它有助于保持图像位置并防止回流和故障。 Gatsby还具有内置的支持对预取内容的支持 - 即使在单击链接之前，浏览器已经下载其内容，因此您将很快继续进行。

然后，对代码进行分配：在webpack编译期间，代码分为小块。它有助于按需加载一些代码，从而提高您的网络容量。

这些是盖茨比的主要好处。但是，还有更多的明亮方面和惊人的功能，我们无法适应文章。

Gatsby用例：这是什么伟大的？

Gatsby非常适合构建具有动态内容的面向SEO的网站。为什么？例如，电子商务网站具有大量商品，每个商品都由照片表示。 Gatsby中的图像优化有助于最佳地加载这些照片！多亏了它，插图是按时显示的，而不会超载网络。

Gatsby还可以支持读取的网站（Web应用程序或B2B服务），因为其内容已预先渲染。而且，如果您担心数据可能会陈旧，那么常规构建就足以使大多数情况保持新鲜数据。

但是，使用重建的食谱仅适用于中小型网站。这是因为大型项目的构建过程需要更长的时间，这是盖茨比的主要缺点。反过来，更长的构建减慢了您的CI/CD管道，更新的频率较低。因为数据可能会变得陈旧，但盖茨比不建议大型网站，即使有ways around it。

当然，您可以使用盖茨比创建简单的个人博客，画廊或具有数十个登陆页面的公司网站。该框架不太沉重，而且很容易处理！

结束思想

盖茨比很受欢迎。它由Jamstack提供支持，可满足现代网络的大部分需求。它不仅确保了较短的负载时间，还可以确保无缝的视觉体验。鉴于Google值既值得了，框架在SEO上得分都很好。

此外，盖茨比（Gatsby）经常更新：自2020年以来，发布了三个版本，现在在v.5上发行。因此，它的发展与当前趋势息息相关。例如，在9月，引入了一个新的Slice API：现在您只能构建和部署自上次构建以来已更改的网站的部分。

总而言之，开发人员的体验足够好，观众度过了一个愉快的时光，可以浏览使用该框架构建的网站。因此，现在是时候将您的网站移至Gatsby了。