Javascript: Jquery performance

Javascript: Jquery performance.js

/*
 * JQUERY PERFORMANCE
 */


// 1) Don't forget to use context
var arms = $('div.robotarm', '#container');
// вместо
var arms = $('#container').find('div.robotarm');
// хуже всего:
var arms = $('#container div.robotarm');



// 2) DON'T REPEAT YOURSELF
if ($ventfade.data('currently') != 'showing'){
	$ventfade.stop();
}
if ($venthover.data('currently') != 'showing'){
	$venthover.stop();
}
if ($spans.data('currently') != 'showing'){
	$spans.stop();
}

var elem = [$ventfade, $venthover, $spans];

$.each(elems, function (k,v) {
	if (v.data('currently') != 'showing'){
		v.stop();
	}
})


// 3) Selector Optimization
// let's find scott
div.data table.attendees .gonzalez
// better: drop the middle
div.data .gonzalez
// best, light on the left
.data td.gonzalez

// избегайте универсальных селекторов
$('.buttons > *') // очень медленно
$('.buttons').children() // гораздо лучше

$('.gender :radio') // очень плохо
$('.gender *:radio') // плохо
$('.gender input:radio') // гораздо лучше


// 4) Минимизируйте манипуляции с DOM
// если в доме ссылок a.swedberg большк ~15ти, то быстрее будет 2ой вариант
$('a.swedberg').css('color', '#BADA55'); // первый вариант, классика
$('<style type="text/css"> a.swedberg { color: #BADA55; }</style>').appendTo('head'); // второй вариант


// 5) Используйте jquery только там, где он действительно нужен
$('a').click(function (e) {
	// не правильно
	var id = $('this').attr('id');

	// правильно 
	var id = this.id
})


// 6) Всегда кэшируй jquery селекторы, и давай им имена, начинающиеся с $, так удобнее отличать jquery объекты от прочих переменных
var $articles = $('article');