Tipicamente, per limitare la larghezza di banda necessaria per il download di una pagina web, si sceglie di minimizzare la dimensione degli script eliminando tutti i caratteri superflui, quali spazi, tabulazioni o rimandi a capo. Il risultato ottenuto è però assolutamente inutilizzabile in fase di debug e pertanto, per ognuno di essi, è necessario mantenere anche una versione di debug che possa essere referenziata secondo necessità.
In condizioni normali questo requisito richiederebbe di rimettere mano al markup della masterpage, o a quello delle singole pagine coinvolte, per modificare manualmente i riferimenti. Se invece di inserire manualmente i link referenziamo i file Javascript tramite il controllo ScriptManager, l'operazione risulta infinitamente più comoda:
<asp:ScriptManager ID="scriptManager" runat="server"> <Scripts> <asp:ScriptReference Path="~/FirstScript.js" ScriptMode="Inherit" /> <asp:ScriptReference Path="~/SecondScript.js" ScriptMode="Inherit" /> </Scripts> </asp:ScriptManager>
In questo modo, infatti, l'output che si ottiene in pagina dipende dalla modalità di compilazione impostata sul web.config:
<compilation debug="true" targetFramework="4.0" />
In particolare, nel caso in cui l'applicazione sia eseguita in modalità debug, invece dei riferimenti a FirstScript.js e SecondScript.js, lo ScriptManager farà in modo che i link inseriti puntino ai file FirstScript.debug.js e SecondScript.debug.js.
Il suffisso ".debug", infatti, è quello che per default viene utilizzato dallo ScriptManager per individuare le versioni di debug dei file di scripting. Nel caso le nostre regole di naming siano differenti, possiamo specificare manualmente gli url nell'evento Application_Start di global.asax.
protected void Application_Start(object sender, EventArgs e) { ScriptManager.ScriptResourceMapping.AddDefinition( "FirstScript", new ScriptResourceDefinition { Path="~/FirstScript.js", DebugPath = "~/FirstScript_DebugMode.js" }); }
A questo punto è sufficiente referenziare il nuovo mapping all'interno della collection di ScriptReference tramite il nome:
<asp:ScriptManager ID="scriptManager" runat="server"> <Scripts> <asp:ScriptReference Name="FirstScript" ScriptMode="Inherit" /> <asp:ScriptReference Path="~/SecondScript.js" ScriptMode="Inherit" /> </Scripts> </asp:ScriptManager>
Un aspetto interessante è che questa tecnica è utilizzabile anche in concomitanza della funzionalità di unione dei Javascript illustrata nello script #952
https://www.aspitalia.com/script/952/Utilizzare-Funzionalita-Unione-Javascript-ASP.NET-3.5-SP.aspx
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Creare Higher-Order functions in JavaScript
Fungible e Non Fungible Token in pratica
Usare l'option pattern per gestire la configurazione in ASP.NET Core
Dichiarare una variabile in JavaScript con le parole chiave var, let e const
Web3, Smart Contract, Metamask e Web Application
Configuration strongly typed anche per singleton con IOptionsMonitor in ASP.NET Core
Gestire le chiamate a servizi esterni in ASP.NET Core e Blazor tramite Polly
Utilizzare la keyword with in JavaScript
Utilizzare l'API del browser fetch
Ottimizzare il codice JavaScript con i Shorthand Patterns - terza parte
Gestire il timing sugli eventi all'interno di un'applicazione Blazor
Iniettare servizi in un hosted service di ASP.NET Core
I più letti di oggi
- Costruire applicazioni native per ogni dispositivo con .NET e Visual Studio
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Monitorare e prevenire problemi in produzione
- DateOnly e TimeOnly in .NET: e io che ci faccio?
- Le novità di Angular 14
- Impostare un default custom per i metodi LINQ che tornano il valore di default
- Produttività con ASP.NET Core 6