В первой части про инструменты разработчика мы разобрались со вкладкой Elements, а теперь продолжаем знакомить вас с другими важными частями DevTools — вкладками Console, Sources и Network.

Бонус — расскажем, как сделать скриншот всей страницы в Chrome без плагинов. Смотрите в карточках 😉

Мы продолжаем обзор инструментов разработчика — Chrome DevTools. Мы уже познакомились с вкладками Elements, Console, Sources и Network и разобрались с их основными функциями.

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

Разбираемся, какие задачи можно решить с помощью Chrome DevTools в нашей статье.

Привет! Мы стремимся к тому, чтобы вам было ещё интереснее и полезнее проводить с нами время. Поэтому мы хотим узнать кое-что о вас и ваше мнение о том, как нам стать лучше. Предлагаем пройти небольшой опрос.

Быстрые сайты любят и пользователи, и поисковые системы. С первыми всё просто: если страница будет слишком долго загружаться, пользователь её закроет и перейдёт на другой сайт. С поисковиками похожая история: скорость загрузки — один из факторов, влияющих на ранжирование сайта в поисковой выдаче.

Проверить производительность сайта можно с помощью разных инструментов. Один из наиболее известных — Lighthouse от компании Google. Он не только тестирует сайт и показывает оценку производительности, но и даёт конкретные рекомендации: что можно улучшить, чтобы сделать сайт быстрее.

Как с помощью Lighthouse проверить качество сайта и повысить его производительность, разбираем в статье.

Большую часть времени разработчик творит код в редакторе. Редактор кода Visual Studio Code сам по себе помогает работать быстрее. Например, он подчёркивает ошибки красным цветом и выдаёт подсказки. Но процесс можно сделать ещё приятнее: достаточно установить нужное расширение.

Плагинов VS Code очень много, и здесь мы расскажем об одних из самых популярных. Все они пригодятся при работе с JavaScript.

Ещё больше плагинов и ссылки на скачивание в нашей статье.