jam stack_纯JAM堆栈

jam stack

定义 (The Definition)

A JAM Stack application is “An application that uses only the core building block of JS, APIs, and Markup”. By its strictest definition, it is a serverless JS application plus an additional requirement that further increases efficiency — HTML markup is generated during build time only. During build, data is fetched via API request for each page, and HTML is subsequently hydrated with data and saved in the bundled production version. Every page can be served statically.

JAM Stack应用程序是“仅使用JS,API和标记的核心构建块的应用程序”。 按照最严格的定义,它是一个无服务器的 JS应用程序,另外还有一个进一步提高效率的要求-HTML标记仅在构建时生成。 在构建期间,将通过API请求为每个页面获取数据,然后将HTML与数据混合,并保存在捆绑的生产版本中。 每个页面都可以静态投放。

You might be thinking, that sounds like a pretty restrictive platform on which to build an application — what if I need user login, or to save comment data on the site? What if I want to sell things on the internet? And that’s true, in reality there are very few applications that are actually pure JAM Stack. The only sites that can afford to be are online documentation pages, or other truly static sites.

您可能在想,这听起来像是一个用于构建应用程序的限制性平台,如果我需要用户登录或将评论数据保存在网站上怎么办? 如果我想在互联网上卖东西怎么办? 没错,实际上,实际上只有纯JAM Stack的应用程序很少。 唯一可以负担的网站是在线文档页面或其他真正的静态网站。

But that’s ok. the JAM stack is meant to be an ideal, not a strict opinionated framework. What that means is that you should start from the perspective of thinking about how you can move as much of your application to be statically rendered and cached, and then what you can’t, you can use JS and JSON APIs to handle. Need ecommerce? there’s an API for that. Need to store data in a serverless mongo DB? There’s an API for that too.

但是没关系。 JAM堆栈旨在成为理想的框架,而不是严格的自以为是的框架。 这意味着您应该从以下角度出发:考虑如何移动尽可能多的应用程序以进行静态呈现和缓存,然后执行无法使用JS和JSON API进行处理的操作。 需要电子商务吗? 有一个API。 是否需要将数据存储在无服务器的mongo DB中? 也有一个API。

现在谁在使用它? (Who’s Using it Now?)

The JAM Stack is in use in many production applications. The one that gets a lot of attention is Smashing Magazine, a popular front end development website featuring articles, tips and tricks, etc. Major production applications have also been developed by companies such as Nike and Peloton on the JAM Stack, though it should be noted both companies have built promotional sites, and not their primary site with this architecture.

JAM Stack已在许多生产应用程序中使用。 引起广泛关注的是Smashing Magazine ,这是一个受欢迎的前端开发网站,提供文章,技巧和窍门等。主要的生产应用程序也由耐克和佩洛顿等公司在JAM Stack上开发,尽管应该指出两家公司都建立了促销网站,而不是使用此架构的主要网站。

我应该在下一个应用程序中使用它吗? (Should I Use It For My Next App?)

Yes and no. The JAM Stack is a great proof of concept that highlights some best practices in modern development: Using CMSs to increase app edibility, caching what you can via CDN, and thinking about static rendering. The “Pure JAM” Stack is too narrow to be used in all but a few select cases currently. The emergence of frameworks like Next/Nuxt.js that focus primarily on helping developers build JAM-Centric apps shows me that the pattern is gaining popularity, so in the following years I expect a move towards JAM, but not to a pure JAM state.

是的,没有。 JAM Stack是一个出色的概念证明,突出了现代开发中的一些最佳实践:使用CMS提高应用程序可编辑性,通过CDN缓存您的内容以及考虑静态渲染。 “ Pure JAM”堆栈太窄,无法用于当前(除少数几种情况下)所有情况。 诸如Next / Nuxt.js之类的框架的出现主要集中于帮助开发人员构建JAM-Centric应用程序,这向我表明,这种模式正在逐渐普及,因此,在接下来的几年中,我希望转向JAM,而不是纯粹的JAM状态。

详细组件 (The Components in Detail)

Here are the component definitions for the JAM stack — how you use them, especially the API part — is up to you. More on that later.

以下是JAM堆栈的组件定义-如何使用它们,尤其是API部分-由您决定。 以后再说。

JavaScript: Any dynamic programming during the request/response cycle is handled by JavaScript, running entirely on the client.

JavaScript :在请求/响应周期中的任何动态编程均由JavaScript处理,并且完全在客户端上运行。

