jQuery — en el mundo. La comunidad de desarrolladores web la creó a finales de los años 2000, lo que llevó a la aparición de un rico ecosistema de sitios, complementos y marcos que utilizan jQuery en su núcleo.
Sin embargo, en los últimos años, su estatus como herramienta principal para el desarrollo web se ha visto amenazado. Vamos a ver por qué jQuery se volvió popular y por qué ha pasado de moda, así como en qué casos todavía puede ser útil para crear sitios web modernos.
Una breve historia de jQuery
John Resig () creó la primera versión de la biblioteca en 2005 y -en un evento llamado BarCampNYC. En el el autor escribió:
jQuery es una biblioteca de JavaScript, cuya premisa es: Programar en JavaScript debe ser agradable. jQuery toma tareas comunes y repetitivas, elimina todo el marcado innecesario y las hace cortas, elegantes y comprensibles.
jQuery tiene dos grandes ventajas. La primera es que ofrece una API conveniente para manipular páginas web. En particular, proporciona métodos potentes para seleccionar elementos. Se puede seleccionar no solo por ID o clases; jQuery permite escribir expresiones complejas, por ejemplo, para seleccionar elementos en función de sus relaciones con otros elementos:
// Select every item within the list of people within the contacts element
$('#contacts ul.people li');Con el tiempo, el mecanismo de selección se convirtió en una biblioteca independiente .
La segunda ventaja de la biblioteca es que abstractó las diferencias entre navegadores. En esos años, era difícil escribir código que funcionara de manera confiable en todos los navegadores.
La falta de estandarización significaba que los desarrolladores debían tener en cuenta numerosas diferencias entre navegadores y casos límite. Echa un vistazo a y busca en jQuery.browser. Aquí tienes uno de los ejemplos:
// If Mozilla is used
if ( jQuery.browser == "mozilla" || jQuery.browser == "opera" ) {
// Use the handy event callback
jQuery.event.add( document, "DOMContentLoaded", jQuery.ready );
// If IE is used, use the excellent hack by Matthias Miller
// http://www.outofhanwell.com/blog/index.php?title=the_window_onload_problem_revisited
} else if ( jQuery.browser == "msie" ) {
// Only works if you document.write() it
document.write("<scr" + "ipt id=__ie_init defer=true " +
"src=javascript:void(0)></script>");
// Use the defer script hack
var script = document.getElementById("__ie_init");
script.onreadystatechange = function() {
if ( this.readyState == "complete" )
jQuery.ready();
};
// Clear from memory
script = null;
// If Safari is used
} else if ( jQuery.browser == "safari" ) {
// Continually check to see if the document.readyState is valid
jQuery.safariTimer = setInterval(function(){
// loaded and complete are both valid states
if ( document.readyState == "loaded" ||
document.readyState == "complete" ) {
// If either one are found, remove the timer
clearInterval( jQuery.safariTimer );
jQuery.safariTimer = null;
// and execute any waiting functions
jQuery.ready();
}
}, 10);
}Y gracias a jQuery, los desarrolladores pudieron dejar las preocupaciones sobre todos estos obstáculos en manos del equipo que desarrolla la biblioteca.
Más tarde, jQuery facilitó la implementación de tecnologías más complejas, como animaciones y Ajax. La biblioteca se convirtió prácticamente en una dependencia estándar para los sitios web. Y hoy en día, soporta una gran parte de internet. W3Techs estima que .
El control sobre el desarrollo de jQuery también se volvió más formal. En 2011, el equipo . Y en 2012, jQuery Board.
En 2015, la jQuery Foundation se unió a la Dojo Foundation,, que luego se fusionó con la Node.js Foundation en- para establecer la, en la que jQuery fue uno de los «.»
Circunstancias cambiantes
Sin embargo, en los últimos años, jQuery . GitHub. Bootstrap v5 , porque es su «» (actualmente de 30 KB, minificado y empaquetado). Varias tendencias en el desarrollo web han debilitado la posición de jQuery como una herramienta necesaria.
Navegadores
Por varias razones, las diferencias y limitaciones entre navegadores se han vuelto menos importantes. En primer lugar, ha mejorado la estandarización. Los principales desarrolladores de navegadores (Apple, Google, Microsoft y Mozilla) están trabajando juntos en en el marco de.
Aunque los navegadores aún se diferencian en varios aspectos importantes, al menos los proveedores tienen un medio para encontrar y crear una base común en lugar de entre ellos. En consecuencia, las API de los navegadores han adquirido nuevas capacidades. Por ejemplo, puede reemplazar las funciones Ajax de jQuery:
// jQuery
$.getJSON('https://api.com/songs.json')
.done(function (songs) {
console.log(songs);
})
// native
fetch('https://api.com/songs.json')
.then(function (response) {
return response.json();
})
.then(function (songs) {
console.log(songs);
});Los métodos y duplican las herramientas de selección de jQuery:
// jQuery
const fooDivs = $('.foo div');
// native
const fooDivs = document.querySelectorAll('.foo div');Ahora se puede manipular las clases de los elementos con :
// jQuery
$('#warning').toggleClass('visible');
// native
document.querySelector('#warning').classList.toggle('visible');se indica que: se enumeran algunas situaciones más en las que el código jQuery puede ser reemplazado por código nativo. Algunos desarrolladores siempre usan jQuery simplemente porque no conocen las nuevas API, pero cuando lo hacen, comienzan a usar esta biblioteca con menos frecuencia.
Utilizar capacidades nativas permite mejorar el rendimiento de las páginas. Muchos ahora se pueden implementar con CSS.
La segunda razón es que los navegadores se actualizan mucho más rápido que antes. La mayoría de ellos aplica una , excepto Apple Safari. Pueden actualizarse en segundo plano sin que el usuario se involucre y no están vinculados a las actualizaciones del sistema operativo.
Esto significa que las nuevas capacidades de los navegadores y la corrección de errores se difunden mucho más rápido, y los desarrolladores no necesitan esperar a que la cuota de alcanzará un nivel aceptable. Pueden usar nuevas funciones y API sin necesidad de cargar jQuery o polyfills con confianza.
La tercera razón es que Internet Explorer está cerca de ser completamente obsoleto. IE ha sido durante mucho tiempo una pesadilla para el desarrollo web en todo el mundo. Los errores característicos eran muy comunes, y dado que IE dominó en los 2000 y no utilizó una estrategia de actualización
En 2016, Microsoft aceleró la retirada de IE del uso, la décima versión y versiones anteriores, limitándose a soportar IE 11. Y cada vez más, los desarrolladores web pueden permitirse el lujo de ignorar la compatibilidad con IE.
Incluso jQuery dejó de soportar IE 8 y anteriores a partir de , lanzada en 2013. Y aunque en algunos casos todavía se requiere soporte para IE, por ejemplo, en sitios antiguos, estas situaciones son cada vez más raras.
Nuevos frameworks
Desde la aparición de jQuery se han creado numerosos frameworks, incluidos los líderes modernos , y . Tienen dos ventajas importantes sobre jQuery.
Primero, permiten dividir fácilmente la interfaz de usuario en componentes. Los frameworks están diseñados para manejar el renderizado y la actualización de la página. Y jQuery generalmente se utiliza solo para actualizaciones, delegando al servidor la tarea de proporcionar la página inicial.
Por otro lado, los componentes de React, Angular y Vue permiten unir estrechamente HTML, código e incluso CSS. Al igual que dividimos la base de código en muchas funciones y clases autónomas, la capacidad de dividir la interfaz en componentes reutilizables simplifica la construcción y el mantenimiento de sitios complejos.
La segunda ventaja es que los frameworks más nuevos siguen la parábola declarativa, donde el desarrollador describe cómo debe verse la interfaz, mientras que la ejecución de todos los cambios necesarios para lograr el objetivo se deja al framework. Este enfoque es contrario al enfoque imperativo característico del código jQuery.
En jQuery, escribes explícitamente los pasos para hacer cualquier cambio. En un framework declarativo, dices: 'De acuerdo con estos datos, la interfaz debe verse así'. Esto puede facilitar enormemente la escritura de código sin errores.
Los desarrolladores han adoptado nuevos enfoques para el desarrollo de sitios web, lo que ha disminuido la popularidad de jQuery.
¿Cuándo utilizar jQuery?
Entonces, ¿cuándo se deben ¿deberías utilizar jQuery?
Si la complejidad del proyecto va en aumento, es mejor comenzar con otra biblioteca o marco que permita gestionar la complejidad de manera significativa. Por ejemplo, dividir la interfaz en componentes. El uso de jQuery en tales sitios puede parecer aceptable al principio, pero rápidamente conducirá a la aparición de código espagueti, donde no estarás seguro de qué fragmento afecta a qué parte de la página.
He estado en esa situación, donde al intentar hacer cualquier cambio, parece una tarea ardua. No se puede garantizar que no romperás nada, ya que los selectores de jQuery dependen de la estructura HTML creada por el servidor.
En el otro extremo de la escala están los sitios simples que solo requieren un poco de interactividad o contenido dinámico. En tales casos, tampoco utilizaría jQuery por defecto, ya que con las API nativas se pueden hacer muchas más cosas.
Incluso si necesito algo más potente, buscaré una biblioteca especializada, como para Ajax o para animaciones. Será más fácil que cargar toda jQuery por una funcionalidad menor.
Creo que la mejor justificación para utilizar jQuery es que proporciona una funcionalidad integral para trabajar en el frontend de un sitio web. En lugar de estudiar diversas API nativas o bibliotecas especializadas, puedes leer solo la documentación de jQuery y ser productivo de inmediato.
El enfoque imperativo se escala mal, pero es más fácil de dominar que el enfoque declarativo de otras bibliotecas. Para un sitio con capacidades claramente limitadas, es mejor aplicar jQuery y trabajar con tranquilidad: la biblioteca no requiere una configuración o compilación compleja.
Además, jQuery es útil en los casos en que estás seguro de que el sitio no se complicará con el tiempo, y si no te importa la funcionalidad nativa, que ciertamente requerirá escribir más código que jQuery.
También puedes aplicar esta biblioteca si necesitas soportar versiones antiguas de IE. En ese caso, jQuery te servirá como lo hacía en tiempos en que IE era el navegador más popular.
Una mirada al futuro
jQuery no desaparecerá pronto. Ella , y muchos desarrolladores prefieren utilizar su API, incluso cuando hay métodos nativos disponibles. La biblioteca ha ayudado a toda una generación de desarrolladores a crear sitios que funcionan en cualquier navegador. Y aunque en muchos aspectos ha sido reemplazada por nuevas bibliotecas, frameworks y paradigmas, jQuery desempeñó un papel enorme y positivo en la creación de la web moderna.
Si la funcionalidad de jQuery no cambia significativamente, es bastante probable que en los próximos años el uso de la biblioteca siga disminuyendo lenta pero constantemente. Los nuevos sitios web, por lo general, se crean desde el principio utilizando frameworks más modernos, y los escenarios de uso adecuados para jQuery se presentan cada vez menos.
A algunos no les gusta la rapidez con la que quedan obsoletos las herramientas de desarrollo web, pero para mí eso es un testimonio del rápido progreso. jQuery nos permitió hacer muchas cosas mejor. Lo mismo es cierto para sus sucesores.
Fuente: habr.com
