Mapy źródeł umożliwiają zachowanie czytelności i możliwości debugowania kodu nawet po jego połączeniu i zminifikowaniu bez wpływu na wydajność.
Gdy używasz różnych narzędzi do transpilacji, minifikacji i zbiorczego, wdrażany kod różni się od kodu, który został przez Ciebie napisany. Aby poprawić wydajność sieci, te narzędzia kompresują kod do pojedynczej linii, usuwają zbędne znaki i skracają zmienne.
Wiele narzędzi może generować mapy źródłowe, które będą towarzyszyć Twojemu kodowi.
Narzędzie Chrome DevTools odczytuje zarówno wdrożony kod, jak i mapy źródeł, i umożliwi debugowanie kodu w standardowy sposób, nawet z użyciem punktów przerwania.
Aby lepiej zrozumieć, jak działają mapy źródeł, skorzystaj z wizualizacji map źródeł.
Mapy źródeł mogą też zawierać rozszerzenia. Jeśli tworzysz narzędzia i ramy, rozważ ich obsługę. Zapoznaj się ze studium przypadku: ulepszone debugowanie Angulara za pomocą Narzędzi dla deweloperów, w którym zespół Narzędzi dla deweloperów i Angular ulepszyli debugowanie w Narzędziach dla deweloperów, umożliwiając obsługę x_google_ignoreList.
Aby dowiedzieć się więcej, zapoznaj się z tymi artykułami: