Does Firebase cache the data?

Question

I read somewhere a claim that Firebase caches the data.

So I ran this test that reads a semi large volume of data (about 400KB).

Here is the relevant code.

firebase.initializeApp(config);

var counter = 0;

console.time('firebase answered in');
firebase.database().ref('texts').once('value',onData);

function onData(snapshot){
  console.timeEnd('firebase answered in');

  counter ++;
  if(counter > 20) return;

  setTimeout(function(){
    console.time('firebase answered in');
    firebase.database().ref('texts').once('value',onData);
  },2000);
}

As you can see, the first time it loads data it takes a while, and subsequent calls take much less time.

firebase answered in: 1279.422ms

firebase answered in: 236.378ms

firebase answered in: 228.595ms

firebase answered in: 202.700ms

firebase answered in: 208.371ms

firebase answered in: 214.807ms

etc

But, still, if the data is cached locally ~200ms (sometimes more) seems like a lot of time to access local data. Enough for the user to perceive a delay when rendering the UI.

So is Firebase caching the data? What is happening in those ~200ms?

Good question. And the fiddle made it incredibly easy to figure out what's going on. Answer below. — Frank van Puffelen
– Frank van Puffelen, Commented Jul 17, 2016 at 16:58

Community · Accepted Answer · 2020-06-20 09:12:55Z

60

Firebase caches the data (in memory) for as long as there is an active listener for that data.

Since your code uses only once() listener, the listener is detached immediately when the data is received (before your callback is invoked) and the data is cleared from the cache. That means that is has to get the data from the servers for each once(), which apparently is a 200ms round-trip in your case. The first load is slower, because the connection is likely established in that call.

A quick trick to verify this is to add a permanent listener before starting your loop:

firebase.initializeApp(config);

var counter = 0;

console.time('firebase answered in');
firebase.database().ref('texts').on('value',function() {});
firebase.database().ref('texts').once('value',onData);

function onData(snapshot){
  console.timeEnd('firebase answered in');

  counter ++;
  if(counter > 20) return;

  setTimeout(function(){
    console.time('firebase answered in');
    firebase.database().ref('texts').once('value',onData);
  },2000);
}

With that simple change, the logging turns into:

firebase answered in: 580.575ms

firebase answered in: 4.040ms

firebase answered in: 7.569ms

firebase answered in: 5.739ms

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Jul 17, 2016 at 16:56

Frank van Puffelen

603k85 gold badges895 silver badges869 bronze badges

Sign up to request clarification or add additional context in comments.

13 Comments

Pier Over a year ago

Good to know. It would be nice if the data remained cached for a bit longer since sometimes the same data will be needed some seconds later. Where can I make a feature request?

Pier Over a year ago

Also, do you think using an empty function to keep the cache active is a viable strategy?

Frank van Puffelen Over a year ago

All I did was explain the behavior. Whether that is what you need is for you to decide. In general I'm not a big fan of once() in general, it's typically an anti-pattern when using Firebase.

Frank van Puffelen Over a year ago

That sounds like a perfectly valid flow. We recommend similar flows for Android and iOS.

Mikko Paderes Over a year ago

@FrankvanPuffelen, you said that we need an active listener to keep things cached. However, your first listener is a once. This isn't an active listener right? Shouldn't it be on or am I missing something?

|

Collectives™ on Stack Overflow

Does Firebase cache the data?

1 Answer 1

13 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

13 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related