Cuando realiza una consulta DOM a través de jQuery como $('class-name') buscó activamente el DOM para ese elemento y devuelve ese elemento con todos los métodos de prototipo de jQuery adjuntos.
Cuando está dentro de la cadena o evento jQuery, no tiene que volver a ejecutar la consulta DOM, puede usar el contexto $(this). Al igual que:
$('.class-name').on('click', function(evt) {
$(this).hide(); // does not run a DOM query
$('.class-name').hide() // runs a DOM query
});
$(this) contendrá el elemento que solicitó originalmente. Volverá a adjuntar todos los métodos de prototipo de jQuery, pero no tendrá que volver a buscar en el DOM.
Más información:
Rendimiento web con selectores de jQuery
Cita de un blog web que ya no existe, pero lo dejaré aquí por el bien de la historia:
En mi opinión, uno de los mejores consejos de rendimiento de jQuery es minimizar el uso de jQuery. Es decir, encuentre un equilibrio entre el uso de jQuery y JavaScript simple, y un buen lugar para comenzar es con ‘this’. Muchos desarrolladores usan $ (this) exclusivamente como sus devoluciones de llamada internas de martillo y se olvidan de esto, pero la diferencia es clara:
Cuando está dentro de la función de devolución de llamada anónima de un método jQuery, esta es una referencia al elemento DOM actual. $ (this) convierte esto en un objeto jQuery y expone los métodos de jQuery. Un objeto jQuery no es más que una matriz reforzada de elementos DOM.
