It is time to reinvent the web. The basic architecture for web publishing is two decades old. Netscape Navigator 1.0 was released in December 1994 and HTTP/1.1 was first documented in 1997. WordPress came out in 2003 and astonishingly around 50% of all websites today still run on Apache and Microsoft web servers.

Traditional web applications have required overly complex configurations and painstaking operations of an immense amount of compute, storage, networking and security hardware. Load balancers, firewalls, application and database servers all need to be sized to support peak capacity traffic. By definition these systems are wildly overprovisioned and thus wasting substantial sums of money.

The cloud provides effectively limitless storage and compute capabilities, yet most companies still design, build, test, deploy, monitor, scale and secure the presentation layer of their web applications with a combination of legacy technologies. Even worse, these outdated technologies are expensive to update and run, woefully insecure and painfully slow.

What if a new architecture could enable a simplified workflow for designers and UX developers, perfectly match capacity requirements with consumption, remove chronically insecure elements all without complex configurations and operational wizardry?

“The way to get started is to quit talking and begin doing.” — Walt Disney

Well there is a new and better way – and the best description that I have seen so far is called the JAMstack. J stands for JavaScript, A for APIs and M for Markup. It involves an entirely new workflow and tool chain from design to deploy. It provides operator-less massive serverless scalability, several orders of magnitude lower cost, blazing performance and a dramatically decreased security attack surface. This new serverless web architecture may finally unlock a new business model that truly aligns vendor and customer – outcome-based pricing.

The workflow of this new application architecture still begins with the visual design phase. Designers have historically used tools from Adobe but that is changing and newer solutions like InVision, Sketch and Figma have slick authoring and collaboration capabilities. In most cases these tools generate pictures that are then handed off to UX engineers to code. Ideally there would be some means by which some or all of the output details from the design tool could be leveraged within code. There are some promising ideas from companies like Haiku around extracting design elements or even Modulz to provide code generation.

Another important part of the new front-end workflow is the decoupling of the content in the form of a headless content management system. Instead of putting content into a full web content management system (WCMS) like WordPress or Drupal, the modern UX stack and workflow separates content to simplify access for content authors/owners but also for other systems and processes through APIs. The leading headless CMS vendor is Contentful, but there are many strong open source offerings and so new solutions here may need to add industry specific content and workflows.

While UX engineers have historically been somewhat fickle and religious about their choice of frameworks, it finally appears that a component based framework model has won out. React and Vue are the dominant offerings and both have tremendous open source adoption and vibrant ecosystems. The component model on the front-end has similarities to the microservices model on the backend in that it promotes reusability and scalability. One of the most promising open source projects around the creation and reuse of components is StoryBook, which is framework agnostic and Chroma is adding cloud features to facilitate important collaborative workflows.

The next stage in the workflow is the build process and this is where all the previous elements are compiled through a mis-named tool called static site generators (SSGs). Rather than dynamically generating each page at runtime, this architecture instead pre-builds all the pages upfront. The resulting prebuilt pages can still have dynamic elements (like user names, prices, etc.) which are resolved at runtime through JavaScript APIs or GraphQL queries, but the majority of the page content can be prebuilt. While there are several popular open source SSGs, Gatsby has one of the largest communities and a growing ecosystem. In addition, they have a new commercial SaaS offering called Gatsby Preview to automate and accelerate the build process.

Once the site/application is pre-built then there must be a continuous delivery process to version and deploy the site. Netlify is the dominant solution for hosting and they have specifically built a content delivery network for this new architecture and workflow. Netlify has also added analytics capabilities but there are lots of other web application and infrastructure needs that should be delivered from the CDN edge by leveraging offerings like Netlify Functions and Cloudflare Workers.

All of these workflows and code are best managed inside of a git-based repository to enable efficient sharing and versioning. By defining and leveraging a consistent and repeatable set of processes, this allows for more frequent iterations and thus an improved software development and delivery model.

There are a few more stages to the operational workflows around web sites/applications which involve testing and monitoring. User interface application testing started in the early 1990s with Mercury WinRunner, which was subsequently disrupted by open source Selenium (named as a cure for Mercury poisoning). However, today Cypress.io looks to be the emerging winner for page level interface test automation. Web logging and analytics started with early pioneers like Webtrends and later Omniture, but Google Analytics has become the dominant provider.

More recently, the data privacy backlash and regulatory changes have created a new market opportunity within the web log and analytics categories. New companies have emerged that provide privacy controls like Fathom and others like Watchly offer an integrated logging and actions platform that can be run as a native serverless solution. Many of these new offerings are architected to run within a customer’s cloud environment (and even serverless) so that storage and compute are under the control of the enterprise.

“Twenty years from now you will be more disappointed by the things that you didn’t do than by the ones you did do. Explore, Dream, Discover.” — Mark Twain

The JAMstack is a ripe area for a broad range of startup opportunities and Mango Capital is keenly interested to connect with entrepreneurs rethinking web infrastructure, security and application needs within a serverless / JAMstack architecture.

** Disclosure – Mango Capital is a proud investor in Netlify, Gatsby, Chroma, Haiku and several other companies around the JAMstack.