Некоторые инструменты для редактирования сайтов через консоль разработчика (DevTools) в браузере:

• Elements. 14 Вкладка для работы с HTML и CSS. 1 Можно посмотреть структуру страницы, редактировать HTML-код и стили каждого элемента. 1 Также есть дополнительные вкладки для работы со стилями, параметрами и событиями элемента. 4
• Sources. 14 Вкладка показывает все подключённые к странице исходные файлы. 1 Здесь можно делать отладку JavaScript, устанавливать точки останова (breakpoints), просматривать скрипты и их выполнение, а также анализировать исходный код приложения. 1
• Console. 14 Область для написания и выполнения JS-кода в реальном времени. 1 Здесь будут логи, ошибки и предупреждения, которые возникают во время работы страницы. 1
• Network. 4 Выводит в виде таблицы все запросы, которыми обмениваются браузер и сервер. 4 Запросы можно фильтровать по типу, статусу и другим параметрам. 4
• Security. 4 На этой вкладке можно выяснить, насколько безопасна страница и какие протоколы шифрования она использует. 4
• Performance. 4 Позволяет анализировать производительность страницы во время её работы. 4
• Memory. 4 Инструмент для контроля нагрузки кода на систему. 4 По умолчанию показывает, сколько памяти потребляет страница, но можно запросить детальный отчёт по каждому элементу. 4
• Lighthouse. 5 Выполняет несколько функций, в том числе принадлежащих соседним вкладкам. 5 Здесь можно ускорить открытие сайта, проверить его безопасность, оптимизировать SEO и многое другое. 5