StoreSync

Configure with true to sync loaded data instead of replacing existing with a new dataset.

By default (or when configured with false) assigning to store.data replaces the entire dataset with a new one, creating all new records:

store.data = [ { id : 1, name : 'Saitama' } ];

const first = store.first;

store.data = [ { id : 1, name : 'One-Punch man' } ];

// store.first !== first;

When configured with true the new dataset is instead synced against the old, figuring out what was added, removed and updated:

store.data = [ { id : 1, name : 'Saitama' } ];

const first = store.first;

store.data = [ { id : 1, name : 'One-Punch man' } ];

// store.first === first;

After the sync, any configured sorters, groupers and filters will be reapplied.

Threshold

The sync operation has a configurable threshold, above which the operation will be treated as a batch/refresh and only trigger a single refresh event. If threshold is not reached, individual events will be triggered (single add, remove and possible multiple update). To enable the threshold, supply a config object with a threshold property instead of true:

const store = new Store({
    syncDataOnLoad : {
        threshold : '20%'
    }
});

threshold accepts numbers or strings. A numeric threshold means number of affected records, while a string is used as a percentage of the whole dataset (appending % is optional). By default no threshold is used.

Missing fields

The value of any field not supplied in the new dataset is by default kept as is (if record is not removed by the sync). This behaviour is configurable, by setting keepMissingValues : false in a config object it will reset any unspecified field back to their default values:

const store = new Store({
    syncDataOnLoad : {
        keepMissingValues : false
    }
});

Considering the following sync operation:

// Existing data
{ id : 1, name : 'Saitama', powerLevel : 100 }
// Sync data
{ id : 1, name : 'One-Punch Man' }

The result would by default (or when explicitly configured with true) be:

{ id : 1, name : 'One-Punch Man', powerLevel : 100 }

If configured with keepMissingValues : false it would instead be:

{ id : 1, name : 'One-Punch Man' }

Options available when supplying a config object to the syncDataOnLoad config.