On the 1st of May 2023, Vercel announced that it was adding a brand new capability to its platform offering, Vercel Storage. This added capability is a big game changer for Vercel as it means customers can now build more complex applications entirely within their eco-sphere.
When it comes to modern JS cloud hosting and continuous integration platforms, I recently created a video called Best NextJs Hosting Provider? Netlify Vs Vercel Vs GitHub Pages. Watch the video if you want to learn more about these three platforms, however, one point that helped made Netlify stand out from the crowd is that it ships with more capabilities compared to its competitors. Now that Vercel has this new offering, my first question was how does this shape the hosting landscape?
In this article you will learn all about Vercel storage, what it offers, and how you can use it. We will then compare this offering and see how it stacks up against its rivals!
In terms of rivals, the main modern cloud competitors typically would include Netlify, AWS Amplify, Cloudflare Pages, Azure Static Web Apps, and GitHub Pages. While Azure Static Web Apps is built on top of Azure which does offer storage options, the Azure Static Web Apps is pretty basic and the service itself does not offer anything. To use storage with this service you need to know how to use Azure which is not trivial. GitHub Pages offer a very basic offering without storage, which is why I rule these two out of the comparisons made below. This means we are left with Netlify, AWS Amplify, and Cloudflare Pages.
If you are intrigued to know which one of these services is the best, read on 🔥🔥🔥
Vercel Storage comes in 5 flavors. In the first category, you have the capability to store your data using one of many out-the-box Vercel integrations into a third-party service like AWS, Mongo, Hasura, or Cockroach DB.
Using a third-party option is neat, however, the real game-changer with the new Vercel Storage offering is that you can now create and store data within Vercel itself.
Typically with data storage, you have two main use cases, user data, and application data. As applications have different requirements and needs, this is why Vercel offers four different types of storage:
- Vercel KV (Redis)
- Vercel Postgres (Postgres SQL)
- Vercel Blob (Large media)
- Vercel Edge Config (Low-latency data store)
In essence, if you need to store data within your project you can use KV or Postgres. For simple key-value needs, use KV and if you need a relational database, use SQL. Finally, if you need to store large media, files, etc... create a new blob storage container.
The good news is that all of these services are offered on both Vercels Pro and Hobby plans, meaning you can try either before you need to pay for anything!
To get going with storage, you will need to log into the Vercel UI and set up the appropriate storage. Storage can be created either at the global level or the project level using the aptly named
Storage tab. The benefit of creating storage on the project level is that Vercel will automatically create environment variables for you. Remember that within your application, you will need to authenticate your requests before you can access that data!
As you would expect, Vercel has also released a number of related NPM packages to go with these new capabilities. Examples of how to install some of these packages are shown below:
An example of how to query for data in SQL is also shown below:
The documentation for all of the services offered within Storage is pretty good. You can inspect this yourself here. Here you will find quickstart guides and code samples to help you get up and running!
All in all, Vercel storage is an impressive service that is going to give you a lot more power to build more complex sites with Vercecl!
Cloudflare offers lots of capabilities ranging from CDN, hosting, as well as storage. Storage comes in two flavors Cloudflare R2 Storage and KV storage. KV storage is a key/value data offering for storing configuration and basic data.
R2 is aimed at storing larger assets like photos and videos. All Cloudflare storage is built on top of Cloudflare's globally distributed edge network. This means that accessing all data is fast as access is made using the node closest to the client. As data is stored on the edge, you also get high available storage, ensuring that data is always accessible even in the event of a single data center outage.
In terms of code, you can access all storage via a REST API. Cloudflare provides you with a web-based dashboard to manage data that provides some level of usage metrics.
As Cloudflare does not offer SQL capabilities and there is no plugin/integration feature, its services are not quite as on par with Vercel!
AAWS mplify provides you with two means of storage, user file storage, and App data storage. In terms of file storage, you can use S3. In terms of application data, you can use a NoSQL database backed by Amazon DynamoDB. Like Vercel this data can then be accessed via a REST API and a lambda function.
Ampilg does not offer SQL storage, however, as you are in AWS you can create an Amazon Aurora MySQL PostgreSQL database and then connect things manually yourself within a lambda function. Amazon has created set-by-step guides that can be found here on how to wire these services together.
To create Amplify storage, you can use the Amplify CLI:
amplify add storage
To access the store in code, you can install the
aws-amplify NPM package locally, like this:
npm install aws-amplify
Even though you have the same capabilities as Vercel, I think setup with Amplify is more complex in general to use. I'm not saying it's impossible, however, there are a few more hurdles to jump through.
Whenever I have previously compared Netlify with Vercel, the typical result will be Netlify has either the same capability as Vercel or it offers a slightly more advanced service. This comparison is no longer true when we compare Storage.
Netlify definitely lacks in its storage offering. Netlify offers large media/blob storage capabilities and not much else. The large media offering will take any large item that you need to host and minimize it for performance gains. This service is kind of like what Git Large File Storage offers.
Using environment variables, you can also say Netlify offers some level of cloud key/value storage but definitely not to the same level as the other service reviewed today. There are no APIs to access this data in code easily and this option is more of a hack than a service.
Netlify does offer an integration and plugin network. This means that you can use storage in your application using services like Turso, TiDB, and Cockroach.
Now I'm not knocking on any of these companies, however, my big issue with this offering personally is that I need to sign-up with another provider in order to do data. If I want to set up a Redis or SQL database, I need to go outside the platform to make it work. This will obviously affect performance as the database and code are not in the same data centers. All in all, if you need a very data-powered application, Netlify is not your best option!
If you need to build a NextJS website and you need a database to power it, Vercel is now probably your strongest option. As it has integrations and an offering of user and data storage, you will have no issues finding the right option for your project.
Amplify is also a great option here with its offers, however, set-up is a little harder. In terms of Vercel pricing, you get a hobby tier for free with 30,000 Requests for KV, 60 Compute Hours for Postgres, Blob storage is still in beta, and 50,000 reads/month for edge config.
AWS Amplify pricing is more complex. They have pay-as-you-go and a 12-month free hosting option. After 12 months, you get pushed to pay as you go payment. In pay-as-you-go, data storage will cost you $0.023 per GB per month. This means that for most sites, the Vercel hobby tier will be a cheaper long-term option with better storage.
Out of the four options, as Netlify does not provide any data offering, it loses the battle. In terms of Cloudflare, KV is $0.50/GB-month with a 1GB free tier whereas R2 is $0.015/GB-month with a 10GB free tier.
As we are not comparing apples with apples in terms of the way the pricing is measured, it's hard to be certain which option is cheapest for your stack, but, finger in the air guess I would say it's not unreasonable to expect hosting costs to be in the same ballpark between the two. The big noticeable difference though is the lack of a SQL server offering with Cloudflare
I hope this article arms you with enough data to make an informed decision. I really like Vercel's new service and I think it's a really big feather in their caps. Happy Coding 🤘