APIs: All server-side functions or database actions are abstracted into reusable APIs, accessed over HTTPS with JS. Be it SaaS, third-party services or custom-built.

API :所有服务器端功能或数据库操作都抽象为可重用的API,可通过JS通过HTTPS访问。 无论是SaaS,第三方服务还是定制的。

Markup: Templated markup should be prebuilt at build time, usually using a site generator for content sites, or a build tool for web apps.

标记 :标记的标记应在构建时预先构建,通常使用用于内容站点的站点生成器或用于Web应用程序的构建工具。

部署过程 (The Deployment Process)

The deployment process for a pure JAM Stack application is as follows → We deploy and serve pre-generated, static markup. We enhance this markup dynamically on the client side with JavaScript, and fetch dynamic data via APIs. To be consistent with this flow, the acronym really should be “MJA”, but MJAStack just doesn’t have the same ring to it. 🤨

纯JAM Stack应用程序的部署过程如下所示→我们部署并提供预先生成的静态标记。 我们使用JavaScript在客户端动态增强此标记,并通过API获取动态数据。 为了与此流程保持一致,首字母缩写词实际上应该是“ MJA”,但是MJAStack只是没有相同的名称。 🤨

Applications that are statically generated are not tied to large configuration files (though some new configs are admittedly required) and are less difficult to deploy. They don’t even really need to “run” only to be opened, as there is no http communication happening between internal pieces of the application.

静态生成的应用程序不受大型配置文件的约束(尽管确实需要一些新配置),并且部署难度较小。 他们甚至不需要打开就可以“运行”,因为在应用程序内部之间没有http通信发生。

Image for post
Some tools and frameworks that help you build JAM stack apps
一些工具和框架可帮助您构建JAM堆栈应用

对未来意味着什么 (What it Means For the Future)

The main advantage of this development pattern is that it gives JS developers back many of the application features that were lost during the past 5 years of migration from serverside rendered PHP and .NET frameworks to Javascript and SPAs (single-page, client-side apps). HTML load can be faster, SEO can be stronger, and more bugs can be surfaced during build time.

这种开发模式的主要优点是,它为JS开发人员提供了过去5年从服务器端渲染PHP和.NET框架到Javascript和SPA(单页,客户端应用程序)迁移过程中丢失的许多应用程序功能。 )。 HTML加载可以更快,SEO可以更强大,并且在构建期间可能会出现更多错误。

The JAM stack also, by offloading many features to external APIs, frees developers from the trouble of having to manage problems around networking and server maintenance (how many requests will we be sending to the /login API, can our servers handle it, etc). Another advantage is that is allows you to write a single application, as opposed to the traditional server-side and client-side application architecture with two applications needing to be configured, built, and maintained separately.

JAM堆栈还通过将许多功能转移到外部API上,使开发人员免于必须管理网络和服务器维护问题的麻烦(我们将向/ login API发送多少请求,我们的服务器可以处理等) 。 另一个优点是,与传统的服务器端和客户端应用程序体系结构相比,您可以编写单个应用程序,而传统的服务器端和客户端应用程序体系结构则需要分别配置,构建和维护两个应用程序。

The aggregate effect of all of this is that:

所有这些的综合效果是:

Javascript developers, who make up a large percentage of the development community, are empowered by the JAM Stack concepts to build truly production-ready applications.

在开发社区中占很大比例的Javascript开发人员受JAM Stack概念的支持,可以构建真正的生产就绪型应用程序。

A recent blog post by Snipcart claims that JAMstack is a significant shift in focus from the now abstractable backend to the now powerful frontend. I think that the shift in focus is more from backend developers to front end developers.

Snipcart最近发表的一篇博客文章声称, JAMstack的重点已从现在可以抽象的后端转移到现在功能强大的前端 。 我认为重点从后端开发人员转移到前端开发人员

The development patterns of the JAM stack are not new, backend developers have been paying attention to caching, SEO, and networking for years; but now the number of high-powered front-end developers in enterprise has grown, and they want ways to leverage Javascript to create truly scalable and deployable apps themselves.

JAM堆栈的开发模式并不新鲜,后端开发人员多年来一直在关注缓存,SEO和网络。 但是现在企业中功能强大的前端开发人员的数量已经增加,他们希望能够利用Javascript自己创建真正可扩展和可部署的应用程序的方法。

翻译自: https://medium.com/swlh/pure-jam-stack-6050e96d7322

jam stack

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值