Vercel vs Netlify: Battle of the Jamstack Giants

Jamstack is indeed popular, with the number of sites based on it has grown twofold since 2020. But its performance heavily depends on the deployment platform you choose. The reason is that Jamstack sites are tailored for a certain workflow: hosting HTML on a CDN, serverless functions on an Edge network, and code in Git. Such a deployment strategy makes your site fast as a sparrow. 

On the contrary, a Jamstack site will be just another pile of HTML, only reachable by search engines with the right provider. 

Netlify and Vercel are the two most popular Jamstack hosting platforms, highly regarded in the industry for their reliability and performance. Here, we’ll cover how they compare. 

This is a helpful article if you plan on building a Jamstack website or migrating your WordPress site to Jamstack. But even if you’re just curious about the two deployment platforms, follow on, there’s probably something for you to learn here. 

This post covers

A quick intro into Jamstack 

Jamstack is an approach to web development that guarantees high speed and good security. It’s based on decoupled architecture, meaning that the front-end is completely independent of the content management system (CMS). Even more, these two are usually hosted in different places.

The core principle of Jamstack is that all the content is pre-rendered at build time, so you don’t have any expensive runtime calculations on the server for processing user requests. And, contrary to dynamic server-side rendering, you can deploy your static site on a content delivery network (CDN) for even faster loads.  

You probably heard the buzzword “serverless platforms,” and that’s what a Jamstack site is. Of course, it doesn’t mean there are no servers involved. There should be some servers hosting your HTML. Otherwise, your website won’t be found on the web. And here’s where a Jamstack hosting platform comes in.

We’ve written a comprehensive article about Jamstack. Follow the link if you’re interested to know more.

What is a Jamstack hosting platform?

Well, it seems quite obvious: a Jamstack hosting platform allows you to host your Jamstack website, doesn’t it? Yes, but its role isn’t limited to hosting! 

In the past, hosting providers had a single focus — hosting. Development flow was out of their concern. Now things have changed: a Jamstack hosting provider hosts your site and takes care of deployment and other issues like running edge functions and authorizing users. It connects to your git repository, where your static site generator sits, automatically deploys any changes you push, and puts the generated HTML files on a CDN. 

Yet another feature makes Jamstack SaaS platforms distinct from hosting providers of the past. Now hosting platforms don’t host websites within their own infrastructure but use some underlying services like Google Cloud or AWS. In turn, relying on such trusted cloud services makes your site inherently secure.

Then, why not host a website directly in an AWS elastic container?

Well, if you want to get your hands dirty with infrastructure, you can. But Jamstack providers manage infrastructure for you, thus saving you time and money. 

There are many more things a SaaS hosting platform for Jamstack can do. Find them in the following paragraphs!

What to expect from a Jamstack hosting platform

Here, we curated a list of features a Jamstack hosting platform usually offers:

• Automated builds: Let’s say you’ve pushed some changes to your git repository. Before getting the changes deployed, you need them to be built. A SaaS hosting platform fetches the new code and builds it upon each commit or pull request.

• Continuous deployment: The code changes should be built and automatically deployed. That is, exposed to the users instantly. With continuous deployment and continuous delivery, no human intervention is needed; only a failed test will prevent the changes from being put into action. 

• Site previews: To increase the quality of the developer experience, a SaaS platform creates a unique URL to preview the changes for each new build. This way, your developer team can track any faulty changes. 

• Atomic deployments: A script continuously updates your website in the background while there’s zero downtime on your server. This way, your site stays up and running at all times. 

• Easy rollbacks: If a bug occurs, there is no need to make complicated reverts. To roll back, you can easily deploy any previous build to production. This is possible because each commit provides a snapshot of your site in time.

• Notifications: For each CI/CD event, like a successful or failed build, you can set a notification to be sent to your email or Slack. 

• CDN: A copy of your website lives on a distributed server network. This way, your website stays close to user locations and thus is served fast. Really fast. 

Now that we have explored a Jamstack provider's main responsibilities, we can dive into the Vercel vs Netlify comparison. But first, we’ll say some words about these two providers — who are they and what their goals are. 

What is Netlify?

Netlify is one of the most prominent Jamstack cloud platforms for hosting, deploying, and automating modern web projects founded in 2014. Back then, git-centered workflows were rapidly gaining popularity. The company aimed to provide a convenient cloud build and deploy tool for static site generators hosted on git.

