We’re not talking about breakfast here, although you could make an alphabet cereal from all the technology stack acronyms powering the internet.

What is a technology stack? In the context of websites, a technology stack is the combination of all the technologies used to build a website or a single-page application (SPA)—also called a solutions stack or data ecosystem.

If you aren’t familiar with technology stacks but are running a website, chances are you are running the LAMP stack, which is powering your content management system (CMS). Popular CMS platforms like Wordpress, Drupal and Joomla all run on this Linux operating system, Apache host (server), MySQL database and PHP (coding language) technology stack.

The LAMP stack, while tried and true, is an aged technology stack that has been around since dinosaurs were crawling the internet, and although many sites have run just fine over the years employing these technologies, those that wish to be on the cutting edge of speed, performance, interactivity and usability have had to seek elsewhere, especially if they are interested in taking the foray into SPAs. This is because this tech stack requires the web server to do a lot of heavy lifting, and each web page on a LAMP stack site you visit requires a new web request and a complete refresh of all the content viewable in your browser. SPAs powered by modern technology stacks streamline performance leveraging the client (your computer) to do a lot of the work rather than waiting for the server to make many calculations and then send over a response (which gets compounded the more people who simultaneously visiting your site).

While the name may infer it, SPA does not necessarily mean that your website is only one page—at least not the way a user sees it. What it means is that the web server is sending you one main payload at a single URL location. This can happen because modern technology stacks rely heavily on JavaScript, the client-side coding language that powers interactivity on the web. This code then uses a bit of trickery to show different URL locations in your web browser, even though you haven’t actually navigated away from the initial page.

This approach does wonders for speed, and because these sites are built primarily on JavaScript, they can have very engaging interactive features. The surging popularity of this approach has caused many organizations to seek out modern stacks such as MEAN/MERN or more recently, GRAND. MEAN/MERN is MongoDB, Express, either Angular or React, and Node.js (a runtime environment that takes JavaScript out of the confines of a web browser). GRAND is GraphQL, React, Apollo and Neo4j Database. There are quite a few others out there, but the idea is the same—leveraging the power of JavaScript to deliver rich web experiences. However, for many organizations, a complete overhaul of one’s technology stack may not be feasible due to many reasons—especially due to the time and manpower involved in making it happen.

So how do organizations with less resources compete with those on the cutting edge? The answer is a technology stack that provides a bridge between old and new technologies, and sets up websites to be ready for the future—the JAM stack. This stack uses JavaScript, APIs, and Markup. All web content comes to the website via an API connection, usually in JSON format. Templated HTML/JavaScript markup will then interpret the data sources and content and components accordingly. Watermark’s preferred JAM stack approach uses React.js/JSX as the JavaScript/Markup portion of this stack. Because all data comes via API, almost anything with open data can be used, which means your legacy Wordpress site and database can be used thanks to the CMS’s built in RESTful API (more alphabet cereal, I know!). This is the same for Drupal, Shopify and many other data platforms.

Often, this data is not well optimized so users are often downloading much more data than necessary just for a few web pages. It is not uncommon to download the code for the majority of the site, even though a web page only requires a small portion of that code to run. Lastly, JAM stack sites utilizing tools like Gatsby are very SEO-friendly. Unlike unoptimized SPAs, the majority of a website’s content is statically rendered in a way that search engines can easily digest and understand. Also, the commitment to performance means any search algorithms that reward page speed will be impressed that data resources have been well partitioned and optimized to reduce bloat and serve content as quickly as possible.

Technology is constantly changing, so if your organization is still utilizing an older technology stack like LAMP, you may be falling behind. But that doesn’t mean you have to scrap everything and do the absolute latest and greatest either. You can set yourself up for success by using the JAM stack and partnering with a group that can help you bridge the old with the new.