gaearon / gaearon/react-hot-loader

Removing sibling element causes remount

Open
#755 2 comments 0 reactions 0 assignees View on GitHub
discussion
Dominant language
JavaScript
Stars
12.2k
Forks
775
PR merge metrics
No merged PRs in 30d

Description

Having 3 elements:
- A
- B
- C

Removing of C does not cause remount of A and B.
Removing of B causes remount of C.
Removing of A causes remount of B and C.

This is actually native React behaviour - https://github.com/gaearon/react-hot-loader/issues/546#issuecomment-354128121

### Expected behaviour:
Changes done of server side shall not remount still existing components on frontend.
Changes done on clientside shall follow default behaviour.

### Current behaviour:
Changes done regardless of origin do follow the default behaviour.

### How:
- We can add `key` to the all elements without `key`(in autoWrap).
- Key could be calculated as `typename`(proxykey) + counter(+hash from props) .
- Key shall be calculated on hydrate stage.
- In runtime we should compare rendered children with a `hydrated` ones (in autoWrap) - if types does not match - drop the generated keys. The new ones will be calculated on next hot-replace.

#### Pros:
This is actually the behaviour users expect

### Cons:
We continue to deeply hack React.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.