These days, Netlify offers a ton of functionalities and hosts more than 500k websites. This makes for 0.87% of all sites on the Internet. However, among the most popular 10k websites, this number is higher — 3.48% of the top sites chose Netlify as a hosting provider.

Among famous Netlify clients are Peloton, Verizon, and Twilio.

Read more: What is Netlify?

What is Vercel?

Vercel is a cloud platform that enables developers to deliver web projects quickly and efficiently. Just like Netlify, it provides a suite of build and deployment tools. 

The company was founded in 2015 by the same folks who worked on the React-based development framework called Next.js. This is why a lot of Vercel’s serverless deployment tools are optimized to work with Next.js. 

More than 350k websites are hosted on Vercel, which is 0.69% of all websites on the Internet. 1.85% of the top 10k websites opted for Vercel.

The platform’s prominent clients include Meta, McDonald’s and Uber.

Netlify vs Vercel: The lowdown

The platforms are very similar in functionality, but sometimes, one wins over the other. Let’s look at the common points first and proceed to the differences after that.

Basic similarities

Firstly, both Netlify and Vercel provide all the features a serverless Jamstack hosting provider has to offer, which we described earlier.

Both platforms use git to fetch your project and support GitHub, GitLab, and Bitbucket version control providers. By default, your code is retrieved from the main branch, but you can also set the platforms to deploy the code from other branches, for instance, to have a staging environment for testing new features.  

Netlify and Vercel are multi-cloud platforms, meaning they equally employ GCP and AWS for their infrastructure.

Other features that are equally good in both platforms are:

• Dashboard design and visual tooling

• Documentation and support services

• Domain and SSL certificate management

• Security means (both offer two-factor authentication)

In addition, both comply with SOC2 and GDPR legislation, making your site compliant by default.   

Main differences

When it comes to differences, one of the key ones is that Vercel is created by the company that also authored Next.js. And this framework supports not only static sites but also server-side rendering (SSR), so Vercel also hosts SSR-based websites. 

Other differences include the number of add-ons, extensions, and integrations the platforms offer. And here, Netlify is a clear winner as it offers more of such things. What’s better, most of them are available on the free tier. 

Vercel’s clients can integrate third-party services via APIs to replace the missing functionality. While it’s doable, it’s still handier to operate the features native to your deployment pipeline. 

Now let’s proceed to the feature-by-feature comparison. 

Sign-up

Netlify’s sign-up process is straightforward. In fact, you can set up a basic website infrastructure just in one hour. There’s no playing around with CDNs or SSL certificates — the service does everything for you.

But the process is even easier for Vercel: you can put your site online and set up domain configuration in ten minutes, even from your phone! All you have to do is link your GitHub project to Vercel and specify which build commands to run.

Serverless functions

Serverless functions serve as a backend for your website. But with one major difference: scaling, security, and monitoring is none of your concern. In fact, serverless functions are HTTP API endpoints that are represented by separate functions, not a whole backend project. 

Serverless functions are placed in a specific folder in the same repo where your front-end lives. The hosting platform automatically detects and deploys them. Both Netlify and Vercel use AWS Lambda in the background for a serverless function.

But actually, Jamstack sites don’t need any backend most of the time: everything is static, and all the data is retrieved at build time from a CMS. However, in some cases, you may still require custom server data processing: for instance, to avoid exposing sensitive API keys to the public when using Stripe API (they should be communicated via an API backend call).

The core differences in approach to serverless functions between Netlify and Vercel involve:

• Asynchronous execution: Vercel serverless functions are synchronous by nature. Netlify offers “background functions,” which can run for up to 15 minutes asynchronously. You can use them for batch processing or web scraping.

• Edge caching: With Vercel's Edge caching, you don’t run the same function again and again — the results of the first function run will be cached periodically and retrieved from the cache on the consequent calls. This will come in handy if you’re regularly fetching something, say, current cryptocurrency prices. Plus, the feature is available on the free tier. Netlify offers “Edge handlers” with similar functionality, but the feature is still in the trial stage.

• Language support: Vercel offers more language choices. While Netlify supports only Typescript, JavaScript and Go for creating serverless Netlify functions, Vercel also supports Python and Ruby.

Both providers set the maximum function execution time to 10 seconds on the free tier and 60 seconds on the pro plan.

• Feature available in free-tier (both providers): yes

Analytics

