Source Map

Ibland kan man vara tvungen att debugga kod som körs i produktion. Om du då har minifierat koden, kan det vara svårt att läsa och förstå koden. Det kan även vara väldigt svårt att veta vilka partier i den minifierade koden som motsvarar samma funktionalitet i utvecklingskoden. I värsta fall kan det vara som så att problemet enbart dyker upp i produktionskoden och det fungerar bra med din utvecklingskod (inte så vanligt iofs). För att underlätta i dylika situationer kan många verktyg skapa en så kallade Source Map. Dessa skapar en "karta" som beskriver hur den minifierad kod avbildas på utvecklingskod. Det gör att dina utvecklingsverktyg lätt kan koppla samman de sektioner i den minifierad kod med motsvarande sektioner i utvecklingskoden. Vilket gör att när du debuggar, så visas motsvarande utvecklingskod medan du tittar på den minifierade koden.

De flesta stora JavaScript-bibliotek tillhandahåller source maps för sin kod, t.ex. så finns det source maps för jQuery-biblioteket. Du kan då följa med funktionsanrop in i den bibliotekskod som du inte skrivit själv och se hur, den förhoppningsvis, lättlästa och lättförsteliga koden ser ut.

Du kan läsa mer som source maps här; Source Maps.