Activate your free membership today | Log-in

Tuesday, June 15th, 2010

Y.preload: load before execution

Category: Performance

<p>Caridy Patino has posted on a new YUI3 module for preloading of content, implementing Stoyan's ideas.

You can now strap on some preloading goodness to your YUI application:

JAVASCRIPT:
  1.  
  2. YUI({
  3.     //Last Gallery Build of this module
  4.     gallery: 'gallery-2010.05.05-19-39'
  5. }).use('gallery-preload', function(Y) {
  6.   Y.preload ([
  7.     'http://tools.w3clubs.com/pagr2/1.sleep.expires.png',
  8.     'http://tools.w3clubs.com/pagr2/1.sleep.expires.js',
  9.     'http://tools.w3clubs.com/pagr2/1.sleep.expires.css'
  10.   ]);
  11. });
  12.  

As well as just loading away, you can also wait for the user to focus on something on the page before reloading:

JAVASCRIPT:
  1.  
  2. Y.on("focus", function() {
  3.     Y.preload ([
  4.       'http://tools.w3clubs.com/pagr2/2.sleep.expires.png',
  5.       'http://tools.w3clubs.com/pagr2/2.sleep.expires.js',
  6.       'http://tools.w3clubs.com/pagr2/2.sleep.expires.css'
  7.     ]);
  8. }, ".myform input.query");
  9.  

Or, to take it even further, only preload if the user is probably idle:

JAVASCRIPT:
  1.  
  2. Y.preloadOnIdle ([
  3.     'http://tools.w3clubs.com/pagr2/3.sleep.expires.png',
  4.     'http://tools.w3clubs.com/pagr2/3.sleep.expires.js',
  5.     'http://tools.w3clubs.com/pagr2/3.sleep.expires.css'
  6.   ], 100); // ms
  7.  

Nicely packaged.

Related Content:

Posted by Dion Almaer at 6:13 am
Comment here

OOOOO
Rate the above post

Comments Here »

Comments feed TrackBack URI

Leave a comment

You must be logged in to post a comment.