Apply suggestions from code review

Co-authored-by: Alina Listunova <[email protected]>

Author: undead404

src/content/learn/state-as-a-snapshot.md

@@ -1,10 +1,10 @@
 ---
-title: Стан як зняток
+title: Стан як снепшот
 ---
 
 <Intro>
 
-Змінні стану можуть нагадувати звичайні змінні JavaScript, які можна зчитати та змінити. Проте стан поводиться радше як зняток. Задання йому значення не змінює наявну змінну стану, а натомість запускає повторний рендер.
+Змінні стану можуть нагадувати звичайні змінні JavaScript, які можна зчитати та змінити. Проте стан поводиться радше як снепшот – окремий незмінний кадр. Задання йому значення не змінює наявну змінну стану, а натомість запускає повторний рендер.
 
 </Intro>
 
@@ -13,7 +13,7 @@ title: Стан як зняток
 * Як задання стану запускає повторні рендери
 * Коли та як оновлюється стан
 * Чому стан не оновлюється відразу після задання значення
-* Як обробники подій звертаються до "знятку" стану
+* Як обробники подій звертаються до "снепшоту" стану
 
 </YouWillLearn>
 
@@ -69,30 +69,30 @@ label, textarea { margin-bottom: 10px; display: block; }
 
 Погляньмо уважніше на взаємозв'язок між станом і рендерингом.
 
-## Рендеринг бере один зняток за раз {/*rendering-takes-a-snapshot-in-time*/}
+## Кожен рендер отримує новий снепшот {/*rendering-takes-a-snapshot-in-time*/}
 
