[DevTools Bug]: useSyncExternalStore adds 1 to subsequent hook's number in Profiler

This issue has been created since 2022-09-02.

Website or app

https://codesandbox.io/s/sweet-fast-huvy9e?file=/src/App.tsx

Repro steps

  1. Open the sandbox in Google Chrome. Notice that the App component in App.tsx calls useSyncExternalStore, followed by useState. Lastly, it has an effect that simply toggles the state value every second so that it's easy to profile state changes without interacting with the UI.
  2. Open the rendered page in a new window and inspect it in Chrome DevTools.
  3. Open Components tab, select the App component, and notice that useState hook is #2. image
  4. Switch to Profiler tab and profile the page for a couple of seconds.
  5. Notice that "Why did this render?" section says "Hook 3 changed". The number should be 2. image

How often does this bug happen?

Every time

DevTools package (automated)

No response

DevTools version (automated)

No response

Error message (automated)

No response

Error call stack (automated)

No response

Error component stack (automated)

No response

GitHub query string (automated)

No response

lunaruan wrote this answer on 2022-09-15

Hey! Thanks for reporting this issue! useExternalStore is in fact a hook (like useState and useEffect), so in your case, useState should be hook 2 (and not hook 1). I'm closing this, but feel free to reopen if I am misunderstanding something!

AlexTalis wrote this answer on 2022-09-15

Hi, I understand that useExternalStore is a hook and I agree that useState is hook #2. I never said it should be #1. But the profiler (2nd image) says that the component rerendered because "Hook 3 changed". That is the bug. The component changed because useState changed, so the profiler should says "Hook 2 changed".

AlexTalis wrote this answer on 2022-09-15

@lunaruan, Can you reopen this issue please? I don't have access to do it. Hopefully my previous comment explains the problem better.

lunaruan wrote this answer on 2022-09-15

Ah thanks for the explanation! I'll take a closer look in a bit

More Details About Repo
Owner Name facebook
Repo Name react
Full Name facebook/react
Language JavaScript
Created Date 2013-05-24
Updated Date 2022-09-27
Star Count 195296
Watcher Count 6655
Fork Count 40431
Issue Count 1113

YOU MAY BE INTERESTED

Issue Title Created Date Comment Count Updated Date
[Bug] Styled components unmount/mount every render 1 2022-06-01 2022-07-23
Can't share path between projects. 2 2019-01-03 2022-05-16
Docker events, init error 7 2020-05-14 2022-07-23
(windows)connect remote docker server over ssh is failed 4 2019-01-13 2022-07-20
Docker Event:Init Error 3 2018-09-07 2022-07-23
v7: Proposal: Incorporate counter into "subsecond time", explicit layouts for "subsecond time" field width 10 2022-02-07 2022-09-17
Quantum-mechanical TRNG or CSPRNG is a must 2 2022-02-06 2022-09-17
Author contribution for peace 3 2022-03-24 2022-09-07
Follow alphabetical order in enums and in their corresponding `match` statements all over the compiler 0 2022-05-26 2022-09-13
About score of the similarity 1 2021-05-28 2022-08-20
Deprecation warning: value provided is not in a recognized RFC2822 or ISO format. 1 2020-05-18 2022-09-18
Haxball internal logic still runs at 60hz? 2 2021-11-14 2022-09-20
Question: Is there an example of Client.patch/4 available? 8 2022-07-07 2022-08-25
Please add documentation to the readme about importing __ENV file in the index.html 1 2021-07-02 2022-09-18
config.plist 2 2021-03-06 2021-12-23
Update React Query to version 4 1 2022-09-08 2022-09-16
Update Prisma to version 4 0 2022-09-13 2022-09-16
Update React to version 18, plus a few other React libs 0 2022-09-13 2022-09-16
Unable to deploy to Heroku due to `sodium-native` bug 0 2022-09-08 2022-09-16
INSTALL_FAILED_NO_MATCHING_ABIS 2 2021-09-02 2022-08-23
socket.io.js.map not found 4 2021-02-16 2022-09-16
Add a saver based on Kaleido 3 2020-12-18 2022-09-10
Add Windows support for ZeroConf 0 2021-12-03 2022-09-09
Push notifications for iOS work in Pusher, but not in PushTry or with PushSharp 4 2021-02-04 2022-09-19
Support 'tanzu login' to vSphere with Tanzu Supervisor 0 2022-06-15 2022-09-17
script execution freezes for ~ 20 min on 2nd start 9 2021-10-27 2022-09-23
Support for map[string]string 11 2021-04-18 2022-08-21
golangci-lint SA1019 doesn't make ioutil.ReadFile as an exception 1 2022-08-04 2022-08-23
RedundantCast error missing in ternary 4 2022-03-02 2022-09-18
TLS performance vs. nginx for WebSocket server 2 2021-05-08 2022-09-19
Feature Request - Show list only after user input 1 2021-03-31 2022-07-28
nxp1052 串口bsp驱动,如果应用程序对某个串口重新配置波特率等参数,该串口无法接收数据,需将中断重新使能 3 2022-06-27 2022-09-13
Allow for Markdown links to use frontmatter variable substitution for hyperlinks 1 2022-06-24 2022-08-30
back gesture for react native 1 2022-05-06 2022-09-14
Register in the General registry? 7 2021-01-21 2022-08-20
Issue with "MDN Web Docs Glossary: Definitions of Web-related …": (description about where has listed the `glossary terms` dose not match the facts) 0 2022-03-20 2022-03-15
translate this book into chinese 2 2021-07-17 2022-09-02
user-controller didn't sync user from host cluser to work cluster 1 2021-12-08 2022-08-30
[Event Parameter Change] Codeunit 80 "Sales-Post" - procedure CheckSalesDocument - Event OnCheckSalesDocumentOnAfterCalcShouldCheckItemCharge 1 2022-07-26 2022-08-04
[Event Parameter Change] Codeunit 80 "Sales-Post" - trigger OnRun - Event OnBeforePostSalesLines 1 2022-07-26 2022-09-16
Write data cleaning scripts 1 2018-09-18 2022-05-17
Partition according to the block size of HDFS 1 2017-04-25 2022-09-16
Animated count always starts from 0 3 2021-10-03 2022-09-19
[CUSTOMER REQUEST] Training time and viability wrt hardware specs 1 2022-07-19 2022-07-28
SQL Bindings vscode extension sends the wrong extension name in telemetry 0 2022-06-07 2022-06-09
DX::ReadData - paths issue ? 1 2022-01-24 2022-09-13
[bug report] The date component is invalid on partial full screen! 7 2021-08-18 2022-09-22
windows: data gets "clogged" in extra pipes opened when forking with `child_process` 3 2022-07-21 2022-09-19
Ensure fast gas fees for swap transactions 2 2021-11-11 2022-08-28
Using `--search-path` should append to default search path, not overwrite it 5 2021-08-26 2022-09-26