In questo articolo vedremo in quali casi è possibile utilizzare jQuery in un progetto in Node.js.
Se stiamo realizzando una SPA (Single Page App), jQuery non è la scelta più indicata. In questo caso infatti occorre utilizzare una libreria o un framework compatibile con questo tipo di implementazione come Angular, React o Vue.js.
Se invece stiamo realizzando un sito web, allora jQuery può essere la scelta indicata specialmente quando le tempistiche del progetto non consentono di utilizzare una soluzione in puro JavaScript.
jQuery è interamente basata sulla selezione degli elementi del DOM (Document Object Model) che vengono trasformati in oggetti aventi nuovi metodi e proprietà.
Questo rende jQuery estremamente efficace sia nel manipolare il DOM che nel gestire gli eventi collegati agli elementi.
Per rendersi conto delle differenze esistenti tra jQuery ed il puro JavaScript, supponiamo di dover associare un evento click a più elementi sulla pagina. In jQuery la soluzione è la seguente:
$( ".link" ).click(function() {
console.log( "Clicked!" );
return false;
});
In JavaScript invece avremo:
document.querySelectorAll('.link').forEach(link => {
link.addEventListener('click', e => {
e.preventDefault();
console.log('Clicked!');
}, false);
});
Come si può notare, la soluzione in jQuery è notevolmente più concisa ed immediata.
Il punto debole di jQuery sta nella sua interazione con le API REST che utilizzano JSON come formato di scambio dati. I metodi AJAX di jQuery per impostazione predefinita utilizzano il formato application/x-www-form-urlencoded per le richieste POST e quindi è necessario abilitare esplicitamente JSON in jQuery.
$.ajax({
url: "/api/post",
dataType: "json",
type: "post",
contentType: "application/json",
data: JSON.stringify( { test: 1 } ),
processData: false,
success: function( data, textStatus, jQxhr ) {
},
error: function( jqXhr, textStatus, errorThrown ) {
}
});
Con il semplice JavaScript tale interazione è invece diretta usando le Fetch API:
fetch('/api/post', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify( { test: 1 } )
});
Nulla impedisce, tuttavia, di usare un approccio misto implementando le chiamate alle REST API con le Fetch API ed il resto del codice con jQuery, a meno che il progetto non richieda anche il supporto a quei browser che non implementano le Fetch API, ossia i browser obsoleti.
In conclusione, jQuery appare come la scelta più indicata per quei progetti in Node.js che non implementino delle SPA.
