Years (decades) ago we were making websites with all kind of technologies which needed server power, be it ASP.NET WebForms, ASP.NET MVC or e.g. PHP. Over time we got introduced to Jamstack and the split between frontend and APIs allowed for client-only solutions (mostly JavaScript-based) like Angular and React.
Hosting solutions followed this shift and allowed for cheaper ways to provide global hosting as we no longer needed hard compute (e.g. VMs) for significant parts of websites. On Azure, this was enabled with Static Website on Blob Storage which can be as simple as putting your web files (compiled, transpiled, …) on Azure Blob Storage and put an Azure CDN in front of it.
Over the past 4-5 years I’ve coached plenty of teams building web sites with (mainly) Angular and using this solution. Even a few months ago I got the question from a friend asking ‘Is this learn path for Static Website still the way to do it?’
Note: Static Website on Blob Storage is still working and supported by Microsoft, and probably will be for years to come. It’s up to you to decide if you migrate to Static Web Apps.
I never put a hard request with the teams to change their working setup, however on greenfield projects I challenged them to look at a new kid on the block: Azure Static Web Apps.
The ’new’ kid: Azure SWA
Azure Static Web Apps (SWA) have gone GA in May 2021, so it is far from new. Yet, many teams have no clue that this service exists and still only consider Static Websites on Blob Storage, hence this post. In short (and much simplified), you can now do the same thing as you did with Static Website on Blob Storage in a simpler way. E.g. you no longer have to clear the CDN cache yourself anymore, simply publish your website and everything is managed by Microsoft.
SWA also allows you to use serverless Azure Functions for the API part of your solution in case you have e.g. a Node backend. Since quite recently you can even just deploy hybrid Next.js solutions and Microsoft will provision an Azure App Service to enable your server-side rendering or server components. This is big deal with the current move back to server-side rendering and a point where regular static hosts currently come short.
Comparing both
To prevent writing a book, I’ll already share this comparison on the Microsoft devblogs by April Edwards in 2021.
| Static Web Apps | Azure Static Site on Blob Storage |
|---|---|
| Fully managed PaaS | PaaS, but a bit more setup |
| Lock down with EntraId for AuthC/AuthZ | RBAC on the blob container or build yourself into SPA |
| Custom domains (in combo with Azure DNS), free SSL | Custom domains and SSL managed in the CDN |
| Automatic provisioning for # staging environments | Do it yourself |
| Add your API on Functions with seamless CORS | Simply host static content |
| Automatically clear CDN cache on deploy | Clear CDN cache yourself |
| Max 500 MB per app | Unlimited storage |
As you can see, this service brings a lot of benefits. Except for a few edge cases, e.g. huge sites running into limits I would typically opt for the newer Static Web Apps. There is still the option to offload large files like media content to blob storage with CDN, but keep the power off Static Web Apps for the site itself.
A possible downside is that since it’s fully managed, you’re currently unable to list the actual files deployed (for as far as I’m aware) to troubleshoot issues.
Note: I have been using Static Web Apps for my blog since 2021, with automatic deploys through GitHub and I would not go back to compute.