-["Рендеринг"](/learn/render-and-commit#step-2-react-renders-your-components) означає, що React викликає ваш компонент, який є функцією. JSX, який ви повертаєте з цієї функції, — це як зняток UI в певну мить часу. Його пропси, обробники подій і локальні змінні обчислюються **з використанням його стану в мить рендеру.**
+["Рендеринг"](/learn/render-and-commit#step-2-react-renders-your-components) означає, що React викликає ваш компонент, який є функцією. JSX, який ви повертаєте з цієї функції, — це як кадр UI в певну мить часу. Його пропси, обробники подій і локальні змінні обчислюються **з використанням його стану в мить рендеру.**
 
-На відміну від світлини чи кадру кінострічки, "зняток" UI, який ви повертаєте, є інтерактивним. Він вміщає логіку штибу обробників подій, які задають, що відбувається внаслідок введення з боку користувача. React оновлює екран до відповідності цьому знятку, й приєднує обробники подій. Як наслідок, натискання кнопки запускає обробник клацання, заданий у вашому JSX.
+На відміну від світлини чи кадру кінострічки повернений "снепшот" UI інтерактивний. Він вміщає логіку штибу обробників подій, які визначають дії внаслідок введення користувачем. React оновлює екран до відповідності цьому снепшоту й приєднує обробники подій. Як наслідок, натискання кнопки запускає обробник клацання, заданий у вашому JSX.
 
 Коли React виконує повторний рендер компонента, відбувається наступне:
 
 1. React знову викликає вашу функцію.
-2. Ваша функція повертає новий зняток JSX.
-3. React потім оновлює екран до відповідності знятку, поверненого вашою функцією.
+2. Ваша функція повертає новий снепшот JSX.
+3. React потім оновлює екран до відповідності снепшоту, поверненого вашою функцією.
 
 <IllustrationBlock sequential>
     <Illustration caption="React виконує функцію" src="/images/docs/illustrations/i_render1.png" />
-    <Illustration caption="Обчислюється зняток" src="/images/docs/illustrations/i_render2.png" />
+    <Illustration caption="Обчислюється снепшот" src="/images/docs/illustrations/i_render2.png" />
     <Illustration caption="Оновлюється дерево DOM" src="/images/docs/illustrations/i_render3.png" />
 </IllustrationBlock>
 
-Стан, пам'ять компонента, не схожий на звичайну змінну, що зникає, коли відбувається повернення з функції. Стан фактично "живе" в самому React — неначе на поличці! — поза вашою функцією. Коли React викликає ваш компонент, він надає вам зняток стану для конкретного поточного рендеру. Ваш компонент повертає зняток UI зі свіжим набором пропсів і обробників подій у своєму JSX, що обчислюється **з використанням значень стану, взятих з цього рендеру!**
+Стан, пам'ять компонента, не схожий на звичайну змінну, що зникає, коли відбувається повернення з функції. Стан фактично "живе" в самому React — неначе на поличці! — поза вашою функцією. Коли React викликає ваш компонент, він надає вам снепшот стану для конкретного поточного рендеру. Ваш компонент повертає снепшот UI зі свіжим набором пропсів і обробників подій у своєму JSX, обчисленим **із використанням значень стану, взятих із цього рендеру!**
 
 <IllustrationBlock sequential>
   <Illustration caption="Ви кажете React оновити стан" src="/images/docs/illustrations/i_state-snapshot1.png" />
   <Illustration caption="React оновлює значення стану" src="/images/docs/illustrations/i_state-snapshot2.png" />
-  <Illustration caption="React передає зняток значення стану до компонента" src="/images/docs/illustrations/i_state-snapshot3.png" />
+  <Illustration caption="React передає снепшот значення стану до компонента" src="/images/docs/illustrations/i_state-snapshot3.png" />
 </IllustrationBlock>
 
 Ось невеликий експеримент для демонстрації того, як це працює. У цьому прикладі можна очікувати, що клацання кнопки "+3" збільшить лічильник тричі, тому що це викликає `setNumber(number + 1)` тричі.
@@ -241,7 +241,7 @@ h1 { display: inline-block; margin: 10px; width: 30px; text-align: center; }
 
 </Sandpack>
 
-Здивовані? Якщо скористалися методом заміни, то бачите, який "зняток" стану був переданий до повідомлення.
+Здивовані? Якщо скористалися методом заміни, то бачите, який саме "снепшот" стану був переданий до повідомлення.
 
 ```js
 setNumber(0 + 5);
@@ -250,9 +250,9 @@ setTimeout(() => {
 }, 3000);
 ```
 
-Стан, що зберігається в React, може змінитися на час виведення повідомлення, але він був запланований з використанням знятку стану, актуального тоді, коли користувач повзаємодіяв з елементом!
+Стан, що зберігається в React, може змінитися на час виведення повідомлення, але він був запланований з використанням снепшоту стану, актуального в момент взаємодії користувача з елементом!
 
-**Значення змінної стану ніколи не змінюється протягом одного рендеру,** навіть якщо код обробника події є асинхронним. Всередині `onClick` *поточного рендеру* значення `number` усе одно залишається `0`, навіть після виклику `setNumber(number + 5)`. Її значення "зафіксувалося", коли React "зробив зняток" UI, викликавши ваш компонент.
+**Значення змінної стану ніколи не змінюється протягом одного рендеру,** навіть якщо код обробника події є асинхронним. Всередині `onClick` *поточного рендеру* значення `number` усе одно залишається `0` навіть після виклику `setNumber(number + 5)`. Її значення "зафіксувалося", коли React "зробив снепшот" UI, викликавши ваш компонент.
 
 Ось приклад, як це захищає обробники подій від помилок хронометражу. Нижче — форма, що надсилає повідомлення з п'ятисекундною затримкою. Уявіть такий сценарій:
 
@@ -313,9 +313,9 @@ label, textarea { margin-bottom: 10px; display: block; }
 
 * Задання стану спричиняє прохання про новий рендер.
 * React зберігає стан поза вашим компонентом, неначе на поличці.
-* Коли викликається `useState`, React видає зняток стану *для конкретного поточного рендеру*.
+* Коли викликається `useState`, React віддає снепшот стану *для конкретного поточного рендеру*.
 * Змінні та обробники подій не "переживають" повторні рендери. Кожний рендер має власні обробники подій.
-* Кожний рендер (а також функції в ньому) завжди "бачить" зняток стану, який React видав *цьому конкретному* рендеру.
+* Кожний рендер (а також функції в ньому) завжди "бачить" снепшот стану, який React віддав *цьому конкретному* рендеру.
 * Можна уявно підставити стан в обробниках подій — подібного до того, як ми уявляємо JSX після рендеру.
 * Обробники подій, створені в минулому, мають значення стану з тих рендерів, у яких вони створені.