Главная страницаКатегория chrome devtoolsВведение в инструменты разработчика, v4

Введение в инструменты разработчика, v4

Name: Введение в инструменты разработчика, v4
Price: 12.5 USD
Rating: 4.5 (12 reviews)

Introduction to Developer Tools, v4

frontendmasters

Jon Kuperman

★4.5 (всего оценок - 12)

Продолжительность

3 ч 44 мин

Категория

Chrome DevTools

Количество уроков

33 Видео

Дата добавления

20 февр. 2025 г., 17:35

Язык

Английский

Дата выхода

18 февр. 2025 г., 01:00

Дата обновления

29 апр. 2026 г., 22:36

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

Что вы изучите в этом курсе

Вместо поверхностного знакомства с инструментами отладки вы получите системное понимание всех ключевых панелей DevTools и научитесь применять их для решения реальных задач разработки.

Работа с интерфейсом и настройками DevTools

Вы освоите навигацию, настройку окружения и используемые по умолчанию панели, что позволит ускорить анализ приложений.

Редактирование и отладка кода

Использование Breakpoints и контроль исполнения кода
Отладка асинхронных операций, событий и сетевых запросов
Работа с Workspace для редактирования файлов прямо из браузера

Анализ производительности и сети

Инструменты Chrome DevTools позволяют не только искать баги, но и выявлять узкие места в производительности веб‑страницы.

Профилирование производительности

Запись и анализ загрузки CPU
Поиск долгих задач и тяжёлых рендеринг-операций
Оптимизация загрузки ресурсов

Исследование сетевой активности

Измерение времени загрузки ресурсов
Анализ waterfall‑диаграмм
Эмуляция 3G/4G и ограниченной пропускной способности

Аудит качества веб‑страниц

Курс включает практику работы с Audits/Lighthouse, позволяя оценивать доступность, SEO и производительность сайта.

Проведение комплексных аудитов

Анализ доступности интерфейса
Оценка SEO‑показателей
Рекомендации по оптимизации

Практическая ценность курса

После завершения обучения вы будете уверенно диагностировать и исправлять проблемы в веб‑приложениях, использовать DevTools как полноценную среду разработки и улучшать пользовательский опыт за счёт оптимизации скорости и стабильности.

Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум

Урок 1. 00:06:44
Introduction
Урок 2. 00:06:44
Why Master the Chrome DevTools
Урок 3. 00:08:09
Web Performance Metrics
Урок 4. 00:07:48
Inspecting Elements & Styles
Урок 5. 00:07:36
Using the Network Tab
Урок 6. 00:09:51
Measuring Performance
Урок 7. 00:07:06
Console & Sources Tabs
Урок 8. 00:02:38
Browsing Storage & Memory Usage
Урок 9. 00:02:02
Lighthouse Reports & Device Simulation
Урок 10. 00:06:43
History of DevTools
Урок 11. 00:05:49
Elements, Console, & Source Maps
Урок 12. 00:09:16
Making Quick Edits
Урок 13. 00:02:57
Viewing Accessibility Information
Урок 14. 00:05:58
Quick Edits Exercise
Урок 15. 00:08:12
Network Optimizations
Урок 16. 00:07:49
Browser Priority, Preloading, & Prefetching
Урок 17. 00:07:39
Using the Network DevTools
Урок 18. 00:06:29
Lighthouse Web Audits
Урок 19. 00:05:14
Exploring a Lighthouse Audit
Урок 20. 00:12:50
Lighthouse Audit Exercise
Урок 21. 00:02:38
Debugging JavaScript Code
Урок 22. 00:12:10
Using the Script Debugger
Урок 23. 00:06:28
Step Through Debugging Exercise
Урок 24. 00:09:52
Measure Performance with RAIL
Урок 25. 00:07:32
Avoiding Page Jank & requestAnimationFrame
Урок 26. 00:07:02
On-Page Performance Profiling
Урок 27. 00:09:25
Performance Profiling Exercise
Урок 28. 00:06:29
Identifying Memory Leaks
Урок 29. 00:04:02
Understanding Garbage Collection
Урок 30. 00:07:06
Memory Heap Snapshots
Урок 31. 00:05:38
Memory Leak Exercise
Урок 32. 00:06:37
Experimental Features & AI
Урок 33. 00:01:50
Wrapping Up

Авторы - frontendmasters, Jon Kuperman

frontendmasters

FrontendMasters — одна из ведущих онлайн-платформ для изучения фронтенд- и веб-разработки. Курсы представлены в формате видеоворкшопов и преподаются практикующими экспертами из крупных технологических компаний. Платформа охватывает широкий спектр современных технологий (JavaScript, React, TypeScript и др.) и делает упор на глубокое понимание и применение знаний на практике.

+792

Jon Kuperman

Джон - Developer Advocate в Cloudflare, где он работает над проектами Workers и Pages. Он страстно увлечён открытым программным обеспечением и идеями свободного интернета. В свободное время Джон активно занимается самообразованием, чтением, ведением блога и обучением.

Комментарии

restored
16 апр. 2026 г., 17:40
hey team can you update the uncut version in the archive as well
CourseHunter Team restored
17 апр. 2026 г., 12:12
Should be fixed. Try please. Thanks.
tim
20 мар. 2025 г., 00:00
thnx!
deeodee
16 мар. 2025 г., 17:17
the course archive still contains the uncut version
CourseHunter Team deeodee
16 мар. 2025 г., 20:29
Should be good now
deeodee CourseHunter Team
17 мар. 2025 г., 04:14
thank you very much
weathered turncoat
15 мар. 2025 г., 09:26
Hi! Is there a way to access the old un-cut videos? I find that they tend to cut out certain valuable titbits in the final version.
CourseHunter Team weathered turncoat
15 мар. 2025 г., 19:46
https://fex.net/s/arrtckt

Link will expire in 7 days
weathered turncoat CourseHunter Team
15 мар. 2025 г., 20:21
Thank you!
CourseHunter Team weathered turncoat
15 мар. 2025 г., 20:26
You are welcome
Helcar
22 февр. 2025 г., 00:19
Code: https://github.com/jkup/mastering-devtools-static
Slides: https://tinyurl.com/mastering-devtools-4
Deployed Code: https://masteringdevtools.com/