An Introduction to the JAM Stack

Sunlight Media LLC, an expert inĀ web design services in the Los Angeles area, has kindly provided us with the following article about a major development trend that is happening right now.

One web development trend that has become increasingly popular in recent years is relegating all scripting solely to the client-side, not employing the server for any sort of dynamic processing or data management. This "serverless" architecture has many applications and benefits, with certain methodologies and best practices taking shape into an entirely new direction for web development and single-page web applications. One of the primary and most popular workflows for this new direction is often referred to as the "JAM Stack". This blog post will take a look at what the JAM Stack is, some of its main benefits, as well as some of the many examples of it being used on the web today.

What is the JAM Stack?

Despite its name, the JAM Stack doesn't refer to a specific, concrete grouping of technologies, such as the LAMP (Linux - Apache - MySQL - PHP) or MEAN (MongoDB - Express - Angular - Node) stacks. Rather, the JAM Stack is more a guiding philosophy, comprised of three main components, but fairly agnostic in terms of the actual tools and technologies that can be employed. The three components of this stack are JavaScript, APIs, and Markup.

JavaScript

Given the widespread prevalence and flexibility of JavaScript (especially for client-side scripting), JavaScript serves as the backbone of this development methodology. However, the framework or library that is employed is entirely up to the developer's discretion, whether it be React, Angular, Vue.js, or any of the other numerous JavaScript frameworks available today. Vanilla JavaScript could also just as easily be used for this.

APIs

In most any situation where server-side processing may be required, external APIs can be used. Whether you are wanting to access a third-party service, such as a payment gateway, or just pull in data from an external source, APIs gracefully bridge this group while keeping a website's architecture separate from any server-side processes.

Markup

Markup is used to generate a site's content, pre-built during deployment, often using a static site generator.

Benefits of the JAM Stack

There are numerous benefits to developing a web project utilizing the JAM Stack, many worth taking into consideration when planning the architecture of your next web project:

Performance

Given that JAM Stack websites are pre-built during deployment, they are exponentially faster than sites relying on server-side processing. As site load speed is a primary driver of user's engagement with a site (and their likelihood of returning), this is a hugely important factor.

Security

Since there are no databases or dynamic processes running on a server, security concerns with a JAM Stack project become almost non-existent.

Server Costs / Scalability

Static sites built during deployment are generally considerably smaller than sites requiring server-side processing, resulting in a portability and economy that allows for these sites to be hosted just about anywhere, often through entirely free hosting providers. Should the site ever need to scale up, this can be accomplished easily and cheaply.

Examples

There is a plethora of sites employing the JAM Stack on the web today. The few selected examples below will demonstrate the power, speed and capabilities of this new way of structuring websites and web applications:

Conclusion

While there are still plenty of situations where internal server-side processing may be essential to a website or application, there are a vast amount of existing projects that could be both improved and simplified by employing the JAM Stack architecture. Given the many benefits and few downsides, we are no doubt bound to see the JAM Stack philosophy proliferate in years to come.

Jam Stack is just one of the many web development trends out there it will be wise to consult an expert to know what works best for you.

No Comments Yet.

Leave a comment