archive-gh-me/yew
1
0
Fork 0
mirror of https://github.com/yewstack/yew.git synced 2025-12-08 21:26:25 +00:00
Code Issues Projects Releases Wiki Activity

Warn about mismatched DOM in SSR docs (#3377)

Browse Source 
Fixes: #2684
This commit is contained in:
Muhammad Hamza 2023-08-14 18:46:05 +05:00 committed by GitHub
parent 46bbb0cfe5
commit e59edde1d0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 9 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
website/docs/advanced-topics/server-side-rendering.md
View File

@ -147,6 +147,15 @@ one implementation, you may want to use a `PhantomComponent` to fill the
position of the extra component. position of the extra component.
::: :::
:::warning
The hydration can only succeed if the real DOM matches the expected DOM
after initial render of the SSR output (static HTML) by browser. If your HTML is
not spec-compliant, the hydration _may_ fail. Browsers may change the DOM structure
of the incorrect HTML, causing the actual DOM to be different from the expected DOM.
For example, [if you have a `<table>` without a `<tbody>`, the browser may add a `<tbody>` to the DOM](https://github.com/yewstack/yew/issues/2684)
:::
## Component Lifecycle during hydration ## Component Lifecycle during hydration
During Hydration, components schedule 2 consecutive renders after it is During Hydration, components schedule 2 consecutive renders after it is