top of page
Writer's pictureALIF Consulting

Selling a Serverless web application solution to customer

Updated: Jun 14

This reference architecture shows a Serverless Web Application. The application serves static content from Azure Blob Storage and implements an API using Azure Functions. The API reads data from Cosmos DB and returns the results to the web app.

serverless web application solution

The term serverless has two distinct but related meanings :

  • Backend as a service (BaaS). Back-end cloud services, such as databases and storage, provide APIs that enable client applications to connect directly to these services.

  • Functions as a service (FaaS). In this model, a "function" is a piece of code that is deployed to the cloud and runs inside a hosting environment that completely abstracts the servers that run the code.


Both definitions share the idea that developers and DevOps personnel don't need to deploy, configure, or manage servers. This reference architecture focuses on FaaS using Azure Functions, although serving web content from Azure Blob Storage could be an example of BaaS. Some important characteristics of FaaS are:

  1. Compute resources are allocated dynamically as needed by the platform.

  2. Consumption-based pricing: You are charged only for the compute resources used to execute your code.

  3. The compute resources scale on demand based on traffic, without the developer needing to do any configuration.

Functions are executed when an external trigger occurs, such as an HTTP request or a message arriving on a queue. This makes an event-driven architecture style natural for serverless architectures. To coordinate work between components in the architecture, consider using message brokers or pub/sub-patterns.


Architecture

The architecture consists of the following components:

Blob Storage

Static web content, such as HTML, CSS, and JavaScript files, are stored in Azure Blob Storage and served to clients using static website hosting. All dynamic interaction happens through JavaScript code making calls to the back-end APIs. There is no server-side code to render the web page. Static website hosting supports index documents and custom 404 error pages.


CDN

Use Azure Content Delivery Network (CDN) to cache content for lower latency and faster delivery of content, as well as provide an HTTPS endpoint.


Function Apps

Azure Functions is a serverless computing option. It uses an event-driven model, where a piece of code (a "function") is invoked by a trigger. In this architecture, the function is invoked when a client makes an HTTP request. The request is always routed through an API gateway, described below.


API Management

API Management provides an API gateway that sits in front of the HTTP function. You can use API Management to publish and manage APIs used by client applications. Using a gateway helps to decouple the front-end application from the back-end APIs. For example, API Management can rewrite URLs, transform requests before they reach the back end, set request or response headers, etc.


API Management can also be used to implement cross-cutting concerns such as:

  • Enforcing usage quotas and rate limits

  • Validating OAuth tokens for authentication

  • Enabling cross-origin requests (CORS)

  • Caching responses

  • Monitoring and logging requests

  • Cosmos DB

  • Azure Active Directory (Azure AD) :

  • Azure Monitor :

  • Azure Pipelines :

  • GitHub Actions :

Function App plans

Azure Functions supports two hosting models. With the consumption plan, compute power is automatically allocated when your code is running. With the App Service plan, a set of VMs are allocated for your code. The App Service plan defines the number of VMs and the VM size.

Note that the App Service plan is not strictly serverless, according to the definition given above. The programming model is the same, however — the same function code can run in both a consumption plan and an App Service plan.


Here are some factors to consider when choosing which type of plan to use:

  • Cold start

  • Timeout period

  • Virtual network isolation.

  • Pricing model

  • Scaling

Considerations


Scalability

Functions

For the consumption plan, the HTTP trigger scales based on the traffic. There is a limit to the number of concurrent function instances, but each instance can process more than one request at a time. For an App Service plan, the HTTP trigger scales according to the number of VM instances, which can be a fixed value or auto-scale based on a set of autoscaling rules.

Cosmos DB

The throughput capacity for Cosmos DB is measured in Request Units (RU). A 1-RU throughput corresponds to the throughput needed to GET a 1KB document. In order to scale a Cosmos DB container past 10,000 RU, you must specify a partition key when you create the container and include the partition key in every document you create.

API Management

API Management can scale out and support rule-based autoscaling. The scaling process takes at least 20 minutes. If your traffic is burst, you should provision for the maximum burst traffic that you expect. However, autoscaling is useful for handling hourly or daily variations in traffic.


Disaster recovery

The deployment shown here resides in a single Azure region. For a more resilient approach to disaster recovery, take advantage of the geo-distribution features in the various services :

  • API Management supports multi-region deployment, which can be used to distribute a single API Management instance across any number of Azure regions. For more information.

  • Use Traffic Manager to route HTTP requests to the primary region. If the Function App running in that region becomes unavailable, the Traffic Manager can fail over to a secondary region.

  • Cosmos DB supports multiple write regions, which enables writes to any region that you add to your Cosmos DB account. If you don't enable multi-write, you can still fail over the primary write region. The Cosmos DB client SDKs and the Azure Function bindings automatically handle the failover, so you don't need to update any application configuration settings.

Cost optimization

Use the Azure pricing calculator to estimate costs. Consider these points to optimize cost of this architecture.

Azure Functions

Azure Functions supports two hosting models.

  • Consumption plan: Compute power is automatically allocated when your code is running.

  • App Service plan: A set of VMs is allocated for your code. This plan defines the number of VMs and the VM size.

In this architecture, a function is invoked when a client makes an HTTP request. Because a constant high-volume throughput is not expected in this use case, a consumption plan is recommended because you pay only for the compute resources you use.


Azure Cosmos DB

Azure Cosmos DB bills for provisioned throughput and consumed storage by the hour. Provisioned throughput is expressed in Request Units per second (RU/s), which can be used for typical database operations, such as inserts and reads. The price is based on the capacity in RU/s that you reserve.

Storage is billed for each GB used for your stored data and index.

In this architecture, the function application fetches documents from Cosmos DB in response to HTTP GET requests from the client. Cosmos DB is cost-effective in this case because reading operations are significantly cheaper than write operations expressed on RU/s.


Content Delivery Network

The billing rate may differ depending on the billing region based on the location of the source server delivering the content to the end user. The physical location of the client is not the billing region. Any HTTP or HTTPS request that hits the CDN is a billable event, which includes all response types: success, failure, or other. Different responses may generate different traffic amounts.

In this reference architecture, the deployment resides in a single Azure region.

To lower costs, consider increasing the cache TTL by caching resource files for a longer duration and setting the longest TTL possible on your content.


108 views0 comments

Recent Posts

See All

Comments


bottom of page