googlearchive / firebase-util

An experimental toolset for Firebase
http://firebase.github.io/firebase-util
MIT License
276 stars 67 forks source link

Issue with $key in fb-util infinite scroll #104

Closed md-rashid closed 7 years ago

md-rashid commented 7 years ago

I am using fb-util for infinite scroll and everything looks good. However, once I hit the 250 elements, I am seeing the following error. Any idea what this is about ?

Error: Query: When ordering by key, you may only pass one argument to startAt(), endAt(), or equalTo(). at Jh (https://www.gstatic.com/firebasejs/3.2.1/firebase.js:431:117) at X.g.Nd (https://www.gstatic.com/firebasejs/3.2.1/firebase.js:441:298) at r._grow (https://<>/content/script/firebase-util.min.js:10:8979) at r._listen (https://<>/content/script/firebase-util.min.js:10:10961) at r.goTo (https://<>/content/script/firebase-util.min.js:10:8062) at r.moveTo (https://<>/content/script/firebase-util.min.js:10:3672) at r.next (https://<>/content/script/firebase-util.min.js:10:17083) at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:198:424 at xa.(anonymous function) (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:59:133) at l.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.8/angular.min.js:126:84)

Code: var baseRef = firebase.database().ref().child(refPath); var scrollRef = new firebase.util.Scroll(baseRef, '$key'); scrollRef.scroll.next(25); var list = $firebaseArray(scrollRef); list.scroll = scrollRef.scroll;

Front-end code: "div infinite-scroll="vm.products.scroll.next(10)" infinite-scroll-distance="1""

katowulf commented 7 years ago

No idea, but firebase-util is not compatible with 3.x, see #96

katowulf commented 7 years ago

Looks the same as #100.

md-rashid commented 7 years ago

also, not sure if it helps, but changing from $key to $priority or $name stops the error. However, after a certain limit array elements are replaced. so we keep getting new elements, but older ones are replaced.

md-rashid commented 7 years ago

So, while I do not have an answer for the first part of the question, based on the additional note, I have this fix:

var scrollRef = new firebase.util.Scroll(baseRef, '$priority', {maxCacheSize: 750, windowSize: 500});

Setting the maxCacheSize and windowSize to a higher value should solve the issue. As per documentation, if we exceed windowSize then the start of the array is trimmed to keep the size under limit.

Documentation:

Keys/values that can be passed via opts:

{int} windowSize: the maximum number of records to have loaded in the list at any given time. 3-5 times the size of the viewable window is a good optimization, depending on how fast content is scrolled and the payload of each record (i.e. how long it takes to download).
{int} maxCacheSize: in general, leave this as the default. This controls the internal cursor's cache, which is used to find the current position in the list. This controls how many keys it can load at any given time. This is, by default, three times the size of windowSize and should always be larger than windowSize.