jeremyckahn/cachey_test.html

## cachey_test.html
<!DOCTYPE html>

<html lang="en">
<head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>index</title>
        <meta name="generator" content="TextMate http://macromates.com/">
        <meta name="author" content="arcus">
        <!-- Date: 2010-08-04 -->
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="cachey.js" type="text/javascript" charset="utf-8"></script>
        <script type="text/javascript" charset="utf-8">


			jQuery(function(){
				setTimeout(function(){
					(jQuery.fn.cachey = function() {

						jQuery.noConflict();

						// Cache Holder
				        	window.cachey_cache = {},
						$ = function(sel, context) {

						/**
						* Do not execute caching logic if:
						*
						* 1. sel isn't a selector.
						*
						* 2. A context was provided.  Logic needed to account for that would slow down the plugin overall, and contexts are provided as a performance boost anyways, so caching it would yield diminishing returns.
						*
						* 3. sel is actually a new HTML element (The regexp was taken from the jQuery source for a similar purpose)
						*/
						if(typeof sel !== 'string'
							|| context
							|| /^[^<]*(<[\w\W]+>)[^>]*$|/.exec(sel)[1]) {
				                    	return jQuery(sel, context);
						}

						if (cachey_cache[sel]) {
						// If selector exists, return the cached version.
							return cachey_cache[sel];
						} else {
						// Otherwise return the selected object and add it to the cache holder.
							return cachey_cache[sel] = jQuery(sel, context);
				            		}
				            	};

							// Attach all jQuery utility functions to the new $ object
							for(k in jQuery) {
								$[k] = jQuery[k];
							}

							// Give $ (not the jQuery object) the ability flush the cache
							$.flush = function(){
								window.cachey_cache = {};
							};

					})()
				}, 0);
			});


            // Testing Code
            $(function() {
				var lisToMake = 2500;

                console.log($("#test").html());
                console.log($("#test").html()); // This selection will be cached

				$('<button>')
					.html('Select with jQuery()')
					.click(function(){
						var start = new Date();

						for (var i = 0; i < lisToMake; i++){
							jQuery('.li' + i).css({background : 'red'});
						}

						alert(new Date() - start)
					})
					.appendTo('body');

				$('<button>')
					.html('Select with $()')
					.click(function(){
						var start = new Date();

						for (var i = 0; i < lisToMake; i++){
							$('.li' + i).css({background : 'lime'});
						}

						alert(new Date() - start)
					})
					.appendTo('body');

				$('<button>', { value : 'arguments', name : 'work'})
					.click(function(){
						var ul, li, i;

						ul = $('<ul>').appendTo('body');

						for (i = 0; i < lisToMake; i++){
							$('<li>', { class : 'li' + i})
								.html(i.toString())
								.appendTo('body ul')
						}
					})
					.html('Make a big list!').appendTo('body')


            });

        </script>
</head>
<body>

<div id="test">hello world</div>

</body>
</html>
	<!DOCTYPE html>

	<html lang="en">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>index</title>
	<meta name="generator" content="TextMate http://macromates.com/">
	<meta name="author" content="arcus">
	<!-- Date: 2010-08-04 -->
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="cachey.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" charset="utf-8">


	jQuery(function(){
	setTimeout(function(){
	(jQuery.fn.cachey = function() {

	jQuery.noConflict();

	// Cache Holder
	window.cachey_cache = {},
	$ = function(sel, context) {

	/**
	* Do not execute caching logic if:
	*
	* 1. sel isn't a selector.
	*
	* 2. A context was provided. Logic needed to account for that would slow down the plugin overall, and contexts are provided as a performance boost anyways, so caching it would yield diminishing returns.
	*
	* 3. sel is actually a new HTML element (The regexp was taken from the jQuery source for a similar purpose)
	*/
	if(typeof sel !== 'string'
	\|\| context
	\|\| /^[^<](<[\w\W]+>)[^>]$\|/.exec(sel)[1]) {
	return jQuery(sel, context);
	}

	if (cachey_cache[sel]) {
	// If selector exists, return the cached version.
	return cachey_cache[sel];
	} else {
	// Otherwise return the selected object and add it to the cache holder.
	return cachey_cache[sel] = jQuery(sel, context);
	}
	};

	// Attach all jQuery utility functions to the new $ object
	for(k in jQuery) {
	$[k] = jQuery[k];
	}

	// Give $ (not the jQuery object) the ability flush the cache
	$.flush = function(){
	window.cachey_cache = {};
	};

	})()
	}, 0);
	});






	// Testing Code
	$(function() {
	var lisToMake = 2500;

	console.log($("#test").html());
	console.log($("#test").html()); // This selection will be cached

	$('<button>')
	.html('Select with jQuery()')
	.click(function(){
	var start = new Date();

	for (var i = 0; i < lisToMake; i++){
	jQuery('.li' + i).css({background : 'red'});
	}

	alert(new Date() - start)
	})
	.appendTo('body');

	$('<button>')
	.html('Select with $()')
	.click(function(){
	var start = new Date();

	for (var i = 0; i < lisToMake; i++){
	$('.li' + i).css({background : 'lime'});
	}

	alert(new Date() - start)
	})
	.appendTo('body');

	$('<button>', { value : 'arguments', name : 'work'})
	.click(function(){
	var ul, li, i;

	ul = $('<ul>').appendTo('body');

	for (i = 0; i < lisToMake; i++){
	$('<li>', { class : 'li' + i})
	.html(i.toString())
	.appendTo('body ul')
	}
	})
	.html('Make a big list!').appendTo('body')



	});

	</script>
	</head>
	<body>

	<div id="test">hello world</div>

	</body>
	</html>