You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Currently, if checksum mismatch happens when mounting React tree on server rendered markup, we can only get markup difference in dev environment. Reality is, mismatches happen more in production env, where there are much bigger variety of user contexts that can trigger the mismatch. It is very hard to reproduce the mismatch scenarios in dev environment, without knowing where the markup difference is.
What is the expected behavior?
What I'm proposing is to provide apps a way to obtain the markup difference even in production environment, so that the diffs can be reported back to developers for debugging mismatch root cause.
Fiber would probably change how checksum works. But before it is ready, we still need ability to debug this issue in production env.
provide a way for application to control which react tree to report markup diff upon checksum mismatch, as application might only care about mismatch in a subset of the React trees mounted and there would be concerns with markup normalization cost:
I am using a data attribute on container node, but it is not the best approach, since container can also be document node.
I thought about two alternative ways but neither of them is perfect:
add reportMarkupDiff option to ReactDom.render() signature
add a prop like reportMarkupDiff to the element being rendered
allow application to collect the markup diff even in production environment:
I'm setting the markup difference as the value of the same data attribute on the container node
Please share your thoughts and ideas. I am up for raising a PR to implement the most ideal approach. Thanks!
The text was updated successfully, but these errors were encountered:
lingyan
changed the title
Need ability to debug checksum mismatch in production environment
Feature Request: Need ability to debug checksum mismatch in production environment
Jun 21, 2017
React 16 won’t be using checksum validation at all so seems like this is moot. We will still show a diff, but it seems like doing that involves a lot of DEV code that we don’t want to ship to production users. So I’ll close this, but if you feel strongly after 16 is released, please let me know and we can take another look.
Do you want to request a feature or report a bug?
Feature
What is the current behavior?
Currently, if checksum mismatch happens when mounting React tree on server rendered markup, we can only get markup difference in dev environment. Reality is, mismatches happen more in production env, where there are much bigger variety of user contexts that can trigger the mismatch. It is very hard to reproduce the mismatch scenarios in dev environment, without knowing where the markup difference is.
What is the expected behavior?
What I'm proposing is to provide apps a way to obtain the markup difference even in production environment, so that the diffs can be reported back to developers for debugging mismatch root cause.
Fiber would probably change how checksum works. But before it is ready, we still need ability to debug this issue in production env.
I was trying something like this: lingyan/react@master...reportMarkupDiff It works but probably is not the best approach. The idea is simple though:
reportMarkupDiff
option toReactDom.render()
signaturereportMarkupDiff
to the element being renderedPlease share your thoughts and ideas. I am up for raising a PR to implement the most ideal approach. Thanks!
The text was updated successfully, but these errors were encountered: