Le mappe di origine ti consentono di rendere il codice leggibile e di cui è possibile eseguire il debug anche dopo averlo combinato e minimizzato, senza influire sulle prestazioni.
Quando utilizzi vari transpiler, minifier e bundler, il codice di cui esegui il deployment è diverso da quello creato dall'utente. Per migliorare le prestazioni della rete, questi strumenti comprimono il codice in un'unica riga, rimuovono i caratteri non necessari e accorciano le variabili.
Molti strumenti consentono di generare mappe sorgente da associare al codice.
Chrome DevTools legge sia il codice sia le mappe sorgente di cui è stato eseguito il deployment e ti consente di eseguire il debug del codice come faresti normalmente, anche con punti di interruzione.
Per capire meglio come funzionano le mappe di origine, consulta il visualizzatore delle mappe di origine.
Inoltre, le mappe di origine possono avere estensioni. Se crei strumenti e framework, valuta la possibilità di supportarli. Consulta questo Case study: Better Angular Debugging con DevTools, in cui il team DevTools e Angular hanno migliorato l'esperienza di debug in DevTools supportando l'estensione x_google_ignoreList.
Per saperne di più, consulta: