I have multiple stores requiring the same JSON file with different rootProperty. Is there a possibility to load the json file once and populate all stores with it? As of now, three stores with three different rootProperties result in three calls to the server for a possibly megabyte-sized JSON file which contains the data and is generated over and over for every request.

The json looks like:

{"users":[{"id":0,"name":"John Doe",...},...],
 "threads":[{"id":0,"startedBy":0,"lastPost":0,...},...],
 "posts":[...]}

The three stores are all very similar, one example:

store: {
    model: 'Forum.model.Post',
    autoLoad: true,
    proxy:{
        type: 'ajax'
        url: '../api/json.php'
        reader: {
            type:'json'
            rootProperty:'posts'
        }
    }
}

I have multiple stores requiring the same JSON file with different rootProperty. Is there a possibility to load the json file once and populate all stores with it? As of now, three stores with three different rootProperties result in three calls to the server for a possibly megabyte-sized JSON file which contains the data and is generated over and over for every request.

The json looks like:

{"users":[{"id":0,"name":"John Doe",...},...],
 "threads":[{"id":0,"startedBy":0,"lastPost":0,...},...],
 "posts":[...]}

The three stores are all very similar, one example:

store: {
    model: 'Forum.model.Post',
    autoLoad: true,
    proxy:{
        type: 'ajax'
        url: '../api/json.php'
        reader: {
            type:'json'
            rootProperty:'posts'
        }
    }
}

• javascript
• json
• extjs

• 1 Do a manual Ajax request and then populate each store with the appropriate bits. – Evan Trimboli Commented Jan 22, 2014 at 9:27

2 Answers 2

You could configure your stores with a memory proxy:

store: {
    model: 'Forum.model.Post',
    proxy:{
        type: 'memory'
        reader: {
            type: 'json'
            root: 'posts'
        }
    }
}

Then fetch the data once with an Ext.Ajax.request and load it into each store using the proxy:

Ext.Ajax.request({
    url: '../api/json.php',
    success: function(response) {
        var result = Ext.JSON.decode(response.responseText);

        store.getProxy().data = result;
        store.load();
        // same procedure for the other stores...
    }
});

(Basically what Evan said) Set "autoLoad: false" on your stores. In a controller, do a manual Ext.Ajax.request to get your large JSON object. For each store, manually invoke store.loadRawData() and pass that JSON object as the first argument.

This approach has an advantage over just using a memory proxy: each of your stores will continue to municate with the server via their proxies once you've loaded them up with data.