L'utilizzo di file JavaScript e CSS è facile e funzionale all'interno di applicazioni web: possiamo scrivere degli stili e funzioni che modificano l'aspetto di tutta la pagina. Ma cosa accade quando facciamo modifiche alla parte HTML, cambiando classi o rimuovendo elementi? Molto probabilmente inseriremo altro codice per gestire le nuove parti, ma raramente andremo a rimuovere il codice vecchio, perchè come sempre accade, ci troveremo a pensare "meglio lasciarlo, prima che rompa qualcosa di cui al momento non ricordo la presenza".
Con Google Chrome/Microsoft Edge possiamo nativamente intercettare tutto il codice inutilizzato nella pagina, semplicemente aprendo i DevTools e accedendo alla sezione Copertura/Coverage, visualizzabile attraverso il comando Ctrl+Shift+P e cercando la sezione sopracitata.
La sezione si mostrerà come pannello, all'interno del quale verrà richiesto il ri-caricamento della pagina, conseguentemente al quale verranno mostrate le statistiche di copertura. Prendendo il codice seguente come esempio possiamo facilmente intuire quali siano le parti utilizzate e quali invece possano essere rimosse.
<head> <style> div.nonUtilizzato{ display: block; } </style> </head> <body> <script> // utilizzata window.onload = function() { console.log('ciao') }; function nonUtilizzata() { console.log('ciao'); } </script> </body>
Utilizzando lo strumento fornito dal browser avremo lo stesso riscontro.

Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Ottimizzare il codice JavaScript utilizzando WeakMap e WeakSet
Le novità di .NET 7 e C# 11
Impostare il contenuto dell'head all'interno di ogni pagina Blazor
Taggare automaticamente un repository con un workflow di GitHub
Confronto tra moduli in Javascript: ES e commonJS
.NET 7 Live Q&A
Filtrare le chiamate HTTP ad un App Service in base al servizio Azure
Utilizzare le Promise in Javascript - seconda parte
Sopprimere gli errori di concorrenza quando si elimina una entity con Entity Framework 7
Utilizzare l'attributo autofill del CSS
Impostare il tema light o dark utilizzando i CSS
Usare Azure Application Gateway come reverse proxy per ASP.NET Core
I più letti di oggi
- Linting di un Dockerfile con un workflow di GitHub
- Sfruttare la local cache del browser tramite gli ETag in #aspnetcore https://aspit.co/cfc di @crad77 #webapi #aspnetmvc #blazor #cache
- Monitorare i server on-premises con Azure Arc
- 3 metodi JavaScript che ogni applicazione web dovrebbe contenere - Parte 2