Erlo

目前大火的 Jamstack 到底是什么?

时间:2021-07-22   阅读:47次   来源:开源中国
页面报错
点赞

目前大火的 Jamstack 到底是什么?

作者:Timothy McCallum、Miley Fu 与 Vivian Hu

Jamstack 是一套用于构建现代互联网应用的技术栈。它在边缘云、serverless 计算、以及大前端有广泛的应用,也在今年受到资本市场的追捧。它到底有什么魔力呢?这篇文章将带你了解 Jamstack 的概念以及开发范式。我们也将讨论 Rust 与 WebAssembly 这样的新兴技术如何让 Jamstack 更快,更安全,更易用。

什么是Jamstack?

Jamstack 是一种构建网站和 web 应用程序的新方法。Jamstack 的 Stack 指的是许多独立,但是可以组合,的技术层。当它们结合在一起时能够提供一个完整的 web 应用。

Jamstack 架构中的 JAM 是指客户端 JavaScript、可重用的后端 API,和用户界面的 Markup,比如 HTML 与 CSS。

Jamstack 的关键特征是前端 Web UI 与基于 API 的后端服务之间的清晰区分。与垂直集成的传统 Web 应用程序不同的是, Jamstack 应用程序是模块化和分散式的:UI 可以通过静态网页服务器、CDN、甚至基于区块链的存储进行分发;后端 API 服务可以部署在云上,也可以由边缘节点就近提供服务。

为什么 Jamstack 超级赞?

从技术栈比较的角度来看,用于开发 Web 应用程序的另一个常见技术栈是 LAMP (Linux, Apache, MySQL, PHP) 以后其后的 MEAN (MongoDB, Express.JS, Angular, Node.JS)。

LAMP 概览

K7.india at English Wikipedia, CC BY 3.0 https://creativecommons.org/licenses/by/3.0, via Wikimedia Commons

从上面的图表可以看出,从应用开发者的角度,当使用 LAMP 技术栈时,有很多的组件可以安装,并且可以同时配置和维护。LAMP 应用的用户界面是由后端服务器动态生成的。绝大部分逻辑与计算都在服务器上。前端的浏览器只负责渲染。

JAM 概览

与 LAMP 技术栈相比,Jamstack 在许多不同之处 ,这对开发者构建网站或 web 应用的方式有着深远的影响。从部署架构上讲,Jamstack 应用的用户界面是通过“编译”生成的静态网页,从而大大提高了性能,安全性,以及降低了服务端的复杂度与计算负载。

从开发者的角度来看,一些主要的区别包括:

  • Jamstack 开发者不需要安装或管理操作系统(如 Linux)
  • Jamstack 开发者不需要管理安全策略(服务器防火墙)
  • Jamstack 开发者不需要安装或管理应用程序数据库(如 MySQL)
  • Jamstack 开发者可以在不使用 HTTP (Web)服务器(如 Apache)的情况下部署 Web 站点或 Web 应用

总体而言,选择使用 Jamstack 创建网站和 web 应用有4个主要好处: 成本效益、性能改进、更好的安全性和更好的用户/开发者体验

JAM 组件

让我们先快速看一下构成 JAM 的 3个组件; Javascript、APIs 和 Markup。然后,我们会重点关注动态可编程的 API 组件。

Javascript

毋庸置疑,JavaScript 是网络上最流行的编程语言之一。Javascript 允许 Web 应用开发者在 HTML 页面中轻松地进行请求后端服务产生的动态内容。这些安全的 HTTP 请求(由客户端发出)可用于调用远程 API 端点并将结果返回给客户端(应用)。

API

API 是以微服务的形式访问动态数据的一种很好的方式。互联网上有许多公开可用的 API 端点,它们可以返回大量很有用的数据。其中一个例子是太阳系开放数据 API,它可以返回所有行星、卫星、矮星、彗星和小行星等各种数据。

这里有一个例子,说明了我们如何通过 API 获得水星的轴向倾斜。

[https://api.le-systeme-solaire.net/rest/bodies/mercury](https://api.le-systeme-solaire.net/rest/bodies/mercury)

这个 API 服务节点返回相当多的数据,如下所示。

{
 "id": "mercure",
 "name": "Mercure",
 "englishName": "Mercury",
 "isPlanet": true,
 "moons": null,
 "semimajorAxis": 57909227,
 "perihelion": 46001200,
 "aphelion": 69816900,
 "eccentricity": 0.20560,
 "inclination": 7.00000,
 "mass": {
  "massValue": 3.30114,
  "massExponent": 23
 },
 "vol": {
  "volValue": 6.08300,
  "volExponent": 10
 },
 "density": 5.42910,
 "gravity": 3.70000,
 "escape": 4250.00000,
 "meanRadius": 2439.40000,
 "equaRadius": 2440.53000,
 "polarRadius": 2439.70000,
 "flattening": 0,
 "dimension": "",
 "sideralOrbit": 87.96900,
 "sideralRotation": 1407.60000,
 "aroundPlanet": null,
 "discoveredBy": "",
 "discoveryDate": "",
 "alternativeName": "",
 "axialTilt": 0.0352
}

正如这里能看到的,到目前为我们无需设置任何服务器基础设施就可以访问动态内容。让我们快速查看如何使用 JAM 管理该项任务,即几行 Javascript 来得到数据,以及一些 markup 来将数据作为有效信息展示。

Markup

Markup 使我们可以非常容易地创建视觉上令人满意的网页。为了演示这一点,我创建了一个简单的 HTML 页面(源代码在这里),你可以试一下,如下图所示。

NASA/Johns Hopkins University Applied Physics Laboratory/Carnegie Institution of Washington. Edited version of Image:Mercury in color — Prockter07.jpg by Papa Lima Whiskey., Public domain, via Wikimedia Commons

你会注意到,这个 demo 仅使用 GitHub pages托管。当然,你也可以将 HTML 源代码复制到本地的文件夹,并在 PC 本地将它打开。根本不需要运行服务器。使用内容分发网路(CDN)还可以帮助你将客户端的响应时间减到最少。

如果你想生成一个更为花哨的静态站点,有很多软件产品可以帮助你,比如Gatsby 、Hugo、Netlify 、Vercel 等等。

无需服务器,创建和发布你自己的 API 端点

SpaceX, CC0, via Wikimedia Commons

刚刚演示了我们不费吹灰之力地从公开可用的公共端点获取数据。但是……

如果你可以创建和部署自己的 API 端点,但不想要任何额外的服务器,有没有什么办法

评论留言

还没有评论留言,赶紧来抢楼吧~~

吐槽小黑屋()

* 这里是“吐槽小黑屋”,所有人可看,只保留当天信息。

  • Erlo吐槽

    Erlo.vip2021-08-04 23:11:59Hello、欢迎使用吐槽小黑屋,这就是个吐槽的地方。
  • 返回顶部

    给这篇文章打个标签吧~

    棒极了 糟糕透顶 好文章 PHP JAVA JS 小程序 Python SEO MySql 确认