Отладка кода в браузере
Шувалов Антон
FrontendConf 2015
Отладка кода в браузере
2
• Зачем нужен console.log и почему он не
подходит для отладки?
• Как отладчик поможет вам?
Console
С чего всё началось?
4
console.log(), КАРЛ!
5
6
7
8
9
10
Что не так с console.log()
11
• Не точно
• Не подробно
• Медленно
console.log — не отладчик
12
но…
13
зачем нам console?
14
console
15
console.group
16
console.dir
17
console.assert
18
console.time
19
console.profile
20
console.profile
21
Возможности сonsole
22
• Сообщения, ошибки предупреждения
• log(), info(), warn(), error(), assert(), group(),
dir()
• Профилирование
• time(), profile()
Отладчик
23
Основы отладки
24
25
26
27
28
29
30
31
32
33
34
35
36
37
Нет постоянных
перезагрузок страницы!
38
Управление ходом
исполнения программы!
39
Доступ к стеку вызовов!
40
Отлично работающий
REPL!
41
Работает с SourceMaps!
42
Что ещё интересного
в DevTools?
43
Watch Expressions
44
45
46
47
48
49
50
51
Работа со стеком
52
53
54
55
56
Отладка асинхронного кода
57
58
59
60
61
62
Console — для логов
63
DevTools — для отладки
64
Не забивайте гвозди
изолентой
65
66
twitter.com/shuvalov_anton
github.com/shuvalov-anton
Шувалов Антон

Отладка кода в браузере