Static Site has been prevalent in the last 5 years. Today, I am going to talk about what is a static site, and why make your site static? What static site generators can be used for your work?
Should you move your dynamic website to static now?
What is a static site?
Why static site?
Is making a static site an old technology like the website in the 90s? Yes and No. There are many benefits if you’re making a content-heavy website with little server interactions, e.g. blogs, media sites, company & personal websites, etc.
Since there are no server-side functions, you can put the website to any Content Delivery Network (CDN) and it can run in blazing speed. In traditional server and client-side server architecture, it takes a long time when you make a request to the server and server process the data from the database and give you back what you need.
With a static site, the files are distributed to various datacenters of the CDN. If you’re in Hong Kong, you can retrieve the content from the nearest server in a network like Singapore or Japan.
When you as the visitor request a website, CDN will give you the static file you need. There is no further processing to render the file.
As you may know, a development stack like LAMP (Linux, Apache, MySQL, PHP) or MEAN (MongoDB, ExpressJS, AngularJS, and Node) takes up huge memory from the server. When there are more visitors to your website, the cost will grow crazily to scale up your infrastructure.
With static sites, you only put your files on CDN, which is cheap as free for Github Pages, Cloudflare Workers, Netlify, Vercel, etc. If you’re using your own infrastructure, AWS S3 is a good choice. The infrastructure can be greatly slashed by 80 – 90% if you’re having tens of thousands of visitors per day.
At the same time, the system administrators are free from firewall setup, geo-distribution, server & libraries upgrade, server scaling, high-availability setup, security audit, SSL renewal, etc. The server team can focus on other meaningful tasks.
When the server-side functions are completely removed, the security risk is much lower. Under a static site, there are only files. Hackers can hardly manipulate loopholes existed in your frameworks & programming languages.
When your site is distributed on the CDN, the performance can be highly optimized. Even with more than 10,000 concurrent requests, the web page can be returned in a split second. The auto-scaling capability is auto built-in.
What are the catches?
If you are looking to deliver a dynamic experience to each individual visitor, it’s not going to work. With so many benefits, there are new limitations applied.
Whenever you make an edit, you’ll need to deploy your changes to CDN again. The deployment will be worked with git commands. The time cost may be high if you need to make small changes like a typo, team editing very often. As a solution, you’ll need a headless CMS to deploy your changes.
Static Site Generator
Static Site Generator (SSG) is the tool to generate your site into a folder of static files. The files will be exported in a designated hierarchy to be uploaded to CDN later.
Currently, the most popular options are Hugo, Gatsby, Jekyll. Other options can be checked here. These tools are open source toolkit available for free. According to the current trends, Hugo is the fastest generator now. It can export more than 150 pages under 1s. If you’ve got a large site with thousand pages, Hugo probably is the right way to go.
Should I go with static sites?
It always depends. If you’re running a WordPress site with mostly static content, a static site can be the right fit for you. If there are many dynamic parts lying in, cache optimization maybe another better option for you.
Trying to move static? feel free to have a chat with us! Ping us via firstname.lastname@example.org