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

2021/08/26 18:30
阅读数 78

作者: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

这个 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 端点,但不想要任何额外的服务器,有没有什么办法 🤔 ?

我们不仅可以访问开放数据(如上所示) ,编写自己定制的逻辑来处理数据、图像和视频。我们还可以与其他人共享我们开发的 API 端点(自定义函数) 。

Serverless 服务

顾名思义,serverless 服务让开发者在不运行自己的服务器的情况下提供 API 服务。开发者只需要上传一段代码就可以提供服务。公有云一般来说提供两种 serverless 服务。

  • Database-as-a-service (DaaS) 数据库服务为 Jamstack 应用提供基于云数据库的存储与查询服务。它用来管理应用的状态,比如用户数据的存储。
  • Function-as-a-service (FaaS) 函数服务提供无状态的计算。它通常支持多种编程语言与框架,与数据库或者云存储服务一起为 Jamstack 应用提供逻辑后端。

细心的读者可能已经发现,在公有云上部署 serverless API 服务并不完全适合 Jamstack 的理念。J 与 M 都已经通过边缘云部署了,为什么 A 不行呢?在边缘云上部署 serverless 函数的需要新一代的轻量级软件容器。这是 CNCF 旗下的 WasmEdge 这种 WebAssembly 沙箱的重要应用场景。

WasmEdge 网址:https://github.com/WasmEdge/WasmEdge

Rust 函数计算服务

WasmEdge 可以部署在边缘云与边缘设备上。它符合 OCI 标准,能被 CRI-O 与 Kubernetes 这样的工具调度与管理。WasmEdge 可以让开发者用 Rust 语言写安全高性能的函数服务,也可以支持为场景定制的 DSL 低代码解决方案。

在这篇文章,我们用 Second State 公司基于 WasmEdge 发布的一个免费 FaaS 服务作为示例,来演示怎么用 Rust 语言开发部署 Jamstack 应用的 serverless API 服务。

网址:https://www.secondstate.io/faas/

Second State 提供了跨云的 FaaS 基础设施,可以使用它来创建、部署和调用自己的定制函数。无论你想创建一个全新的 web 应用,迁移你现有的 web 应用,还是仅仅增强你 web 应用的客户端 ,基于 WasmEdge 的 FaaS 都是很好的选择。甚至不需要用户名和密码。所有的调用都是通过开放的 Web 、通过安全的 HTTP 请求执行的。几分钟内就可以部署一个自己的应用。

这里有许多精彩的预建 demo 和教程,使你能够学习如何创建自己的 FaaS 端点。这些预构建函数(demo)包括:

  • 图像分类 (教程、demo)
  • 面部识别 (教程、 demo)
  • 发送邮件 (教程、demo)
  • 给图片打水印 (教程、demo)
  • 在视频中识别食物 (教程、 demo)
  • 解迷字母异位词

链接不可点击,访问 https://www.secondstate.io/faas/ 了解更多或者点击阅读原文。

你也来试试吧!

这里的要点是,你可以创建自己的代码执行服务,即在不提供任何基础设施的情况下运行自己的自定义代码。Second State 的 FaaS“允许开发者在不管理服务器的情况下在云中上传和执行代码”。

下一步

这篇文章,我们介绍了 Jamstack 的基本概念,以及如何基于 WasmEdge 根据自己的需求快速开发出一个动态的 API。下一篇,我们将介绍如何在目前大火的 Vercel 中使用 WebAssembly Runtime/WasmEdge 在 Jamstack 应用中使用 Rust 函数来编写 API。


点击阅读原文,查看文中所带链接

本文分享自微信公众号 - WebAssembly 中文社区(webassemblywasm)。
如有侵权,请联系 support@oschina.cn 删除。
本文参与“OSC源创计划”,欢迎正在阅读的你也加入,一起分享。

展开阅读全文
加载中

作者的其它热门文章

打赏
0
0 收藏
分享
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部