Skip to content

Commit 566e66a

Browse files
committed
Suspense term switched to lowercase
1 parent c3b7c87 commit 566e66a

File tree

1 file changed

+16
-16
lines changed

1 file changed

+16
-16
lines changed

content/docs/concurrent-mode-suspense.md

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -36,15 +36,15 @@ const ProfilePage = React.lazy(() => import('./ProfilePage')); // Ленивая
3636

3737
Задержка при получении данных – это новая возможность, которая позволяет использовать `<Suspense>` и **декларативно «ждать» чего-либо ещё, включая данные.** Эта страница описывает получение данных, однако это применимо к изображениям, скриптам и другим асинхронным действиям.
3838

39-
- [Что такое Задержка?](#what-is-suspense-exactly)
40-
- [Чем Задержка не является](#what-suspense-is-not)
41-
- [Что позволяет делать Задержка](#what-suspense-lets-you-do)
39+
- [Что такое задержка?](#what-is-suspense-exactly)
40+
- [Чем задержка не является](#what-suspense-is-not)
41+
- [Что позволяет делать задержка](#what-suspense-lets-you-do)
4242
- [Использование Задержки на практике](#using-suspense-in-practice)
4343
- [Что если я не использую Relay?](#what-if-i-dont-use-relay)
4444
- [Для авторов библиотек](#for-library-authors)
4545
- [Классические подходы против Задержки](#traditional-approaches-vs-suspense)
46-
- [Подход 1: Получаем-после-рендера (Задержка не используется)](#approach-1-fetch-on-render-not-using-suspense)
47-
- [Подход 2: Получаем-потом-рендерим (Задержка не используется)](#approach-2-fetch-then-render-not-using-suspense)
46+
- [Подход 1: Получаем-после-рендера (задержка не используется)](#approach-1-fetch-on-render-not-using-suspense)
47+
- [Подход 2: Получаем-потом-рендерим (задержка не используется)](#approach-2-fetch-then-render-not-using-suspense)
4848
- [Подход 3: Рендерим-во-время-получения-данных (используем Задержку)](#approach-3-render-as-you-fetch-using-suspense)
4949
- [Начинаем получать данные рано](#start-fetching-early)
5050
- [Мы все ещё в этом разбираемся](#were-still-figuring-this-out)
@@ -56,7 +56,7 @@ const ProfilePage = React.lazy(() => import('./ProfilePage')); // Ленивая
5656
- [Обработка ошибок](#handling-errors)
5757
- [Что дальше?](#next-steps)
5858

59-
## Что такое Задержка? {#what-is-suspense-exactly}
59+
## Что такое задержка? {#what-is-suspense-exactly}
6060

6161
Задержка позволяет вашим компонентам «ждать» чего-то до их рендера. В [этом примере](https://codesandbox.io/s/frosty-hermann-bztrp) два компонента ждут асинхронного вызова API, чтобы получить данные:
6262

@@ -95,23 +95,23 @@ function ProfileTimeline() {
9595

9696
**[Посмотреть пример на CodeSandbox](https://codesandbox.io/s/frosty-hermann-bztrp)**
9797

98-
Это раннее демо. Не переживайте, если оно кажется бессмысленным. Мы поговорим о том, как оно работает ниже. Имейте ввиду, что Задержка – это больше *механизм* и определенные API, такие как `fetchProfileData()` или `resource.posts.read()` в примере выше не очень важны. Если интересно, вы можете найти их определения прямо в [демо песочнице](https://codesandbox.io/s/frosty-hermann-bztrp).
98+
Это раннее демо. Не переживайте, если оно кажется бессмысленным. Мы поговорим о том, как оно работает ниже. Имейте ввиду, что задержка – это больше *механизм* и определенные API, такие как `fetchProfileData()` или `resource.posts.read()` в примере выше не очень важны. Если интересно, вы можете найти их определения прямо в [демо песочнице](https://codesandbox.io/s/frosty-hermann-bztrp).
9999

100100
Задержка – это не библиотека для получения данных. Это **механизм для библиотек получения данных**, который сообщает React, что *данные, которые читает компонент ещё не готовы*. React в этом случае может подождать, пока они будут готовы и обновить пользовательский интерфейс. В Facebook, мы используем Relay с [интеграцией новой Задержки](https://relay.dev/docs/en/experimental/a-guided-tour-of-relay#loading-states-with-suspense). Мы ожидаем, что другие библиотеки, такие как Apollo смогут предоставить подобную интеграцию.
101101

102102
В долгосрочной перспективе мы собираемся сделать Задержку основным способом чтения асинхронных данных из компонентов, независимо от того, откуда эти данные пришли.
103103

104-
### Чем Задержка не является {#what-suspense-is-not}
104+
### Чем задержка не является {#what-suspense-is-not}
105105

106106
Задержка — это совершенно иной подход среди существующих для решения этих проблем, поэтому на первый взгляд это часто ведёт к заблуждениям. Давайте проясним самые распространенные:
107107

108108
* **Это не реализация получения данных.** Задержка не предполагает, что вы используете GraphQL, REST или какой-то другой определённый формат данных, библиотеку, транспорт или протокол.
109109

110-
* **Это не готовый к использованию клиент.** Вы не сможете заменить `fetch` или Relay Задержкой. Но вы можете использовать библиотеку, в которую интегрирована Задержка (например [новый API у Relay](https://relay.dev/docs/en/experimental/api-reference)).
110+
* **Это не готовый к использованию клиент.** Вы не сможете заменить `fetch` или Relay Задержкой. Но вы можете использовать библиотеку, в которую интегрирована задержка (например [новый API у Relay](https://relay.dev/docs/en/experimental/api-reference)).
111111

112112
* **Задержка не привязывает получение данных к слою представления.** Она помогает управлять отображением состояния загрузки в пользовательском интерфейсе, но она не связывает вашу сетевую логику с React-компонентами.
113113

114-
### Что позволяет делать Задержка {#what-suspense-lets-you-do}
114+
### Что позволяет делать задержка {#what-suspense-lets-you-do}
115115

116116
Итак, в чём идея Задержки? Есть несколько вариантов ответа на этот вопрос:
117117

@@ -125,7 +125,7 @@ function ProfileTimeline() {
125125

126126
До настоящего времени в Facebook мы использовали в продакшн только Relay с интегрированной Задержкой. **Если вы ищете практическое руководство как начать сегодня, [посмотрите руководство Relay](https://relay.dev/docs/en/experimental/step-by-step)!** Там рассмотрены подходы, которые уже хорошо работают у нас в продакшн.
127127

128-
**Код примеров на этой странице использует «фальшивую» реализацию API, а не Relay.** Это позволяет легче их понимать, если вы не знакомы с GraphQL, но они не расскажут вам о «правильном способе» как построить приложение с использованием Задержки. Эта страница скорее о концептуальных принципах и нацелена помочь вам понять *почему* Задержка работает определенным образом и какие проблемы она решает.
128+
**Код примеров на этой странице использует «фальшивую» реализацию API, а не Relay.** Это позволяет легче их понимать, если вы не знакомы с GraphQL, но они не расскажут вам о «правильном способе» как построить приложение с использованием Задержки. Эта страница скорее о концептуальных принципах и нацелена помочь вам понять *почему* задержка работает определенным образом и какие проблемы она решает.
129129

130130
### Что, если я не использую Relay? {#what-if-i-dont-use-relay}
131131

@@ -139,13 +139,13 @@ function ProfileTimeline() {
139139

140140
Мы ожидаем увидеть в сообществе много экспериментов с другими библиотеками. Есть одна важная деталь на заметку авторам библиотек получения данных.
141141

142-
Несмотря на то, что это технически выполнимо, Задержка сейчас **не** предназначена для получения данных во время рендера компонента. Скорее она позволяет компонентам показать, что они «ждут» данные, которые *уже были получены*. **[Построение хорошего опыта взаимодействия пользователя с интерфейсами в Конкурентном режиме с Задержкой](/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense.html) описывает почему это важно и как реализовать этот подход на практике.**
142+
Несмотря на то, что это технически выполнимо, задержка сейчас **не** предназначена для получения данных во время рендера компонента. Скорее она позволяет компонентам показать, что они «ждут» данные, которые *уже были получены*. **[Построение хорошего опыта взаимодействия пользователя с интерфейсами в Конкурентном режиме с Задержкой](/blog/2019/11/06/building-great-user-experiences-with-concurrent-mode-and-suspense.html) описывает почему это важно и как реализовать этот подход на практике.**
143143

144144
Если у вас нет решения, которое помогает предотвращать водопады, мы предлагаем использовать API, которые поддерживают или обеспечивают получение данных до рендера. В качестве конкретного примера, посмотрите как в [Relay Suspense API](https://relay.dev/docs/en/experimental/api-reference#usepreloadedquery) организована предзагрузка. Наша информация про это была не очень последовательной. Задержка для получения данных все ещё в экспериментальном режиме, наши рекомендации могут измениться со временем, так как мы учимся новому во время использования технологии в продакшн и лучше понимаем предметную область.
145145

146146
## Классические подходы против Задержки {#traditional-approaches-vs-suspense}
147147

148-
Мы могли бы рассказать о Задержке без упоминания популярных способов получения данных. В этом случае было бы сложнее увидеть какие проблемы решает Задержка, почему эти проблемы нужно решать и как Задержка отличается от существующих решений.
148+
Мы могли бы рассказать о Задержке без упоминания популярных способов получения данных. В этом случае было бы сложнее увидеть какие проблемы решает задержка, почему эти проблемы нужно решать и как задержка отличается от существующих решений.
149149

150150
Наоборот, мы взглянем на Задержку, как на следующий логический шаг в перечне подходов:
151151

@@ -159,7 +159,7 @@ function ProfileTimeline() {
159159
160160
Для сравнения подходов мы реализуем страницу с профилем пользователя используя каждый из них.
161161

162-
### Подход 1: Получаем-после-рендера (Задержка не используется) {#approach-1-fetch-on-render-not-using-suspense}
162+
### Подход 1: Получаем-после-рендера (задержка не используется) {#approach-1-fetch-on-render-not-using-suspense}
163163

164164
Распространённый сегодня способ получения данных в React с использованием эффекта:
165165

@@ -233,7 +233,7 @@ function ProfileTimeline() {
233233

234234
Водопады распространены в коде который получает данные после рендера. Их можно устранить, но по мере роста продукта, многие люди предпочитают использовать решение, которое защищает от этой проблемы.
235235

236-
### Подход 2: Получаем-потом-рендерим (Задержка не используется) {#approach-2-fetch-then-render-not-using-suspense}
236+
### Подход 2: Получаем-потом-рендерим (задержка не используется) {#approach-2-fetch-then-render-not-using-suspense}
237237

238238
Библиотеки могут предотвратить появление водопадов предлагая более централизованный способ получения данных. Например, Relay решает эту проблему перемещением информации о данных, которые нужны компоненту в статически анализируемые *фрагменты*, которые позже собираются в единый запрос.
239239

@@ -723,7 +723,7 @@ function ProfilePage() {
723723

724724
## Что дальше? {#next-steps}
725725

726-
Мы рассмотрели основы Задержки для получения данных! Важно, что теперь мы лучше понимаем *почему* Задержка работает таким образом и как вписывается в область получения данных.
726+
Мы рассмотрели основы Задержки для получения данных! Важно, что теперь мы лучше понимаем *почему* задержка работает таким образом и как вписывается в область получения данных.
727727

728728
Задержка отвечает на некоторые вопросы, но и поднимает свои собственные:
729729

0 commit comments

Comments
 (0)