gaearon / gaearon/react-hot-loader
hmr will refresh the entire component tree
- Dominant language
- JavaScript
- Stars
- 12.2k
- Forks
- 775
- PR merge metrics
- No merged PRs in 30d
Description
### Description
any change in the components no matter how deeply nested. hmr will refresh the entire component tree. it should only update the change which caused it.
```js
// indes.js
import './rhl-config'
import 'react-hot-loader/patch'
import React from 'react'
import ReactDOM from 'react-dom'
import App from './app'
ReactDOM.render(, document.getElementById('root'))
// app.js
import React, { PureComponent } from 'react'
import { hot } from 'react-hot-loader/root'
import B from './b'
class App extends PureComponent {
constructor(props) {
super(props)
console.log('App.constructor exec')
}
render() {
return (
App
)
}
}
export default hot(App)
// b.js
import React, { PureComponent } from 'react'
import C from './c'
class B extends PureComponent {
constructor(props) {
super(props)
console.log('B.constructor exec')
}
render() {
return (
B PureComponent
)
}
}
export default B
// c same as B
```
### Expected behavior
HMR should only update the piece of code which was changed. or view which was updated.
### Actual behavior
HMR refreshes entire component tree on every change made to any component in that tree. even if its a small change in one character in view. it refreshes the whole component tree.
client:55 [WDS] App updated. Recompiling...
reloadApp.js:19 [WDS] App hot update...
log.js:24 [HMR] Checking for updates on the server...
c.js:6 C.constructor exec
c.js:6 C.constructor exec
b.js:7 B.constructor exec
b.js:7 B.constructor exec
app.js:8 App.constructor exec
app.js:8 App.constructor exec
changes component C will trigger entire tree refresh. and it's double
i am not using code lazy spliting and other lib.
### Environment
React Hot Loader version:4.12.13
Run these commands in the project folder and fill in their results:
1. `node -v`:10.15.3
2. `npm -v`:6.4.1
Then, specify:
1. Operating system: windows 10
2. Browser and version:chrome77.0.3865.90
### Reproducible Demo
https://github.com/282159468/rhl-tree
Contributor guide
Assessment
This issue has not been assessed yet.