2N/A<style scoped>

2N/A/* custom styles for this example */

2N/A#demo .output {

2N/A margin-bottom:1em;

2N/A padding:10px;

2N/A border:1px solid #D9D9D9;

2N/A}

2N/A#demo .output pre {

2N/A font-size: 11px;

2N/A}

2N/A#demo .output strong {

2N/A padding: .25em .4em;

2N/A background: #333;

2N/A color: #fff;

2N/A text-shadow: -1px -1px 1px #000;

2N/A border-radius: 5px;

2N/A}

2N/A</style>

2N/A

2N/A<div class="intro">

2N/A <p>The DataSourceCache plugin enables caching on any DataSource to reduce high-latency calls to remote sources and to reduce server load. In this example, the Cache's `max` value has been set to `3`.

2N/A

2N/A</div>

2N/A

2N/A<div class="example yui3-skin-sam">

2N/A {{>datasource-caching-source}}

2N/A</div>

2N/A

2N/A<p>Use the <code>plug()</code> method to initialize the

2N/A<code>DataSourceCache</code> plugin and pass in the configuration value

2N/A<code>max</code> to set the maximum size.</p>

2N/A

2N/A```

2N/AYUI().use("datasource", "dataschema", "cache", function (Y) {

2N/A var callback = {

2N/A success: function (e) { /* output to screen */ },

2N/A failure: function (e) { /* output to screen */ }

2N/A },

2N/A

2N/A myDataSource = new Y.DataSource.Get({

2N/A source: "https://api.github.com/users/",

2N/A

2N/A // this is only needed because the query appends the url

2N/A // rather than the url's query params

2N/A generateRequestCallback: function (guid) {

2N/A return '/repos?callback=YUI.Env.DataSource.callbacks.' + guid;

2N/A }

2N/A }),

2N/A

2N/A myDataSource.plug(Y.Plugin.DataSourceJSONSchema, {

2N/A schema: {

2N/A resultListLocator: "data",

2N/A resultFields: ["name"]

2N/A }

2N/A });

2N/A

2N/A myDataSource.plug(Y.Plugin.DataSourceCache, { max: 3 });

2N/A

2N/A // Adds to cache

2N/A myDataSource.sendRequest({

2N/A request : "lsmith",

2N/A callback: callback

2N/A });

2N/A

2N/A // Adds to cache

2N/A myDataSource.sendRequest({

2N/A request : "davglass",

2N/A callback: callback

2N/A });

2N/A

2N/A // Retrieves from cache

2N/A myDataSource.sendRequest({

2N/A request : "lsmith",

2N/A callback: callback

2N/A });

2N/A});

2N/A```

<h3 id="fullsource">Full Example Source Listing</h3>

```

{{>datasource-caching-source}}

```