Static vs dynamic websites: what are the differences?
Choosing between dynamic and static architectures when building a website can be challenging—and now there’s hybrid to consider too. This article reviews the pros and cons of all three choices to help you make that decision.
Dynamic websites are backed by a traditional server and database, making them better at serving personalized or real-time content than their static counterparts. Static websites use a content delivery network (CDN) and headless CMS to serve the same pre-generated content to every user. These features make static websites faster and more secure at the expense of content personalization.
Hybrid websites are an emerging third choice born out of a need to keep the speed and security gains of static, but to also include dynamic elements when needed. Because they are still hosted on a CDN, hybrid sites rely on new technologies like edge computing and serverless functions to display dynamic content.
Say for example you wanted to show real-time weather information to your users. Possible, and pretty straightforward, on both dynamic and hybrid sites. Impossible on a purely static site because you have no way of knowing the user location.
|Uses a traditional server||Uses a CDN||Uses a CDN|
|Higher maintenance cost||Lowest maintenance cost||Low maintenance cost|
|Does not scale automatically with traffic spikes||Automatically scales with traffic spikes||Automatically scales with traffic spikes|
|Best for a traditional database or CMS||Best with a headless CMS or serverless database||Best with a headless CMS or serverless database|
|Content is localized before page load||Content is localized after page load||Content is localized before and after page load|
|Average security by default||Enhanced security by default||Enhanced security by default|
Luckily, if you understand your project needs and can evaluate the strengths and weaknesses of each architecture, choosing between them doesn’t have to be a mystery.
So which should you choose for your next project? The tried-and-true dynamic, the speed of static, or a cutting-edge hybrid?
Despite the industry shift towards static and hybrid sites, dynamic architectures are still by far the most common way of building websites.
Here is why dynamic sites are everywhere:
- Server-side processing: A traditional server enables you to respond to the http request based on factors like user location and browser cookies to give a fully personalized user experience. Because this is all happening server-side, you can avoid loading spinners or flashes of content. Servers also make it easier to accept form submissions, instantly publish new content and render previews.
- Familiar CMS platforms: In all likelihood, your client or team are already at least partially familiar with WordPress or Drupal. These are mature content platforms with robust community support, making onboarding easier.
- Tried and true: Websites have been developed this way for a long time. The underlying technologies, like PHP, are proven and well-established.
These strengths and the lack of alternative choices have made dynamic websites almost ubiquitous. However, there are some major drawbacks to dynamic sites that are driving developers to consider more modern alternatives:
- Slower: Although proper caching strategies can help with website speed, the user’s experience will be degraded by distance. Fundamentally, if your user is in Australia and your server is in New York, there’s only so much that can be done without a devops team.
- Scaling challenges: Dynamic websites often struggle when there is a sudden surge of traffic because the servers can’t scale up quick enough. Your product goes viral on social media, but suddenly no one can access your website? Not good.
- Security vulnerabilities: Keeping your server patched and software updated can help with security threats, but your data is exposed on the open web—just one zero-day exploit away from being hacked.
Dynamic websites are a good fit for businesses whose requirements include real-time content updates or highly localized content, like a news editor that needs to quickly publish a breaking story, or a global business that needs internationalization into ten different languages. However, as we will see below, hybrid websites are becoming an increasingly viable choice, even in these highly dynamic use cases. Whatever the choice, a headless CMS like Sanity can support both dynamic and hybrid architectures.
Unlocking the potential of static websites has taken fifteen years of technological improvements: CDNs that can cache content across the globe, easier version control via git, static site CMSes, static site generators, webhooks, and hosting with integrated CI/CD.
Today developers love static websites because:
- Modern frameworks and headless CMSes: Modern frameworks and static site generators like Next.js, 11ty and Gatsby, coupled with a headless CMS like Sanity, unlock a great experience for developers and authors alike.
- CDN hosting: Content delivery networks, like Netlify, Vercel or Cloudflare, let you easily distribute your static website across the globe so users have a fast and seamless experience. No more 500 server errors after your content goes viral!
- Security: Because static websites are just a collection of raw assets without a traditional server, there is very little surface area for hackers to target.
However, there are some notable cons:
- No server: Some seemingly basic web development tasks are tricky to do when you don’t have a traditional server available. Have you ever tried to take a basic form submission on a static website? You can’t without a server. Want to check a browser cookie before page load? Nope, not without a server.
- Build times: While build times are improving, they’re still a concern for larger static sites, especially if the static site generator has to process images too.
Static websites have some hard limitations due to the build process and the lack of a server. But if you understand these limitations, the speed, developer experience, and security benefits are unparalleled. Static websites are a great choice for use cases like basic marketing pages and documentation, where content updates are not time-sensitive, and users are shown the same content regardless of their location.
It is probably best to think of hybrid websites as existing on a spectrum. On one end, you may have an almost entirely static website with a single serverless function handling a contact form. On the other end, you might have something like Shopify’s new Hydrogen framework with a fully dynamic e-commerce layer on top of a static page shell.
So what are the best aspects of a hybrid website?
- All the pros of static: With a hybrid website, you keep all the pros of a static website like CDN hosting, modern frameworks, developer experience, headless CMSes, and a great user experience.
- Serverless functions: Serverless functions let you securely communicate with APIs on page load or after user input while keeping the security benefits of static. Handling a form submission is a common example.
- Edge computing: Edge computing happens at the CDN level before page load, allowing for dynamic content without any flashes of content. NextJS’s new middleware is a popular example of edge computing.
At first glance, this seems like the perfect solution. We have all the benefits of static, but we still get the benefits of dynamic.
But there is a con. A big one:
- New and emerging technology: The tech required for a hybrid website is so new that some of it is still in beta or experimental releases. Other features have just reached a stable release in the last year. Serverless functions have been around for a bit longer, but they run after the page load and this limits what they can do.
Hybrid websites appear to be the future and are quickly seeing mainstream adoption. As with any technology, however, this rollout will take time, and the products will improve with age.
While the options can seem overwhelming at first, it’s good to remember how far website development has come in the last twenty-five years. The fact that we have these choices means the technology is adapting to our needs, and those of our users.
But if you are still struggling to choose, here are two final points to consider.
- Are you more comfortable with PHP or Ruby? If so, it might make sense to stick with a dynamic architecture for now. While it’s no longer new, platforms like Ruby on Rails and Laravel continue to improve and have long term community support.
Whatever your choice—dynamic, static or hybrid—Sanity will be right there with you for all your content needs! Sanity gives you a future-proof platform to store structured content, including a world-class authoring experience, multilingual support, and an approachable developer API.