Начинающему JS разработчику чаще всего не понятно назначение всех инструментов которые ему предоставляет браузер. Да и относительно опытный разработчик, если в основном решает однотипные задачи вряд ли может похвастаться, что регулярно пользуется всеми возможностями которые ему предоставляют инструменты разработчика браузера. Однако познакомиться с ними было бы крайне полезно хотя бы для того, чтобы при решении каких то новых проблем Вы сразу же знали где искать ответ, а более подробно изучив тонкости каждого из них, Вы сможете поднять свою производительность труда на новый уровень.
Отдельно бы хотелось отметить, что DevTools находится в постоянной активной разработке поэтому название инструментов/панелей/вкладок, как и их наличие в целом или способ доступа к ним со временем может быть изменен. Поэтому не стоит пугаться, если на момент прочтения Вами этой статьи DevTools будет незначительно отличатся от того что указано в описании или на скриншотах в этой статье. Читать дальше ->

https://habrahabr.ru/post/337116/