From 783b2f348ac2d7ff6bd90fd11eb5d2086977d318 Mon Sep 17 00:00:00 2001 From: Jakub Piasecki Date: Mon, 24 Jun 2024 14:30:10 +0200 Subject: [PATCH 1/3] Add remark about reading SV from the js thread --- packages/docs-reanimated/docs/core/useSharedValue.mdx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/docs-reanimated/docs/core/useSharedValue.mdx b/packages/docs-reanimated/docs/core/useSharedValue.mdx index 70d2b7ec82d7..b0bc9873a052 100644 --- a/packages/docs-reanimated/docs/core/useSharedValue.mdx +++ b/packages/docs-reanimated/docs/core/useSharedValue.mdx @@ -67,6 +67,8 @@ import SharedValueSrc from '!!raw-loader!@site/src/examples/SharedValue'; - When you change the `sv.value` Reanimated will update the styles and keep the shared value in sync between the threads. However, this won't trigger a typical React re-render because a shared value is a plain JavaScript object. +- When you read the `sv.value` on the [JavaScrupt thread](/docs/fundamentals/glossary#javascript-thread), the thread will get blocked until the value is fetched from the [UI thread](/docs/fundamentals/glossary#ui-thread). In most cases it will be negligible, but if you are running a lot of animations or reading a value multiple times the wait time needed to synchronize both threads may significantly grow. + - When you change the `sv.value` the update will happen synchronously on the [UI thread](/docs/fundamentals/glossary#ui-thread). On the other hand, on the [JavaScript thread](/docs/fundamentals/glossary#javascript-thread) the update is asynchronous. This means when you try to immediately log the `value` after the change it will log the previously stored value. From 116205489a4b2eba32a87b8f60b8c821937741f9 Mon Sep 17 00:00:00 2001 From: Jakub Piasecki Date: Mon, 24 Jun 2024 14:36:01 +0200 Subject: [PATCH 2/3] It's better now --- packages/docs-reanimated/docs/core/useSharedValue.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/docs-reanimated/docs/core/useSharedValue.mdx b/packages/docs-reanimated/docs/core/useSharedValue.mdx index b0bc9873a052..d014b2fa11be 100644 --- a/packages/docs-reanimated/docs/core/useSharedValue.mdx +++ b/packages/docs-reanimated/docs/core/useSharedValue.mdx @@ -67,7 +67,7 @@ import SharedValueSrc from '!!raw-loader!@site/src/examples/SharedValue'; - When you change the `sv.value` Reanimated will update the styles and keep the shared value in sync between the threads. However, this won't trigger a typical React re-render because a shared value is a plain JavaScript object. -- When you read the `sv.value` on the [JavaScrupt thread](/docs/fundamentals/glossary#javascript-thread), the thread will get blocked until the value is fetched from the [UI thread](/docs/fundamentals/glossary#ui-thread). In most cases it will be negligible, but if you are running a lot of animations or reading a value multiple times the wait time needed to synchronize both threads may significantly grow. +- When you read the `sv.value` on the [JavaScript thread](/docs/fundamentals/glossary#javascript-thread), the thread will get blocked until the value is fetched from the [UI thread](/docs/fundamentals/glossary#ui-thread). In most cases it will be negligible, but if you are running a lot of animations or reading a value multiple times, the wait time needed to synchronize both threads may significantly increase. - When you change the `sv.value` the update will happen synchronously on the [UI thread](/docs/fundamentals/glossary#ui-thread). On the other hand, on the [JavaScript thread](/docs/fundamentals/glossary#javascript-thread) the update is asynchronous. This means when you try to immediately log the `value` after the change it will log the previously stored value. From 6c9a899320fc0ef0a9f718966f04424ce0897bb4 Mon Sep 17 00:00:00 2001 From: Jakub Piasecki Date: Mon, 24 Jun 2024 16:16:38 +0200 Subject: [PATCH 3/3] Update --- packages/docs-reanimated/docs/core/useSharedValue.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/docs-reanimated/docs/core/useSharedValue.mdx b/packages/docs-reanimated/docs/core/useSharedValue.mdx index d014b2fa11be..f3c5e3969f01 100644 --- a/packages/docs-reanimated/docs/core/useSharedValue.mdx +++ b/packages/docs-reanimated/docs/core/useSharedValue.mdx @@ -67,7 +67,7 @@ import SharedValueSrc from '!!raw-loader!@site/src/examples/SharedValue'; - When you change the `sv.value` Reanimated will update the styles and keep the shared value in sync between the threads. However, this won't trigger a typical React re-render because a shared value is a plain JavaScript object. -- When you read the `sv.value` on the [JavaScript thread](/docs/fundamentals/glossary#javascript-thread), the thread will get blocked until the value is fetched from the [UI thread](/docs/fundamentals/glossary#ui-thread). In most cases it will be negligible, but if you are running a lot of animations or reading a value multiple times, the wait time needed to synchronize both threads may significantly increase. +- When you read the `sv.value` on the [JavaScript thread](/docs/fundamentals/glossary#javascript-thread), the thread will get blocked until the value is fetched from the [UI thread](/docs/fundamentals/glossary#ui-thread). In most cases it will be negligible, but if the UI thread is busy or you are reading a value multiple times, the wait time needed to synchronize both threads may significantly increase. - When you change the `sv.value` the update will happen synchronously on the [UI thread](/docs/fundamentals/glossary#ui-thread). On the other hand, on the [JavaScript thread](/docs/fundamentals/glossary#javascript-thread) the update is asynchronous. This means when you try to immediately log the `value` after the change it will log the previously stored value.