Skip to content

Commit c27049c

Browse files
Ivangcor
andauthored
Apply suggestions from code review
Co-authored-by: Anton Ahatov <[email protected]>
1 parent 6b0b406 commit c27049c

File tree

1 file changed

+6
-6
lines changed

1 file changed

+6
-6
lines changed

content/blog/2018-09-10-introducing-the-react-profiler.md

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ React 16.5 добавляет поддержку нового плагина п
99
В этом посте рассматриваются следующие темы:
1010
* [Профилирование приложения](#profiling-an-application)
1111
* [Чтение данных о производительности](#reading-performance-data)
12-
* [Просмотр фик](#browsing-commits)
12+
* [Просмотр коммитов](#browsing-commits)
1313
* [Фильтрация коммитов](#filtering-commits)
1414
* [Flame chart диаграмма](#flame-chart)
1515
* [Ранжированная диаграмма](#ranked-chart)
@@ -50,16 +50,16 @@ DevTools покажет вкладку "Profiler" для приложений,
5050
### Просмотр коммитов {#browsing-commits}
5151
Концептуально React выполняет работу в два этапа:
5252

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`.
5555

5656
Профилировщик DevTools группирует информацию о производительности по коммитам.
5757
Коммиты отображаются на гистограмме в верхней части профилировщика:
5858

5959
![Bar chart of profiled commits](../images/blog/introducing-the-react-profiler/commit-selector.png)
6060

6161
Каждый столбец на диаграмме представляет собой отдельный коммит, черным цветом помечен текущий выбранный коммит.
62-
Вы можете кликать по столбцам (или по кнопкам со стрелками влево/вправо ) чтобы выбрать другой коммит.
62+
Вы можете кликать по столбцам (или по кнопкам со стрелками влево/вправо) чтобы выбрать другой коммит.
6363

6464
Цвет и высота каждого столбца соответствуют тому, сколько времени потребовалось для рендеринга этого коммита.
6565
(Более высокие желтые столбцы занимали больше времени, чем короткие синие.)
@@ -78,14 +78,14 @@ DevTools покажет вкладку "Profiler" для приложений,
7878
Flame chart диаграмма представляет состояние вашего приложения для конкретного коммита.
7979
Каждый столбец в диаграмме представляеи React компонент (например `App`, `Nav`).
8080
Размер и цвет столбца показывают, сколько времени потребовалось для рендера компонента и его дочерних компонентов.
81-
(Ширина столбца показывает, сколько времени было потрачено _при последнем рендере_ а цвет показывает, сколько времени было потрачено _как часть текущего коммита_.)
81+
(Ширина столбца показывает, сколько времени было потрачено _при последнем рендере_. Цвет показывает, сколько времени было потрачено _как часть текущего коммита_.)
8282

8383
![Example flame chart](../images/blog/introducing-the-react-profiler/flame-chart.png)
8484

8585
> Примечание:
8686
>
8787
> Ширина столбца указывает, сколько времени потребовалось для рендера компонента (и его дочерних компонентов) при последнем рендере.
88-
> Если компонент не подвергалс ререндеру как часть этого коммита, время представляет предыдущий рендер.
88+
> Если компонент не подвергался ререндеру как часть этого коммита, время представляет предыдущий рендер.
8989
> Чем больше компонент, тем больше времени требуется на рендер.
9090
>
9191
> Цвет столбца указывает, сколько времени потребовалось компоненту (и его дочерним компонентам) для рендера в выбранном коммите.

0 commit comments

Comments
 (0)