CODEWITHSUNDEEP
javascriptgoogle-chrome-extension
Seminko
Seminko

Reputation: 163

Checking for a key in an object containing array of objects saved in chrome.storage.local

I currently save a bunch of objects (thousands) into the chrome.storage.local and then when on a specific web page checking whether specific IDs on the web page are in fact saved in local storage.

Here's a pseudo code

Bakcground script:

var storage = chrome.storage.local;

var json = '[{"kek1": {"aaa": "aaaValue", "bbb": "bbbValue", "ccc": "cccValue"}},{"kek2": {"ddd": "dddValue", "eee": "eeeValue", "fff": "fffValue"}}]';
var jsonParsed = JSON.parse(json);
jsonParsed.forEach(function(object) {
    storage.set(object);
});

Content script (when on a specific page):

ids.forEach(function(id) {
    storage.get(id, function(result){
        if(!isEmpty(result)) {
            //we found it, nice, now flag it as found
        }
    });
});

function isEmpty(obj) {
    for(var key in obj) {
        if(obj.hasOwnProperty(key))
            return false;
    }
    return true;
}

Which is easy and nice since I only have to do storage.get(id, ...

Unfortunately, I save a lot of stuff in storage, some of it I need to be removing periodically, which then becomes a hustle since I have to loop through all the objects and determining whether that particular object needs to be removed or it needs to remain.

So i decided I would do like these "parent object". Ie one object for settings, containing an array of objects with different settings the user would save. One object for the stuff that needs to be removed, containing an array objects. Etc

Like so - all relevant info that I want to remove periodically will be under one key "test" (temp name):

var json = '{"test":[{"kek1": {"aaa": "aaaValue", "bbb": "bbbValue", "ccc": "cccValue"}},{"kek2": {"ddd": "dddValue", "eee": "eeeValue", "fff": "fffValue"}}]}';

I know how to access the nested objects and their values:

var jsonParsed = JSON.parse(json);
jsonParsed.test[0].kek1.aaa

But I don't know how I would easily check for the keys saved in the storage since I would have to specify the "element number" ([i]).

Do I just do a for loop itterating over the array like so?

for (i = 0; i < jsonParsed.test.length; i++) {
    var getKey = Object.keys(jsonParsed.test[i]);
    if (getKey[0] == 'theKeyImLookingFor') {
        //do stuff
    }
}

To me that feels like non ideal solution since the for loop would have to run for each of the ids on the page and there could sometimes be close to 4000 of them. (4000 for loops back to back)

Is it a good idea to save a single object holding an array of thousands of other objects?

Am I doing it wrong or is this the way to go?

Upvotes: 1

Views: 183

Answers (1)

woxxom
woxxom

Reputation: 73526

But I don't know how I would easily check for the keys saved in the storage

Use the standard Array methods like find or findIndex:

const i = arrayOfObjects.findIndex(o => 'someKey' in o);

Is it a good idea to save a single object holding an array of thousands of other objects?

It's a bad idea performance-wise.

What you probably need here is an additional value in the storage that would contain an array with ids of other values in the storage that need to be processed in some fashion e.g. expired/removed. It's basically like a database index so you would update it every time when writing an individual object. Since it contains only the ids, updating it is cheaper than rewriting the entire data.

Also, instead of performing lots of calls to the API, do just a single call:

// writing
chrome.storage.local.set(Object.assign({}, ...arrayOfObjects));

// reading
chrome.storage.local.get(arrayOfIds, data => {
  for (const id of arrayOfIds) {
    const value = data[id];
    if (value !== undefined) {
      // ok
    }
  }
});

Upvotes: 1

Related Questions