You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
*[Чтение данных о производительности](#reading-performance-data)
12
-
*[Просмотр фик](#browsing-commits)
12
+
*[Просмотр коммитов](#browsing-commits)
13
13
*[Фильтрация коммитов](#filtering-commits)
14
14
*[Flame chart диаграмма](#flame-chart)
15
15
*[Ранжированная диаграмма](#ranked-chart)
@@ -50,16 +50,16 @@ DevTools покажет вкладку "Profiler" для приложений,
50
50
### Просмотр коммитов {#browsing-commits}
51
51
Концептуально React выполняет работу в два этапа:
52
52
53
-
*Фаза**рендеринга** определяет, какие изменения необходимо внести, например в DOM. На этом этапе React вызывает `render` а затем сравнивает результат с предыдущим рендером.
54
-
*Фаза**коммита (фиксации)** это когда React применяет любые изменения. (В случае React DOM это когда React вставляет, обновляет и удаляет узлы DOM.) На этом этапе React также вызывает методы жизненного цикла, такие как `componentDidMount` и `componentDidUpdate`.
53
+
*Этап**рендеринга** определяет, какие изменения необходимо внести, например в DOM. На этом этапе React вызывает `render` а затем сравнивает результат с предыдущим рендером.
54
+
*Этап**коммита (фиксации)** это когда React применяет любые изменения. (В случае React DOM это когда React вставляет, обновляет и удаляет узлы DOM.) На этом этапе React также вызывает методы жизненного цикла, такие как `componentDidMount` и `componentDidUpdate`.
55
55
56
56
Профилировщик DevTools группирует информацию о производительности по коммитам.
57
57
Коммиты отображаются на гистограмме в верхней части профилировщика:
58
58
59
59

60
60
61
61
Каждый столбец на диаграмме представляет собой отдельный коммит, черным цветом помечен текущий выбранный коммит.
62
-
Вы можете кликать по столбцам (или по кнопкам со стрелками влево/вправо) чтобы выбрать другой коммит.
62
+
Вы можете кликать по столбцам (или по кнопкам со стрелками влево/вправо) чтобы выбрать другой коммит.
63
63
64
64
Цвет и высота каждого столбца соответствуют тому, сколько времени потребовалось для рендеринга этого коммита.
65
65
(Более высокие желтые столбцы занимали больше времени, чем короткие синие.)
@@ -78,14 +78,14 @@ DevTools покажет вкладку "Profiler" для приложений,
78
78
Flame chart диаграмма представляет состояние вашего приложения для конкретного коммита.
79
79
Каждый столбец в диаграмме представляеи React компонент (например `App`, `Nav`).
80
80
Размер и цвет столбца показывают, сколько времени потребовалось для рендера компонента и его дочерних компонентов.
81
-
(Ширина столбца показывает, сколько времени было потрачено _при последнем рендере_ а цвет показывает, сколько времени было потрачено _как часть текущего коммита_.)
81
+
(Ширина столбца показывает, сколько времени было потрачено _при последнем рендере_. Цвет показывает, сколько времени было потрачено _как часть текущего коммита_.)
0 commit comments