jQuery - en el mundo una biblioteca JavaScript. La comunidad de desarrollo web lo creó a finales de la década de 2000, lo que dio como resultado un rico ecosistema de sitios, complementos y marcos que utilizan jQuery internamente.
Pero en los últimos años, su estatus como principal herramienta para el desarrollo web se ha erosionado. Veamos por qué jQuery se hizo popular y por qué pasó de moda, y también en qué casos sigue siendo recomendable utilizarlo para crear sitios web modernos.
Una breve historia de jQuery
Juan Resig () creó la primera versión de la biblioteca en 2005, y -m, en un evento llamado BarCampNYC. En el autor escribió:
jQuery es una biblioteca de Javascript basada en el lema: Javascript debería ser divertido de codificar. jQuery toma tareas comunes y repetitivas, elimina todo el marcado innecesario y las hace breves, elegantes y limpias.
jQuery tiene dos ventajas principales. La primera es una API conveniente para manipular páginas web. En particular, proporciona métodos potentes para seleccionar elementos. No solo puedes seleccionar por ID o clase, jQuery te 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 separada. .
La segunda ventaja de la biblioteca era que abstraía las diferencias entre navegadores. En esos años, era difícil escribir código que pudiera funcionar de manera confiable en todos los navegadores.
La falta de estandarización significó que los desarrolladores debían tener en cuenta numerosas diferencias entre los navegadores y los casos extremos. Echa un vistazo a y busque jQuery.browser. Aquí hay un ejemplo:
// 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 trasladar las preocupaciones sobre todos estos obstáculos al equipo que desarrolla la biblioteca.
Posteriormente, jQuery facilitó la implementación de tecnologías más complejas como animaciones y Ajax. La biblioteca se ha convertido efectivamente en una dependencia estándar para los sitios web. Y hoy impulsa una gran parte de Internet. W3Techs cree que .
El control sobre el desarrollo de jQuery también se ha formalizado. En 2011 el equipo . Y en 2012 el tablero jQuery.
En 2015, la Fundación jQuery se fusionó con la Fundación Dojo,, que luego se fusionó con la Fundación Node.js en-m para crear, dentro del cual jQuery era uno de los “".
Circunstancias cambiantes
Sin embargo, en los últimos años jQuery . GitHub. Arranque v5 porque es suyo""(actualmente tiene un tamaño de 30 KB, minimizado y empaquetado). Varias tendencias en el desarrollo web han debilitado la posición de jQuery como herramienta esencial.
Navegadores
Por diversas razones, las diferencias y limitaciones de los navegadores se han vuelto menos importantes. Primero, la estandarización ha mejorado. Los principales desarrolladores de navegadores (Apple, Google, Microsoft y Mozilla) están trabajando juntos para desarrollar dentro de.
Aunque los navegadores todavía difieren entre sí en varios aspectos importantes, los proveedores al menos tienen un medio para buscar y crear una base de datos común en lugar de juntos. En consecuencia, las API de los navegadores han adquirido nuevas capacidades. P.ej, capaz de reemplazar funciones Ajax desde 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);
});Métodos и Selectores jQuery duplicados:
// jQuery
const fooDivs = $('.foo div');
// native
const fooDivs = document.querySelectorAll('.foo div');Ahora puedes manipular clases de elementos usando :
// jQuery
$('#warning').toggleClass('visible');
// native
document.querySelector('#warning').classList.toggle('visible');El sitio Aquí hay algunas situaciones más en las que el código jQuery se puede reemplazar con código nativo. Algunos desarrolladores siempre se quedan con jQuery porque simplemente no conocen las nuevas API, pero cuando lo hacen, comienzan a usar la biblioteca con menos frecuencia.
El uso de funciones nativas mejora el rendimiento de la página. Muchos ahora puedes implementar usando CSS.
La segunda razón es que los navegadores se actualizan mucho más rápido que antes. La mayoría de ellos usan , a excepción de Apple Safari. Se pueden actualizar en segundo plano sin la participación del usuario y no están vinculados a las actualizaciones del sistema operativo.
Esto significa que las nuevas funciones del navegador y las correcciones de errores se distribuyen mucho más rápido y los desarrolladores no tienen que esperar hasta que alcanzará un nivel aceptable. Pueden utilizar con confianza nuevas funciones y API sin descargar jQuery o polyfills.
La tercera razón es que Internet Explorer se está acercando a un estado de total irrelevancia. IE ha sido durante mucho tiempo la pesadilla del desarrollo web en todo el mundo. Sus errores estaban muy extendidos y, debido a que IE dominó la década de 2000 y no utilizó una estrategia de actualización constante, las versiones anteriores siguen siendo comunes.
En 2016, Microsoft aceleró el desmantelamiento de IE, décima y versiones anteriores, lo que limita el soporte a IE 11. Y cada vez más, los desarrolladores web pueden darse el lujo de ignorar la compatibilidad con IE.
Incluso jQuery dejó de admitir IE 8 e inferiores a partir de , publicado en 2013. Y aunque en algunos casos todavía se requiere soporte para IE, por ejemplo en sitios más antiguos, estas situaciones surgen cada vez con menos frecuencia.
Nuevos marcos
Desde la aparición de jQuery, se han creado muchos marcos, incluidos los líderes modernos. , и . Tienen dos ventajas importantes sobre jQuery.
En primer lugar, facilitan la separación de la interfaz de usuario en componentes. Los marcos están diseñados para manejar la representación y actualización de páginas. Y jQuery normalmente se usa solo para actualizar, dejando la tarea de proporcionar la página inicial al servidor.
Por otro lado, los componentes React, Angular y Vue le permiten combinar estrechamente HTML, código e incluso CSS. Así como dividimos el código base en muchas funciones y clases independientes, la capacidad de dividir la interfaz en componentes reutilizables facilita la creación y el mantenimiento de sitios complejos.
La segunda ventaja es que los marcos más recientes se adhieren a un paradigma declarativo, en el que el desarrollador describe cómo debería verse la interfaz y deja que el marco realice todos los cambios necesarios para lograr lo que se desea. Este enfoque es contrario al enfoque imperativo que caracteriza al código jQuery.
En jQuery, escribe explícitamente los pasos para realizar cualquier cambio. Y en un marco declarativo dices: "Según estos datos, la interfaz debería verse así". Esto puede facilitar mucho la escritura de código sin errores.
Los desarrolladores han adoptado nuevos enfoques para el desarrollo de sitios web, razón por la cual la popularidad de jQuery ha disminuido.
¿Cuándo utilizar jQuery?
Así que cuando debería usar jQuery?
Si la complejidad del proyecto aumenta, entonces es mejor comenzar con otra biblioteca o marco que le permita gestionar la complejidad de manera significativa. Por ejemplo, divida la interfaz en componentes. Usar jQuery en dichos sitios puede parecer correcto al principio, pero rápidamente conducirá a un código espagueti en el que no estás seguro de qué fragmento afecta a qué parte de la página.
He estado en una situación así, cuando intento hacer algún cambio, parece una tarea difícil. No puede estar seguro de que no romperá nada porque los selectores de jQuery dependen de la estructura HTML generada por el servidor.
En el otro extremo de la escala se encuentran los sitios simples que sólo requieren un poco de interactividad o contenido dinámico. Tampoco utilizaría jQuery de forma predeterminada en estos casos, porque hay mucho más que puedes hacer con las API nativas.
Incluso si necesito algo más potente, buscaré una biblioteca especializada, p.e. para Ajax o para animaciones. Esto será más fácil que cargar todo jQuery para una pequeña funcionalidad.
Creo que la mejor razón para usar jQuery es que proporciona una funcionalidad integral para la interfaz de un sitio web. En lugar de aprender una variedad de API nativas o bibliotecas especializadas, puede leer solo la documentación de jQuery y volverse productivo al instante.
El enfoque imperativo no escala bien, pero es más fácil de aprender que el enfoque declarativo de otras bibliotecas. Para un sitio con capacidades claramente limitadas, es mejor usar jQuery y trabajar con calma: la biblioteca no requiere ensamblaje ni compilación complejos.
Además, jQuery es bueno si está seguro de que su sitio no se complicará con el tiempo y si no le importa la funcionalidad nativa, que seguramente requerirá escribir más código que jQuery.
También puede utilizar esta biblioteca si necesita admitir versiones anteriores de IE. Entonces jQuery le servirá como lo hizo en los días en que IE era el navegador más popular.
prospección
jQuery no desaparecerá pronto. Ella , y muchos desarrolladores prefieren usar su API, incluso si hay métodos nativos disponibles. La biblioteca ha ayudado a toda una generación de desarrolladores a crear sitios web que funcionan en cualquier navegador. Aunque ha sido reemplazado en muchos sentidos por nuevas bibliotecas, marcos y paradigmas, jQuery ha desempeñado un papel enormemente positivo en la creación de la web moderna.
A menos que la funcionalidad de jQuery cambie significativamente, es probable que el uso de la biblioteca continúe disminuyendo lenta pero constantemente durante los próximos años. Los sitios web nuevos tienden a crearse utilizando marcos más modernos desde el principio, y los casos de uso adecuados para jQuery son cada vez más raros.
A algunas personas no les gusta el ritmo al que las herramientas de desarrollo web se vuelven obsoletas, pero para mí es una prueba de un rápido progreso. jQuery nos ha permitido hacer muchas cosas mejor. Lo mismo ocurre con sus sucesores.
Fuente: habr.com