Presentazione di new-js-clock

open-sourcejavascripttypescriptrelease

Più di 15 anni fa ho pubblicato un piccolo plugin jQuery chiamato JS-Clock. Era un widget semplice che renderizzava un orologio animato all’interno di un elemento del DOM — utile, semplice e completamente figlio del suo tempo. Si basava su jQuery, aveva qualche problema con il supporto a istanze multiple e non è mai stato aggiornato in modo significativo dopo quel rilascio iniziale.

Oggi questo cambia. Sto rilasciando new-js-clock 1.0.0 — una riscrittura completa in TypeScript che mantiene lo spirito dell’originale lasciandosi alle spalle ognuno dei suoi limiti. Potete vederla in azione sulla pagina demo.

Cosa c’è di nuovo in 1.0.0

Tutto ciò che è stato introdotto in questo rilascio:

  • 🔒 TypeScript — Tipizzazione completa con interfacce esaustive in tutto il codice.
  • 🌐 Suite di test E2E + unitari — Copertura Jest deterministica più test E2E Selenium su browser reali, inclusa la validazione estesa del comportamento nelle schede in background.
  • 📦 Zero dipendenze — JavaScript vanilla puro. Nessun jQuery richiesto.
  • 🐛 Correzioni di bug — Il supporto a istanze multiple ora funziona correttamente, che era il problema principale nella versione 0.8.
  • ⚡ API moderna — Un’API pulita e intuitiva con metodi d’istanza propri su ogni orologio creato.
  • 🧪 Completamente testato — 162 test Jest deterministici con copertura linee al 99,74 %, copertura istruzioni al 99,02 %, copertura funzioni al 100 % e copertura branch al 98,32 %.
  • 🐳 Grid E2E Dockerizzato — Selenium Grid con Chrome, Firefox ed Edge in modalità headless, in locale e in CI tramite pnpm run e2e:docker.
  • 📱 ES Modules — Import ES Module con supporto al tree-shaking, affiancati da bundle CommonJS e IIFE.
  • 🌍 Fusi orari con supporto DST — Supporto ai fusi orari IANA con gestione automatica dell’ora legale.
  • ⏱️ Modalità cronometro — Un nuovo cronometro che conta a partire da 00:00:00.
  • 🏁 Tempi di giro e split — Registra tempi di giro (delta) e tempi cumulativi (split) in modalità cronometro.
  • 📊 Miglior/Peggior giro — Funzioni di supporto integrate per trovare il giro più veloce e più lento di una sessione.
  • 🎯 Temporizzazione ad alta risoluzione — Delta di giro misurati tramite performance.now() con precisione submillisecondo.

Installazione

npm install new-js-clock
# oppure
pnpm add new-js-clock

Disponibile anche via CDN per l’uso diretto nel browser — consultate il README per i link unpkg e jsDelivr.

Perché ci ha messo così tanto?

Onestamente? La vita. Il JS-Clock originale è stato scritto su richiesta del mio caro amico scomparso Gustavo Beltrão (un maestro del PHP ai suoi tempi, con cui ho avuto il privilegio di lavorare più di una volta) per essere utilizzato in dashboard interni aziendali e in siti a pagina singola per eventi con visitatori di diversi fusi orari. Ha svolto bene il suo compito, tanto che non è mai sembrato urgente rivisitarlo. Ma jQuery è da tempo svanito dai progetti moderni, TypeScript è diventato lo standard per lo sviluppo di librerie, e il bug del supporto a istanze multiple mi ha sempre dato fastidio. Quando finalmente mi sono seduto per correggerlo nel modo giusto, aveva senso farlo per bene — con tipi, test, un sistema di moduli moderno e funzionalità sufficienti per essere genuinamente utile nel 2026. Tra l’altro, ho in programma di usarla nel mio prossimo progetto commerciale.

Meglio tardi che mai.

A Gesù Cristo solo sia la gloria!