Meteor collections vs localStorage

Hi everyone! I’m new to the community and to Meteor and excited to learn everything about it. :slight_smile: I’ve started building an app and I’m wondering about the differences between Mongo.collections and localStorage. For this app, data that I want to keep in the server and data that I’d like to in each client storage, however when I add Meteor.methods on the client the methods don’t register and and I can’t write data to the collection. Is there a way to use Mongo.collections for storing data in the client (similar to localStorage) or should I use localStorage directly for this?

1 Like

You might be thinking of client-only Mongo collections, which you create like this:

ClientData = new Mongo.Collection(null);

But this is different from HTML5 localStorage in that once the browser session is closed, the Mongo collection is destroyed, whereas localStorage is permanent.

1 Like

Oh ok I think I got it now, thanks!!

Just to make sure I’m not over architecting the Mongo.collection, is something like this what I’d have to do to use it in a localStorage?

if(!localStorage.getItem('MyCollectionList')) { MyCollectionList = new Mongo.Collection(null); localStorage.setItem('CutUpsList', JSON.stringify(MyCollectionList)); } else { MyCollectionList = JSON.parse(localStorage.getItem('MyCollectionList')); }

Hmm… that doesn’t look quite right. What are you trying to do exactly? Are you trying to sync the client-side Mongo with localStorage? I’ve commented your code with the issues:

if (!localStorage.getItem('MyCollectionList')) {
  MyCollectionList = new Mongo.Collection(null);

  // we just created MyCollectionList and it's empty, why would you stringify it?
  // you're also trying to stringify a Mongo cursor, not the contents of the collection
  localStorage.setItem('CutUpsList', JSON.stringify(MyCollectionList));
} else {
  // this is wrong, you need to use methods like insert and update on MyCollectionList
  MyCollectionList = JSON.parse(localStorage.getItem('MyCollectionList'));
}

You might want to read up a bit here:
http://docs.meteor.com/#/full/mongo_collection

Here’s a package I made to sync a client only collection to local storage. Might help.

https://atmospherejs.com/jeffm/local-persist

@frozeman made a version optimized for larger datasets:

https://atmospherejs.com/frozeman/persistent-minimongo2

3 Likes

The reason I stringify is because localStorage stores only string values, as far as I know.
Basically what I want is to have the collection persist in localStorage while not in the server, and this code works to do that
If the collection doesn’t exist previously in localstorage it creates it, otherwise it gets it from the browser

Cool, I’ll check this out thanks!

Well yes, I know that part. What I mean is, you only just created a new Mongo collection and then you’re stringifying it when you know it’s empty. You could’ve just done:

localStorage.setItem('CutUpsList', '[]');

But it looks like there are some plugins mentioned above that’ll do what you want.

I see what you’re saying now and you’re right. I didn’t know that a new mongo collection was equivalent to an empty array. Yes, that package was a cleaner more efficient way of doing what I needed. Thanks for all the help, I’m still getting around this app that I’m building and I’m sure I’ll keep coming here for aid and also contribute the more I learn about meteor.

1 Like

Glad you found what you needed!

Though, a Mongo Collection actually returns a cursor, not an array.

const thisIsACursor = MyThings.find();
const thisIsAnArray = MyThings.find().fetch();
const thisIsAnObject = MyThings.findOne(someId);
1 Like