Do you use the best static site tech stack?
Updated by Brook Jeynes [SSW] 4 months ago. See history
Pure HTML pages are the fastest website around. However, server-side scripting languages enable richer functionality. Static sites solve this problem by providing the best of both worlds. Static sites are:
- Cheap
- Easy to use
- Fast
On the other hand, complex functionality can be a bit more limited and time consuming to implement.
Here are some popular static site generators:
Features
| Name | NextJS (Recommended) | Gatsby 🪦 | Astro | Hugo | Builder.io |
| Language | React | React | Most major JS frameworks via islands | Go | Customizable |
| Data Handling | Fully customisable | GraphQL | Fully customisable | Customizable | Fully customisable |
| Data Sources | Fully customisable | Filesystems, CMS, APIs, Databases, Local files | Fully customisable | Filesystem | CMS, APIs, Customizable |
| GitHub Pages Integration | Requires setup | Seamless deployment via config files | Deployment via GitHub Actions | Deployment with GitHub Actions | Customizable |
| TinaCMS integration | ✅ | ✅ | ✅ | ✅ | ✅ |
Note: 🪦 Gatsby is no longer being actively developed.
Market Share
(Data captured in late 2024)
| Name | Next.js (Recommended) | Gatsby | Hugo | Astro | Builder.io |
| GitHub Stars | 127,000 👑 | 55,000 | 75,000 | 47,000 | 8,000 |
| NPM Downloads (Weekly) | 6,000,000 👑 | 260,000 | N/A | 247,000 | N/A |
| Stack Overflow Questions | 92,000 👑 | 15,000 | 6,000 | 2,000 | 100 |
| BuiltWith Sites | 1,400,000 👑 | 126,000 | 167,000 | 483,000 | N/A |
| State of JS (2023) | 57% used it 👑 | 17% used it | N/A | 17% used it | N/A |
| Google Trends Rank | 1st 👑 | 4th | 3rd | 2nd | 5th (almost 0 data) |
Figure: Google trends for the above SSGs. In a substantial lead is NextJS, followed by Gatsby
Figure: NextJS and Gatsby are the major competitors that have been duking it out, lately Next.js has exploded in popularity
Two examples of static sites in action are SSW People and SSW Rules.
There are a few hosting options to choose from including:
| Name | Description | Pros | Cons |
| Vercel | A fast, developer-friendly platform optimized for frontend frameworks like Next.js, with built-in CI/CD and global edge deployment. Vercel is recommended for applications built using Next.js. | 🚀 Automatic deployments, fast CDN, Next.js support, serverless functions. | ❌ Limited free tier, can be costly for high traffic. |
| Azure static web apps | Microsoft's solution for deploying static sites with integrated APIs, authentication, and automatic GitHub/Azure DevOps deployments. | 🔄 Integrated with Azure Functions, authentication, GitHub Actions, free tier available. | ❌ More complex setup. |
| Azure static storage | A simple, cost-effective way to serve static files from Azure Blob Storage with CDN and custom domain support. | 💰 Cheap storage costs, integrates with Azure CDN, scalable. | ❌ No built-in CI/CD, manual setup needed. |
| Cloudflare | A high-performance static site host leveraging Cloudflare’s global CDN, DDoS protection, and edge computing capabilities. | 🌍 Free global CDN, DDoS protection, edge functions, fast builds. | ❌ Limited build minutes on free tier, less backend flexibility. |
| GitHub Pages | A free, GitHub-integrated static site hosting service, best suited for personal projects, documentation, and Jekyll-based blogs. | 🆓 Free for public repos, easy integration with GitHub, supports Jekyll. | ❌ Limited to static sites, no server-side processing, slower updates. |
| Surge.sh | A lightweight, CLI-based static hosting service that’s quick to deploy and great for simple, no-frills web apps. | ⚡ Super simple CLI deployment, free tier available, custom domains supported. | ❌ Fewer features, no built-in CI/CD, not ideal for large-scale projects. |