Comparing Hosting Solutions: Netlify, Cloudflare, and Vercel

Originally published: 31 December 2023

All free solutions, but these results may just surprise you!

speedtest

Through the Lens of SpeedVitals

In the dynamic world of web hosting, selecting the right provider is crucial for ensuring optimal site performance. SpeedVitals offers a comprehensive way to evaluate hosting providers, focusing on key metrics like Time to First Byte (TTFB). This blog post dives into the performance of three major players: Netlify, Cloudflare, and Vercel. For the main body of this I will be using sureshkhirwadkar.dev for testing, as this is the site I’m most interested in, for obvious reasons. As a comparison though at the end I’m going to compare against a fresh, standard Next.js app, deployed on Cloudflare, AWS Cloudfront, Vercel and Netlify. The results might just surprise you!

What is TTFB?

TTFB stands for Time to First Byte. It is the time taken by the browser to receive the first byte of data from the server. A low TTFB value results in a better user experience. To ensure that a website has a low TTFB worldwide, our tool measures it from 40 different locations.

This tool performs the TTFB test on a single resource at a time. This resource could be anything on the web such as an HTML Page, an image file, a font file, a CSS stylesheet, or a JavaScript file. This can help measure the response time of your origin server or CDN Provider across the globe. We recommend repeating the test a couple of times to obtain accurate results as this ensures that resource is cached and served from your CDN Provider’s closest datacenter.

Q.Does TTFB matter?

Yes, it does matter! Having a low TTFB ensures a great user experience due to nearly instant page load times (assuming the rest of your page speed metrics are also good). If the TTFB is high, the user has to wait on a blank screen until the server responds. TTFB has a major indirect impact on Web Vitals Scores.

Q.What is the different between TTFB Test and Website Speed Test?

TTFB Test performs the test on a single resource (such as a CSS File, HTML Document, or Image) to see how fast it loads. While the Website Speed Test loads all the resources on a Web Page just like a browser does and calculates the page speed based on that.

Q.How can I improve TTFB?

You can improve TTFB by using a CDN, optimizing your backend code & database performance, using Memory Caching, and by using a better hosting provider that provides better hardware resources. You can refer to our guide to improve TTFB.

Cloudflare’s Performance

Cloudflare

Performance Grade: B
Performance Score: 77%
Average TTFB: 340 ms

Cloudflare emerges as a reliable option with a B grade and a performance score of 77%. Its average TTFB of 340 ms is commendable. Notably, Cloudflare offers an advanced feature known as Argo Smart Routing. Argo analyzes and optimizes routing decisions across the global Cloudflare network, potentially reducing latency and improving TTFB further. For sites with a global audience, this could be a significant advantage.

Netlify’s Capabilities

Netlify

Performance Grade: C
Performance Score: 70%
Average TTFB: 352 ms

Netlify, with a C grade and a 70% performance score, shows a slightly higher average TTFB of 352 ms compared to Cloudflare. While it’s a touch slower, Netlify is often praised for its ease of use, particularly for projects linked with modern frameworks and static sites. Its continuous deployment from Git and serverless backend services are a draw for developers seeking a streamlined workflow.

Vercel’s Edge

Vercel

Performance Grade: B
Performance Score: 83%
Average TTFB: 234 ms

Vercel stands out with an impressive B grade, the highest performance score of 83%, and the fastest average TTFB at 234 ms. This positions Vercel as a top choice for performance-oriented developers, particularly those working with React and Next.js. Vercel’s focus on frontend frameworks and its global edge network are likely contributors to its superior TTFB.

What Could Be the Fastest Solution?

While each provider has its strengths, the quest for the fastest TTFB and hosting solution is ongoing. Cloudflare’s potential with Argo Smart Routing hints at a possibility for even lower TTFB, challenging Vercel’s current lead.

Let’s have a quick look at Thomas J Frank’s website. If you don’t know who he is, he’s a popular YouTuber and a Notion expert.

Here’s his results:

thomasfrank

This may mean Argo Routing via Cloudflare is the fasted TTFB solution

For developers and site owners, the choice may come down to specific needs:

Does TTFB really matter though?

Yes and No.

Why TTFB Matters:

  1. First Impression of Speed: TTFB is often the first indication of a website’s responsiveness. A lower TTFB can contribute to a perception of a faster, more responsive site.

  2. SEO Impact: Search engines like Google consider site speed as a ranking factor. While TTFB is just one aspect of speed, it does contribute to overall site performance, which can affect your site’s search engine rankings.

  3. User Experience: In scenarios where a user is waiting for a page to start loading, TTFB can be critical. Longer TTFB can lead to higher bounce rates as users might not wait for the site to load.

  4. Performance in Slow Networks: For users on slower internet connections, a high TTFB can significantly impact the overall loading time, making the site feel sluggish.

When TTFB Might Be Less Critical:

  1. Content-Heavy Sites: For websites where the bulk of the loading time is consumed by downloading content (like large images or videos), the TTFB might be a smaller portion of the overall load time.

  2. Caching and Content Delivery Networks (CDNs): If your site heavily relies on caching and CDNs, the TTFB might be less noticeable to return visitors as much of the content is served from cache.

  3. Complex Backend Processing: For applications that require significant server-side processing before the first byte can be sent, optimizing TTFB might not be the primary concern. Instead, focus might be on optimizing the backend processing.

  4. Application Nature: If the primary interaction with the application doesn’t require frequent loading of new pages (e.g., single-page applications), TTFB may be less of a concern after the initial load.

Conclusion:

TTFB is a valuable metric, especially for sites aiming to provide a fast, responsive user experience and good SEO rankings. However, it’s just one aspect of website performance. It’s important to consider TTFB in the broader context of overall site speed, user experience, and the specific needs of your site or application.

Does shaving ~ 0.2 seconds off the load time make any real world difference? That is perhaps questionable.

Otherwise while Vercel currently leads in speed in my usecase, Cloudflare’s Argo option presents a potential for even greater performance. Netlify, while slightly slower, still holds its ground with user-friendly features. Ultimately, the fastest hosting solution may depend on the unique requirements of each site and its audience.

Bonus

The picture may not be quite as straight forward as it seems here though. If you want to see what happens when I test a new, fresh, standard Next.js app with these providers, including Cloudfront, then click here

Read Count: 0


⬅️ Previous Post

Add social share to your Next.js or React apps

Next Post ➡️

Understanding creative commons: a guide to open licensing