建站
咨詢
售后
建站咨詢
新聞中心
Jamstack是什么?
Jamstack 指的是一套用于構(gòu)建現(xiàn)代網(wǎng)站的技術(shù)棧，可能過去的一些文章通常會把它們理解為 JavaScript、APIs、Markup，但其實現(xiàn)在這個概念已經(jīng)被擴大了，Jamstack 的官網(wǎng)上將它的核心概念歸納為 Pre-rendering、Enhancing with JavaScript、Supercharging with services。
成都創(chuàng)新互聯(lián)公司專注于洛川企業(yè)網(wǎng)站建設(shè),響應式網(wǎng)站建設(shè),商城網(wǎng)站建設(shè)。洛川網(wǎng)站建設(shè)公司,為洛川等地區(qū)提供建站服務。全流程按需定制網(wǎng)站，專業(yè)設(shè)計，全程項目跟蹤，成都創(chuàng)新互聯(lián)公司專業(yè)和態(tài)度為您提供的服務
For fast and secure sites | Jamstackjamstack.org
當然掉書袋沒什么意思，用人話來解釋的話，當下絕大多數(shù) Jamstack 網(wǎng)站，都是這樣的技術(shù)棧：
1. 使用網(wǎng)站生成器預渲染整個網(wǎng)站
整個網(wǎng)站在部署前，會被網(wǎng)站生成器(SSG, Static Site Generators)構(gòu)建和優(yōu)化為一系列的靜態(tài)頁面和靜態(tài)資源，這樣整個網(wǎng)站可以被托管在 CDN 上，加載速度得到最大程度地優(yōu)化，安全性也得到保障。
這里的網(wǎng)站生成器包括但不限于：Gatsby、Hugo、Jekyll、Eleventy、NextJS……
2. 使用 Headless CMS(無頭 CMS)管理動態(tài)內(nèi)容
如果想要網(wǎng)站承載動態(tài)內(nèi)容，那么可以接入各種 Headless CMS(無頭 CMS)，這些 CMS 系統(tǒng)會對外提供 API，網(wǎng)站生成器可以調(diào)用這些 API 拉取數(shù)據(jù)，將動態(tài)數(shù)據(jù)渲染成為靜態(tài)頁面。
這里的無頭 CMS 包括但不限于：Ghost、Strapi、Netlify-CMS、TinaCMS……
3. 使用 HTTP API 增強網(wǎng)站的功能
在登錄注冊、評論框等需要后端支持的能力上，Jamstack 網(wǎng)站通常會使用微服務提供的 HTTP API，或者一些第三方的 BaaS(后端即服務)能力。
除了以上三個主要特點以外，Jamstack 的網(wǎng)站通常還會有下面的特性：
- 全站托管于 CDN 上
- 原子化發(fā)布(每次發(fā)布都是一次全量、原子性的發(fā)布)
- 靈活的文件緩存策略
- 基于 Git 的全自動構(gòu)建、部署流程
Jamstack有什么優(yōu)勢?
1. 相比于純靜態(tài)網(wǎng)站
純靜態(tài)的網(wǎng)站很難承載動態(tài)的內(nèi)容，內(nèi)容改動通常都是要直接修改頁面的代碼，這對于內(nèi)容管理人員(很可能是非技術(shù)人員)來說非常不友好。
而 Jamstack 的網(wǎng)站，通常會使用無頭 CMS 來將內(nèi)容管理抽離出去，內(nèi)容管理人員可以直接在這些 CMS 系統(tǒng)的 UI 界面上進行內(nèi)容修改，然后觸發(fā)整個網(wǎng)站的重新預渲染，以及部署。
2. 相比于傳統(tǒng)動態(tài)網(wǎng)站
這里的“傳統(tǒng)動態(tài)網(wǎng)站”指的是用 PHP、Ruby On Rails、JSP 甚至更古老的 CGI 構(gòu)建的網(wǎng)站，以及基于這些技術(shù)產(chǎn)生的建站工具比如 WordPress、Drupal 等等。
這些傳統(tǒng)網(wǎng)站的劣勢在于，它們在運行時都需要一個實時在線的服務端，這些服務端負責處理請求、渲染頁面，這就很大程度上降低了服務的可伸縮性和穩(wěn)定性(想象一下，你遷移擴容一個在線的 WordPress 網(wǎng)站有多么麻煩)。
Jamstack 由于是直接使用 CDN 分發(fā)靜態(tài)的頁面，完全不需要渲染頁面的服務，網(wǎng)站的伸縮性、穩(wěn)定性可以得到最大的保障。
3. 相比于單頁應用(SPA)
大概五年前，隨著各種前端框架的成熟，越來越多的業(yè)務邏輯遷移到了前端處理，這也就誕生了 SPA 的概念，也就是整個網(wǎng)站的 UI 層，由瀏覽器端來完全接管。得益于 HTML5 和現(xiàn)代瀏覽器的一系列特性，這樣的做法可以保證最好的用戶體驗。
但是 SPA 最大的問題在于它對 SEO 不友好，因為 SPA 的頁面內(nèi)容都是靠瀏覽器異步獲取、渲染的，雖然 Google 為首的大多數(shù)搜索引擎漸漸地支持爬取 SPA 的內(nèi)容，但是這依然是一個隱患。另外，由于 SPA 需要異步加載數(shù)據(jù)，首屏內(nèi)容需要在在加載、運行 JS 之后才能看到，也給用戶打開網(wǎng)站的體驗帶來影響。
而 Jamstack 的頁面本質(zhì)上都是托管在 CDN 上的靜態(tài)頁面，搜索引擎可以直接爬取這些靜態(tài)內(nèi)容，首屏與靜態(tài)網(wǎng)站一樣，可以直接展示內(nèi)容，而不需要等到加載運行 JS 之后。
4. 相比于 SSR 應用
目前市面上的幾大前端框架都支持了服務器端渲染，也就是 SSR 的概念，這些 SSR 技術(shù)也成為了 Jamstack 的基礎(chǔ)之一。但是典型的 SSR 應用和傳統(tǒng)動態(tài)網(wǎng)站一樣，都是需要一個在線的服務來渲染頁面，同樣會有運維和安全性上的風險。
Jamstack 從技術(shù)角度上講，可以認為是 SSR 技術(shù)的進階，也就是提前用 SSR 預渲染大部分頁面，然后將這些頁面部署在 CDN 上，隨后根據(jù)網(wǎng)站的數(shù)據(jù)變化，重復預渲染、部署即可。
當然，Jamstack 也不是萬金油，不可能完美適應所有場景，Jamstack 最適合一些內(nèi)容更新不太頻繁的網(wǎng)站(比如新聞、電商、文檔)。它不適合 Feeds 流、聊天室、論壇、個性化推薦這樣高度動態(tài)化的網(wǎng)站，以及郵箱、編輯器這樣偏重型的 Web 應用。
Jamstack的商業(yè)價值
在國外的電商行業(yè)，Headless Commerce(無頭電商)是一個非常火的概念。
所謂的無頭電商，就是把用戶端的 UI 展現(xiàn)和整個電商后臺服務進行解耦，去除掉了 UI 層，也就是“頭”，畢竟每個公司都不想自己的網(wǎng)站、購買體驗和別人一樣。
無頭電商只對外暴露一系列的 API，讓客戶公司可以使用這些 API 構(gòu)建自己的電商網(wǎng)站。舉一些具體的例子，比如 Salesforce 正在推行的 Open Commerce API，逐漸成為現(xiàn)在電商開放 API 的標準。換句話說，這個做法很類似現(xiàn)在國內(nèi)很多公司在推行的“中臺化”、“大中臺小前臺”的概念。
所以這和 Jamstack 有什么關(guān)系呢?
你會發(fā)現(xiàn)，Jamstack 推行的這一套技術(shù)棧，包括預渲染動態(tài)數(shù)據(jù)的靜態(tài)頁面、無頭 CMS、微服務 HTTP API，幾乎和無頭電商的理念完全一致，或者說，無頭電商就是 Jamstack 一個最貼切的應用場景。
在前段時間 Vercel 舉辦的 Next.js Conf 上，主要贊助商除了 AWS、Github、Firebase 這樣的云平臺以外，大部分都是適用于 Jamstack 的第三方 API 提供方、或者一些無頭 CMS，這也從側(cè)面體現(xiàn)了 Jamstack 目前在國外的生態(tài)繁榮。
但是在國內(nèi)市場上，或許不那么樂觀：國內(nèi) Web 網(wǎng)站本身就處于一個很尷尬的狀態(tài)，各大公司的主要業(yè)務都是以移動端 App 為主要入口，Web 網(wǎng)站缺少流量來源，或許只有一些特性類型的業(yè)務(比如新聞、電商網(wǎng)站)需要 Web 站點;電商市場方面，國內(nèi)大部分中小型公司都處于嚴重缺乏信息化的狀態(tài)，更多依賴于阿里、京東這樣的大平臺方提供的基礎(chǔ)系統(tǒng)，還遠遠沒有自建整套流程的需求，無頭電商也就無從談起。
尾聲
從技術(shù)角度上講，Jamstack 本質(zhì)是一種增強的靜態(tài)網(wǎng)站，它的出現(xiàn)很大程度上得益于各大云廠商提供的云上能力，包括更容易管控的 CDN/DNS、Serverless Function、DevOps 工具等等。
隨著國內(nèi)相關(guān)云計算基礎(chǔ)設(shè)施的成熟，Jamstack 在國內(nèi)幾家云平臺的支持程度也會慢慢提高，我們完全可以期待未來 Jamstack 部分替代傳統(tǒng)的 WordPress 等建站工具，變成新一代的建站技術(shù)棧。
網(wǎng)頁標題：下一代Web建站技術(shù)棧Jamstack，你了解嗎？
當前鏈接：http://www.5511xx.com/article/coepgsp.html
