From 01964319435d3b693076dc21b60e80b1d8f34e01 Mon Sep 17 00:00:00 2001 From: "translate-react-bot[bot]" <251169733+translate-react-bot[bot]@users.noreply.github.com> Date: Wed, 4 Feb 2026 15:12:54 +0000 Subject: [PATCH 1/2] =?UTF-8?q?docs:=20translate=20`Profiler.md`=20to=20?= =?UTF-8?q?=D0=A0=D1=83=D1=81=D1=81=D0=BA=D0=B8=D0=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/content/reference/react/Profiler.md | 55 +++++++++++++------------ 1 file changed, 28 insertions(+), 27 deletions(-) diff --git a/src/content/reference/react/Profiler.md b/src/content/reference/react/Profiler.md index 188b2d1b2b..882f51b4a9 100644 --- a/src/content/reference/react/Profiler.md +++ b/src/content/reference/react/Profiler.md @@ -1,10 +1,11 @@ +```md --- title: --- -`` lets you measure rendering performance of a React tree programmatically. +`` позволяет программно измерять производительность рендеринга дерева React. ```js @@ -18,11 +19,11 @@ title: --- -## Reference {/*reference*/} +## Справочник {/*reference*/} ### `` {/*profiler*/} -Wrap a component tree in a `` to measure its rendering performance. +Оберните дерево компонентов в ``, чтобы измерить его производительность рендеринга. ```js @@ -32,41 +33,41 @@ Wrap a component tree in a `` to measure its rendering performance. #### Props {/*props*/} -* `id`: A string identifying the part of the UI you are measuring. -* `onRender`: An [`onRender` callback](#onrender-callback) that React calls every time components within the profiled tree update. It receives information about what was rendered and how much time it took. +* `id`: Строка, идентифицирующая измеряемую часть пользовательского интерфейса. +* `onRender`: [`onRender` callback](#onrender-callback), который React вызывает каждый раз, когда компоненты внутри профилируемого дерева обновляются. Он получает информацию о том, что было отрисовано и сколько времени это заняло. -#### Caveats {/*caveats*/} +#### Ограничения {/*caveats*/} -* Profiling adds some additional overhead, so **it is disabled in the production build by default.** To opt into production profiling, you need to enable a [special production build with profiling enabled.](https://fb.me/react-profiling) +* Профилирование добавляет некоторую дополнительную нагрузку, поэтому **по умолчанию оно отключено в продакшен-сборке.** Чтобы включить профилирование в продакшен-сборке, вам нужно включить [специальную продакшен-сборку с включенным профилированием.](https://fb.me/react-profiling) --- ### `onRender` callback {/*onrender-callback*/} -React will call your `onRender` callback with information about what was rendered. +React вызовет ваш `onRender` callback с информацией о том, что было отрисовано. ```js function onRender(id, phase, actualDuration, baseDuration, startTime, commitTime) { - // Aggregate or log render timings... + // Агрегируйте или записывайте время рендеринга... } ``` -#### Parameters {/*onrender-parameters*/} +#### Параметры {/*onrender-parameters*/} -* `id`: The string `id` prop of the `` tree that has just committed. This lets you identify which part of the tree was committed if you are using multiple profilers. -* `phase`: `"mount"`, `"update"` or `"nested-update"`. This lets you know whether the tree has just been mounted for the first time or re-rendered due to a change in props, state, or Hooks. -* `actualDuration`: The number of milliseconds spent rendering the `` and its descendants for the current update. This indicates how well the subtree makes use of memoization (e.g. [`memo`](/reference/react/memo) and [`useMemo`](/reference/react/useMemo)). Ideally this value should decrease significantly after the initial mount as many of the descendants will only need to re-render if their specific props change. -* `baseDuration`: The number of milliseconds estimating how much time it would take to re-render the entire `` subtree without any optimizations. It is calculated by summing up the most recent render durations of each component in the tree. This value estimates a worst-case cost of rendering (e.g. the initial mount or a tree with no memoization). Compare `actualDuration` against it to see if memoization is working. -* `startTime`: A numeric timestamp for when React began rendering the current update. -* `commitTime`: A numeric timestamp for when React committed the current update. This value is shared between all profilers in a commit, enabling them to be grouped if desirable. +* `id`: Строковое значение пропса `id` дерева ``, которое только что зафиксировалось. Это позволяет вам определить, какая часть дерева была зафиксирована, если вы используете несколько профилировщиков. +* `phase`: `"mount"`, `"update"` или `"nested-update"`. Это позволяет узнать, было ли дерево смонтировано впервые или перерисовано из-за изменения пропсов, состояния или хуков. +* `actualDuration`: Количество миллисекунд, потраченное на рендеринг `` и его потомков для текущего обновления. Это показывает, насколько эффективно поддерево использует мемоизацию (например, [`memo`](/reference/react/memo) и [`useMemo`](/reference/react/useMemo)). В идеале это значение должно значительно уменьшиться после первоначального монтирования, поскольку многие потомки будут перерисовываться только в том случае, если их конкретные пропсы изменятся. +* `baseDuration`: Количество миллисекунд, оценивающее, сколько времени потребуется для повторного рендеринга всего поддерева `` без каких-либо оптимизаций. Оно рассчитывается путем суммирования последних длительностей рендеринга каждого компонента в дереве. Это значение оценивает наихудшую стоимость рендеринга (например, первоначальное монтирование или дерево без мемоизации). Сравните `actualDuration` с ним, чтобы увидеть, работает ли мемоизация. +* `startTime`: Числовой временной штамп, когда React начал рендеринг текущего обновления. +* `commitTime`: Числовой временной штамп, когда React зафиксировал текущее обновление. Это значение совместно используется всеми профилировщиками в фиксации, что позволяет группировать их при необходимости. --- -## Usage {/*usage*/} +## Использование {/*usage*/} -### Measuring rendering performance programmatically {/*measuring-rendering-performance-programmatically*/} +### Программное измерение производительности рендеринга {/*measuring-rendering-performance-programmatically*/} -Wrap the `` component around a React tree to measure its rendering performance. +Оберните компонент `` вокруг дерева React, чтобы измерить его производительность рендеринга. ```js {2,4} @@ -77,25 +78,25 @@ Wrap the `` component around a React tree to measure its rendering per ``` -It requires two props: an `id` (string) and an `onRender` callback (function) which React calls any time a component within the tree "commits" an update. +Он требует два пропса: `id` (строка) и `onRender` callback (функция), который React вызывает всякий раз, когда компонент в дереве "фиксирует" обновление. -Profiling adds some additional overhead, so **it is disabled in the production build by default.** To opt into production profiling, you need to enable a [special production build with profiling enabled.](https://fb.me/react-profiling) +Профилирование добавляет некоторую дополнительную нагрузку, поэтому **по умолчанию оно отключено в продакшен-сборке.** Чтобы включить профилирование в продакшен-сборке, вам нужно включить [специальную продакшен-сборку с включенным профилированием.](https://fb.me/react-profiling) -`` lets you gather measurements programmatically. If you're looking for an interactive profiler, try the Profiler tab in [React Developer Tools](/learn/react-developer-tools). It exposes similar functionality as a browser extension. +`` позволяет собирать измерения программно. Если вы ищете интерактивный профилировщик, попробуйте вкладку Profiler в [React Developer Tools](/learn/react-developer-tools). Она предоставляет аналогичную функциональность в виде расширения браузера. --- -### Measuring different parts of the application {/*measuring-different-parts-of-the-application*/} +### Измерение различных частей приложения {/*measuring-different-parts-of-the-application*/} -You can use multiple `` components to measure different parts of your application: +Вы можете использовать несколько компонентов `` для измерения различных частей вашего приложения: ```js {5,7} @@ -108,7 +109,7 @@ You can use multiple `` components to measure different parts of your ``` -You can also nest `` components: +Вы также можете вкладывать компоненты `` друг в друга: ```js {5,7,9,12} @@ -126,7 +127,7 @@ You can also nest `` components: ``` -Although `` is a lightweight component, it should be used only when necessary. Each use adds some CPU and memory overhead to an application. +Хотя `` является легковесным компонентом, его следует использовать только при необходимости. Каждое его использование добавляет некоторую нагрузку на процессор и память приложения. --- - +``` \ No newline at end of file From b9bf26bf3565bd2e985f74dbc419d8d5e0fa6f78 Mon Sep 17 00:00:00 2001 From: "translate-react-bot[bot]" <251169733+translate-react-bot[bot]@users.noreply.github.com> Date: Mon, 18 May 2026 16:26:39 +0000 Subject: [PATCH 2/2] =?UTF-8?q?docs:=20translate=20`Profiler.md`=20to=20?= =?UTF-8?q?=D0=A0=D1=83=D1=81=D1=81=D0=BA=D0=B8=D0=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/content/reference/react/Profiler.md | 17 +++++++---------- 1 file changed, 7 insertions(+), 10 deletions(-) diff --git a/src/content/reference/react/Profiler.md b/src/content/reference/react/Profiler.md index 882f51b4a9..8a2fd625fd 100644 --- a/src/content/reference/react/Profiler.md +++ b/src/content/reference/react/Profiler.md @@ -1,8 +1,6 @@ -```md --- title: --- - `` позволяет программно измерять производительность рендеринга дерева React. @@ -38,7 +36,7 @@ title: #### Ограничения {/*caveats*/} -* Профилирование добавляет некоторую дополнительную нагрузку, поэтому **по умолчанию оно отключено в продакшен-сборке.** Чтобы включить профилирование в продакшен-сборке, вам нужно включить [специальную продакшен-сборку с включенным профилированием.](https://fb.me/react-profiling) +* Профилирование добавляет некоторую дополнительную нагрузку, поэтому **по умолчанию оно отключено в production-сборке.** Чтобы включить профилирование в production-сборке, вам нужно включить [специальную production-сборку с включенным профилированием.](https://fb.me/react-profiling) --- @@ -54,12 +52,12 @@ function onRender(id, phase, actualDuration, baseDuration, startTime, commitTime #### Параметры {/*onrender-parameters*/} -* `id`: Строковое значение пропса `id` дерева ``, которое только что зафиксировалось. Это позволяет вам определить, какая часть дерева была зафиксирована, если вы используете несколько профилировщиков. +* `id`: Строковое значение `id` пропса дерева ``, которое только что зафиксировалось. Это позволяет вам определить, какая часть дерева была зафиксирована, если вы используете несколько профилировщиков. * `phase`: `"mount"`, `"update"` или `"nested-update"`. Это позволяет узнать, было ли дерево смонтировано впервые или перерисовано из-за изменения пропсов, состояния или хуков. * `actualDuration`: Количество миллисекунд, потраченное на рендеринг `` и его потомков для текущего обновления. Это показывает, насколько эффективно поддерево использует мемоизацию (например, [`memo`](/reference/react/memo) и [`useMemo`](/reference/react/useMemo)). В идеале это значение должно значительно уменьшиться после первоначального монтирования, поскольку многие потомки будут перерисовываться только в том случае, если их конкретные пропсы изменятся. * `baseDuration`: Количество миллисекунд, оценивающее, сколько времени потребуется для повторного рендеринга всего поддерева `` без каких-либо оптимизаций. Оно рассчитывается путем суммирования последних длительностей рендеринга каждого компонента в дереве. Это значение оценивает наихудшую стоимость рендеринга (например, первоначальное монтирование или дерево без мемоизации). Сравните `actualDuration` с ним, чтобы увидеть, работает ли мемоизация. -* `startTime`: Числовой временной штамп, когда React начал рендеринг текущего обновления. -* `commitTime`: Числовой временной штамп, когда React зафиксировал текущее обновление. Это значение совместно используется всеми профилировщиками в фиксации, что позволяет группировать их при необходимости. +* `startTime`: Числовой временной штамп, указывающий, когда React начал рендеринг текущего обновления. +* `commitTime`: Числовой временной штамп, указывающий, когда React зафиксировал текущее обновление. Это значение является общим для всех профилировщиков в фиксации, что позволяет группировать их при необходимости. --- @@ -78,11 +76,11 @@ function onRender(id, phase, actualDuration, baseDuration, startTime, commitTime ``` -Он требует два пропса: `id` (строка) и `onRender` callback (функция), который React вызывает всякий раз, когда компонент в дереве "фиксирует" обновление. +Он требует два пропса: `id` (строка) и `onRender` callback (функция), который React вызывает всякий раз, когда компонент внутри дерева "фиксирует" обновление. -Профилирование добавляет некоторую дополнительную нагрузку, поэтому **по умолчанию оно отключено в продакшен-сборке.** Чтобы включить профилирование в продакшен-сборке, вам нужно включить [специальную продакшен-сборку с включенным профилированием.](https://fb.me/react-profiling) +Профилирование добавляет некоторую дополнительную нагрузку, поэтому **по умолчанию оно отключено в production-сборке.** Чтобы включить профилирование в production-сборке, вам нужно включить [специальную production-сборку с включенным профилированием.](https://fb.me/react-profiling) @@ -129,5 +127,4 @@ function onRender(id, phase, actualDuration, baseDuration, startTime, commitTime Хотя `` является легковесным компонентом, его следует использовать только при необходимости. Каждое его использование добавляет некоторую нагрузку на процессор и память приложения. ---- -``` \ No newline at end of file +--- \ No newline at end of file