Muchos de nosotros, incluído yo, hemos caído alguna vez en el uso abusivo de jQuery, cuando realmente podemos usar equivalentes en Javascript que, además de mejorar la performance de nuestro código, nos ayudan a entender que jQuery no es la única manera de manipular el DOM de nuestro proyecto.
Contenido
He creado un Repositorio en Github con funciones jquery y su equivalente en Javascript Nativo: Native jQuery functions
Ejemplos
Algunos ejemplos básicos los enumero abajo, los demás, tal como mencioné, están en el repositorio de Github.
Manipulación de clases
* Get elements by class
/* jQuery */
$('.class-name');/* Native equivalent */
document.querySelectorAll('.class-name');
/* Another faster native equivalent */
document.getElementsByClassName('class-name');
AJAX
/* jQuery */
$.ajax({
url: "url",
type: "POST",
data: "a=1&b=2&c=3",
success: function(response) {
console.log(response);
}
});/* Native equivalent */
var r = new XMLHttpRequest();
r.open("POST", "url", true);
r.onreadystatechange = function () {
if (r.readyState != 4 || r.status != 200) return;
console.log(r.responseText);
};
r.send("a=1&b=2&c=3");
Y más...
Conclusiones
La verdad no estoy promoviendo el uso de Javascript nativo y el desuso de jQuery, pero debemos saber que en muchos casos la velocidad de la equivalencia nativa es muy grande. Y podemos ganar en rendimiento gracias a estas equivalencias que he compartido.