jessquery è un wrapper estremamente leggero sviluppato attorno alla API DOM che si propone come alternativa a jQuery, uno dei più noti framework JavaScript del panorama Open Source. Funziona in modo relativamente simile, ma non identico, a quest'ultimo ma è stato concepito appositamente per la realizzazione di progetti snelli e reattivi. In versione GZippata pesa appena 3.76kb contro i 31.7 di jQuery, mentre una volta decompresso l'archivio non supera gli 8.82kb a fronte degli 88.3kb di jQuery.
Caratteristiche di jessquery
L'applicazione nasce da una semplice osservazione: sviluppare in JavaScript può essere interessante, certo. Ma digitare metodi come per esempio document.querySelector()
non è particolarmente comodo. Per questa ragione l'autore ha deciso di creare una piccola libreria, scritta al 100% nello stesso linguaggio, che permetta di manipolare il DOM con una certa facilità e sia pienamente compatibile con TypeScript.
La libreria si presenta quindi come una soluzione type-safe. Il package include ben 43 metodi personalizzati. Permette inoltre di gestire facilmente i task asincroni e di eseguire le operazioni del DOM in modo ordinato. Senza contare la possibilità di customizzare gli errori. Installarlo con npm, pnpm, Yarn, o Bun è molto semplice, basta scegliere tra una delle seguenti istruzioni:
npm install jessquery
pnpm install jessquery
yarn add jessquery
bun install jessquery
In alternativa è possibile richiamare la libreria tramite CDN ma si perderebbero le annotazioni JSDoc:
<script src="https://esm.sh/jessquery"></script>
<script src="https://unpkg.com/jessquery"></script>
Differenze con jQuery
È bene tenere conto del fatto che le differenze sintattiche con jQuery esistono e in alcuni casi possono essere molto rilevanti. Anche se i principi di base rimangono i medesimi.
Di fondo è necessario comprendere che ogni chiamata $()
o $$()
non rappresenta necessariamente l'elemento che viene manipolato. Questo per via della concatenazione dei metodi. In pratica con jessquery tutto viene considerato un proxy, in questo modo è sempre possibile utilizzare l'API DOM quando non è disponibile un metodo. Se per esempio si dimentica di utilizzare l'operatore .css
e si introduce al suo posto .style
con $()
, il codice funzionerà comunque.