Have you heard of the term JAMstack? In recent years, it has become a popular way to describe a set of technologies used together to achieve web development goals. Just like LAMP and MEAN, JAMstack represents a combination of technologies. But what does JAMstack really mean?
JAM is an acronym for JavaScript, API, and Markup. It refers to a trend in web application and website development that revolves around several key characteristics:
-
Dumb web server (or CDN): Instead of relying on a traditional server-side rendering approach, JAMstack apps rely on a “dumb” web server or Content Delivery Network (CDN) to serve pre-generated HTML. This HTML is typically generated using a static site generator and does not require real-time rendering.
-
JavaScript-driven interactions: JAMstack apps are capable of loading JavaScript scripts that can interact with APIs to fetch data. This enables dynamic content and actions, such as navigation, without relying on traditional backend operations.
-
API-based authentication: Authentication in JAMstack apps is performed through APIs rather than traditional backend authentication methods.
The JAMstack approach sets itself apart from other web development methods, including:
- Traditional websites that serve pre-defined content, such as static sites.
- CMS-based websites that rely on a database to load content dynamically.
- Server-rendered applications using backend languages.
Furthermore, JAMstack apps differ from client-side rendered websites, such as those built with React, which may include a server-side rendered portion. The JAMstack does not rely on server rendering at all.
So, what are the advantages of using the JAMstack?
-
Speed: JAMstack apps are incredibly fast because the HTML is pre-generated, eliminating the need for backend operations. This allows for quick serving of static content, especially when served through a Content Delivery Network (CDN).
-
Efficiency: Without a backend, JAMstack apps have no bottlenecks, such as database queries, resulting in efficient performance.
-
Cost-effectiveness: Serving resources through a CDN is much more cost-effective compared to serving them through a backend server.
-
Security: By exposing the backend only through an API, JAMstack apps provide enhanced security.
The JAMstack approach is gaining traction due to its lighter, more efficient nature when compared to traditional server-rendering methods. For instance, a typical WordPress site makes numerous database requests for each page load, which can cause crashes under heavy traffic. In contrast, serving static HTML pages is much more efficient, and dynamic data can still be fetched using separate API calls.
Some popular technologies used to build JAMstack apps include Gatsby, Next.js, Nuxt, and Hugo, among others. The possibilities are endless, with JAMstack being suitable for various applications ranging from simple blogs to e-commerce websites (for example, with Snipcart).
In my case, my blog falls under the JAMstack umbrella. All the HTML is generated at deploy time, making it a seamless and efficient web experience.