• [ console ] available in IE, FF, Chrome
• [ profiling (safari) ] YSlow + JS profiling.
• [ log4js ] logging tool like log4j
• [ jconsole ] content library wrapper for console or log4js
• [ jslitmus ] [ Tests ] simple tool for testing performance of METHODS (1000s-1000000s of hits).
• [ jstracer ] logging/tracing tool
• [ monitors ] simple test wrapper/reporter

• [ rep.html ] original rep finder demo
• [ rep_console.html ] rep finder with console tool (clean code, external ids)
• [ rep_monitors.html ] rep finder with monitors tool (cross browser, programmatic control - potential aggregation)

• [ YSlow ] Plug-in - where is resource load taking place?
  • Controller/JSP
  • images
  • script
  • stylesheets
• Caching (DayCacheFilter)
• Images
  • web optimization, resizing
  • sprites
  Used by catalog, cart, college
• [ YUI Compressor ] or [ JAWR ] Used for content library bundles, most Java applications.
• Lazy loading Load optional components later. Used in image galleries, cross-sell products in cart, pagination-type displays.
• Delayed loading Load components only when necessary, via script includes or content loading.
• Page-specific loading If substantial, keep these out of application or theme bundles.

1. Required load (style then javascript)
2. Ready state
3. Pre-load/lazy loading
4. Action-dependent/info-dependent

	
	<li id="prd_0" class="productView first">
	<img class="thumb"
		height="147"
		width="187"
		src="images/clear.gif"
		data-lazyimages-src="http://www.jostens.com/apps/shop/images/product/pchmp/FAN_RING1_GB030/browse.jpg"
	/>
	<img class="hover"
		height="297"
		width="331"
		src="images/clear.gif"
		data-lazyimages-src="http://www.jostens.com/apps/shop/images/product/pchmp/FAN_RING1_GB030/browse_hover.jpg"
	/>

• [ YUI Compressor ] Used for content library bundles
• Image Resizing [ College ] * However the resized images are not cached today.
• Lazy loading Used in Jewelry Portal, Prochamp-Packers [ Lazy Images Code ]
• Delayed loading Suggested for [ jostens-2.0.js ] datatables ~25% load.
• Page-specific loading Suggested for [ jcom.js ] college (~25%) load.

• Interpreted language. * But interpreters are getting faster. ** Not all browsers are equal.
• Some statements are syntactically equivalent but computationally different. [ Example ]
• 1k is ok
• String concatenation [ Concat example ] * New browsers don't need this
• Reverse order * New browsers don't need this
• HTML: Incremental parsing vs. block parsing. [ Parsing example ]
• Careful with the call stack * Too much recursion ( Need example)
• "Mind what you have learned. Save you it can." - Yoda [ Memory Example ] * New browsers don't need this

• A in AJAX?
• Throttling [ Throttle/debounce plugin ] Works well for single events (keypress). Does not work cross-event (keypress + blur). Modified version in Enterprise Admin to throttle across event types.
• Echo matching Concept used in datatables jquery plugin. [ Code ]
• JSON size You can't always get what you want... but sometimes you get more than you need.
• Progress bar (progress.js in content lib). [ Code ]
  • Tells them what you're doing.
  • Prevents them from doing something else.

	
var echo = dateUtil.ms();
asset.buildCustomAssetList.lastEcho = echo;
$.ajax({
	url: asset.assetListUrl,
	dataType: 'json',
	data: {
		"customerKey": customerId,
		"echo": echo
	},
	complete: function() {
		progress.hide();
	},
	success: function(data) {
		if (ajaxUtil.isTimeout(data)) {
			ajaxUtil.doSignin();
			return;
		}
		if (asset.buildCustomAssetList.lastEcho != data.echo) {
			return;
		}
	...

	
// show the pbar
progress.show({msg: "Initializing...", w: 400});
	...
// just update the message
progress.msg("Preparing layouts...");
    ...
// hide the pbar
progress.hide();