DevTools Tips: Wat zijn bronkaarten?

Sofia Emelianova
Sofia Emelianova

Met bronkaarten kunt u uw code leesbaar en debugbaar houden, zelfs nadat u deze hebt gecombineerd en verkleind, zonder dat dit gevolgen heeft voor de prestaties.

Wanneer u verschillende transpilers, minifiers en bundels gebruikt, verschilt de code die u implementeert van de code die u schrijft. Om de netwerkprestaties te verbeteren, comprimeren deze tools de code tot één regel, verwijderen onnodige tekens en verkorten variabelen.

Verkleinde code en de originele.

Veel tools kunnen bronkaarten genereren die bij uw code horen.

Een bronkaart.

Chrome DevTools leest zowel de geïmplementeerde code als de bronkaarten en laat u fouten in uw code opsporen zoals u dat normaal zou doen, zelfs met breekpunten .

Breekpunten gebruiken in DevTools in een geschreven bronbestand.

Als u beter wilt begrijpen hoe bronkaarten werken, kunt u de bronkaartenvisualizer bekijken.

Bovendien kunnen bronkaarten de extensie . Als u tools en raamwerken bouwt, overweeg dan om deze te ondersteunen. Bekijk deze casestudy: Beter Angular Debugging met DevTools , waarbij het DevTools-team en Angular de foutopsporingservaring in DevTools verbeterden door de x_google_ignoreList extensie te ondersteunen.

Voor meer informatie, zie: