DEV Community

loading...
Cover image for Evaluating Supabase

Evaluating Supabase

leibole profile image leibole ・4 min read

Introduction

I'm a freelance web developer working on various projects regularly. I use Firebase a lot when I need to get up and running quickly. I recently heard about "Supabase - the open source Firebase" (in a great podcast episode), and thought I'd try it to see how it stands to the promise. Tl;dr: in a lot of ways it's already better :)
The nickname "Open source firebase" does it a bit of injustice. Unlike firebase, Supabase is based on an SQL database - Postgresql (with all the pros and cons). Supabase also offers a great hosted version of its open source project, with a decent management UI including many features, as well as real time capabilities, on top of a ready made javascript library (more clients to come).

My Use Case

I tested Supabase with one of my existing projects (built with Firebase's Firestore). It is a software for managing zoos, used for keeping track of all the animals in a given zoo. The main entities in the db are "Animals" and "Events". An animal can have many events, and each event can be reported for exactly one animal.
The scale of the project is not big in total, however each zoo has quite a lot of data. There are hundreds of zoos in the system, and each zoo can have thousands of animals and tens of thousands of events.

Supabase Evaluation

To test Supabase, I focused on a number of important criterias: setup, project integration and management UI. Here are my conclusions on there:

Setup

Setting up a Supabase database is very quick and easy. I got a database up and running in about 5 minutes. You also get auto generated docs with the details of the new project. It took a few more minutes to set up my tables from the UI, and configure the schema for my two tables (animals and events).

Integration

The integration into my existing project was really easy, and copied directly from the generated docs. It looks like this:

const supabaseUrl = "https://edvkppzqwycrasvjykbo.supabase.co";
const supabaseKey = "<LONG_KEY>";
const supabase = createClient(supabaseUrl, supabaseKey);

const { body } = await supabase
     .from("events")
     .select("*")
Enter fullscreen mode Exit fullscreen mode

Unlike most of the projects I work on, this code "just worked" on the first attempt. I was very surprised. There are still some ways for Supabase to go in terms of authentication - the key used here is only suitable for server environments, but still the integration is easy.
User Interface
The user interface offered by Supabase is very useful. A user can create, edit and manage tables directly from the UI, as well as run queries and see results. It is still very glitchy, I met a lot of bugs in just my short usage. Nonetheless, its usability is already far broader than that of Firebase or Firestore.

The supabase UI

Performance Evaluation
The main reason that led me to look for a Firebase alternative is the lacking performance. At the moment I'm sometimes querying for thousands of records at once, which can take a few seconds in Firebase. This hurts user experience and leads to compromises in the UI I implement, to keep these performance issues from showing.
I tested the performance in a few stages:
Migrate the data:
I chose a single zoo and transferred its data. I wrote a script to read the data from Firebase, and write it to Supabase.
All it took to write 31,666 rows of data to Supabase was this one row (I wrote a few more lines of code for preparing the data):

   await supabase.from("animals").insert(animalsToWrite);
Enter fullscreen mode Exit fullscreen mode

It also worked super fast, around 10-15 seconds for the write to complete.
Compare reading the data in Supabase and Firebase:
Here is the code for reading the events rows from Firebase:

const readFirebaseData = async () => {
 console.time("test");
 const events = await db
   .collection("zoos")
   .doc("example")
   .collection("events")
   .get();

 console.log(events.docs);
 console.timeEnd("test");
};
Enter fullscreen mode Exit fullscreen mode

And The result - 28 seconds for reading 16,753 documents from firebase:
Screen Shot 2020-10-21 at 11.20.23

Similarly, the code for testing Supabase was:

const readData = async () => {
 console.time("test");
 try {
   const events = await supabase.from("events").select("*");
   console.log(events.length);
 } catch (e) {
   console.error(e);
 }

 console.timeEnd("test");
};
Enter fullscreen mode Exit fullscreen mode

And result - a whooping 31,666 rows read in the 1.5 seconds:
Alt Text

Bonus: Easy BI Integration

As part of my project the web application is connected to a BI system - Google Datastudio. To use it with Firebase, I need to first copy the entire DB into a structured DB, like Big Query. I use a process that runs once a day, and copies all the Firebase data into BigQuery.
When using Supabase, copying the data is not needed. Supabase provides each project with a dedicated DB. The DB URL is easily found in the management UI. I just passed this URL to the BI system and Violla! The system is connected to a great BI.

The Downsides

Like anything, Supabase has its downsides:

  • The real-time functionality still cannot be securely enough used from client code.
  • Authentication still has a ways to go for it to be possible.
  • The UI is very glitchy and very raw. I found numerous annoying bugs just by using it for about half an hour. I had to connect with my local psql client to get around them.
  • The pricing is free for now, which seems weird. I worry that when I get to larger amounts of data I might be limited. Another worry is that they will begin to charge large sums when I'm seriously locked in.
  • I didn't see a parallel to Firebase Functions, where I could extend the app's functionality with custom serverless code, triggered by events from the Firebase database.

Conclusions

Supabase looks very promising. Offering an easy to setup and use Postgresql DB, with great client libraries seems like a no brainer. The performance is great, and ease of use is as good as it gets.
Nonetheless, the product is still in alpha, and it shows. I will wait a couple of months for some of the issues to be sorted out. After that, I will definitely attempt to migrate my app to Supabase.
The performance enhancements could be gained just by moving to a standard managed postgres DB, but combining the ease of use Supabase offers drives it over the edge for me.

Discussion

pic
Editor guide
Collapse
swyx profile image
swyx

great benchmark results!

"Authentication still has a ways to go for it to be possible."

can you elaborate please? i dont understand what you mean. they added auth a few months ago. supabase.io/docs/library/user-mana...

Collapse
leibole profile image
leibole Author

Hi,
As mentioned in the article, the problem is with the real-time engine. When a user signs in using the built-in auth system, he gets his own key with row-level permissions. However, this key is not used for the web sockets enabling the real-time engine. For that reason, this same user can listen for real-time changes in the rows of other users. The team behind Supabase promises this is their next feature, we'll have to wait and see.

Collapse
swyx profile image
swyx

ah I see. that wasn't obvious in the initial reading. thanks,

Collapse
leibole profile image
leibole Author

P.S - yes, the benchmark results are great, I would love for someone else to validate my findings :)