Netlify Analytics is an easy-to-use, server-side solution for tracking your website’s visitors and performance. It allows you to gain insights into your audience without any performance drop and is fully compliant with GDPR. You can monitor page views, unique visitors, bandwidth used, top sources, and resources not found.

Vercel also has a similar tool allowing you to track Core Web Vitals (CWV), including loading speed, responsiveness, and visual stability. Vercel’s analytics is implemented as a client-side JavaScript, making your site slower. The JS bundle depends on the framework you're using: currently, Next.js, Nuxt, and Gatsby are supported. 

The key difference here is that Netlify’s analytics is purely server-side, so it doesn’t slow down your site.

• Feature available in free-tier (both providers): no

• Netlify price: $9

• Vercel price: $10 

Forms

Netlify Forms make it easy to receive form submissions on your static site. You just need to enable the feature in the parameters of your form. This way, the form will be automatically detected and set up to receive submissions during deployment. The submitted data will be available in the Netlify dashboard. Additionally, you can export submissions as a CSV file.

Vercel lacks an integrated form solution. You have to go for a third-party service, like Formspree or Web3forms. 

• Feature available in free-tier (Netlify): Yes, 100 form submissions per month.

Authentication

To restrict access to certain content, you can add user authentication to your static website with Netlify Identity. Users can create an account and get registered without having a Netlify account. You can allow any visitor to get registered or switch to an invite-only mode. 

With Vercel, you have to go for a third-party solution like Auth0 or NextAuth.

• Feature available in free-tier (Netlify): Yes, maximum of 1,000 active users.

Split testing

Netlify lets you create A/B testing campaigns to optimize your site easily. It simply splits the traffic between the two branches you want to juxtapose. This way, you can compare performance metrics, i.e., conversion rate, between different feature implementations or client groups. What's more, there's no performance penalty, unlike popular alternatives such as Google Optimize.

Vercel also offers an A/B testing feature that compares click-through and bounce rates and user conversion and engagement.

• Feature available in free-tier (both providers): yes

Large Media

Netlify Large Media is a great way to manage large files like videos and images in your Git repository. This feature is especially useful if you don't have a CMS that handles your image hosting or an image CDN. 

Vercel doesn’t offer anything like this. 

• Feature available in free-tier (Netlify): yes

CLI

As an addition to an online dashboard, both platforms feature CLIs. So, developers can accomplish most of the tasks directly in their terminal. One thing to mention is that Vercel CLI works exceptionally well with Next.js projects. 

• Feature available in free-tier (both providers): yes

Pricing and plans

Now that we’re done with the feature-by-feature comparison, let’s look at pricing. Spoiler: the number of features offered within specific plans may vary, but the cost differences aren’t quite significant. 

A major thing to know is that, unlike Vercel, Netlify allows you to deploy commercial projects within the free tier. While Vercel doesn’t really prevent you from misusing their free tier, they may block you from further platform use if they find out. 

Both Netlify and Vercel offer 100 GB bandwidth on the free tier and up to 1 TB on the Pro plan. While Vercel features 6000 build minutes per month, Netlify provides only 300, but it’s still enough for most cases. And you can purchase some extra 500 build minutes for $7.

Netlify Pro costs $19 per month, and Vercel Pro costs $20 per month. Netlify also gives you a business offer for $99 per month with unlimited form submissions, identity users, large media transformations, and analytics. 

Here are the plan information tables so that you can compare the plans yourself. 

Pros and Cons

Pros

Cons

Conclusion

Vercel and Netlify are both great Jamstack hosting platforms. To choose between them, you have to define the scope of your project. Say, if you’re developing a small-to-midsize website, you should opt for the provider with the free tier features fulfilling your goals. 

I would say go with Netlify if you are creating a small project like a blog. Plenty of services come out of the box, and Netlify’s free tier allows commercial use. 

However, bigger projects may have more specific requirements, so you may opt for Vercel combined with third-party services for authentication, forms, and other needs.

Also, if you’re developing your project with Next.js, Vercel is a great option because all the tools, like CLI, are tailored to work seamlessly with Next.js.

One last thing to consider is serverless functions: Vercel features Edge caching, while Netlify Edge offers asynchronous procedures. So if you’re planning to execute the same Edge function again and again, Vercel should be your choice. Alternatively, if you need to have some background processing, go with Netlify.

No matter which one you choose, try to get the most out of your Jamstack hosting platform.