Skip to content

Commit 595c6f3

Browse files
author
Stanislav Gavrilov
committed
docs(ru): 40-christmas-web-worker.md translation
1 parent cc4d34f commit 595c6f3

2 files changed

Lines changed: 34 additions & 1 deletion

File tree

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
---
2+
title: 🟠 Веб-воркеры
3+
description: Испытание 40 о том как создать и использовать веб-воркер
4+
author: thomas-laforge
5+
challengeNumber: 40
6+
command: performance-christmas-web-worker
7+
sidebar:
8+
order: 119
9+
---
10+
11+
## Информация
12+
13+
Это испытание было создано для [Angular Advent Calendar](https://angularchristmascalendar.com) 2023.
14+
15+
Это простое приложение, где нужно нажать на кнопку **Discover**, чтобы увидеть сюрприз, скрывающийся за черным экраном. Тем не менее, взаимодействие с приложением оставляет желать лучшего. При нажатии на кнопку происходит зависание страницы, а затем, после краткой задержки, секрет раскрывается мгновенно и без какой-либо плавности в анимации.
16+
17+
> Пояснение: Для того, чтобы вызвать зависание приложения, загрузчик использует функцию, выполняющую очень сложные вычисления. Хотя возможно было бы использовать обычный таймер, но это не суть данного испытания.
18+
19+
Так как JavaScript работает в однопоточном режиме, выполнение ресурсоемких задач препятствует обновлению пользовательского интерфейса браузера и реагированию на клики мыши или другие действия. Задача этого испытания - разгрузить основной поток, перенеся сложные вычисления в отдельный поток. Для этой цели мы будем использовать веб-воркеры. Веб-воркеры способны запускать скрипты в фоне, не влияя на основной поток, что позволяет браузеру сохранять высокое качество пользовательского взаимодействия.
20+
21+
В Angular использование этой технологии не так распространено, но внедрить её довольно легко. Есть схематик, который вы можете найти [здесь](https://angular.io/guide/web-worker) чтобы начать.
22+
23+
## Пояснение
24+
25+
Это испытание направлено на создание плавной анимации за счет перемещения функции, выполняющей сложные вычисления, в веб-воркер.
26+
27+
Для начала, используя схематик, создайте веб-воркер и перенесите в него функцию, вызывающую проблемы. После этих шагов анимация должна стать плавной, а отображение процента выполнения — обновляться, тем самым значительно улучшив пользовательский опыт.
28+
29+
:::note[Пояснение]
30+
Поскольку мы находимся в рабочем пространстве Nx, просто замените команду `ng` на `nx` при запуске схематика.
31+
32+
Если `nx` не установлен глобально на вашем компьютере, добавьте префикс `npx` к вашей команде.
33+
:::

docs/src/content/i18n/ru.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@
1616
"challenge.footer.video": "Видео",
1717
"challenge.footer.gettingStarted.title": "Чтобы пройти это испытание, прочитайте:",
1818
"challenge.footer.gettingStarted.link": "Первые шаги",
19-
"challenge.footer.upvoteAnswer": "Вы можете проголосовать за этот ответ 👍 если он вам понравился",
19+
"challenge.footer.upvoteAnswer": "Вы можете проголосовать за ответ 👍 если он вам понравился",
2020
"subscription.button": "Подписаться",
2121
"subscription.email": "username@gmail.com",
2222
"subscription.note.title": "Примечание",

0 commit comments

Comments
 (0)