Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Enable hot module replacement for React via react-hot-loader #5841

Merged
merged 8 commits into from
Sep 10, 2018

Conversation

kristw
Copy link
Contributor

@kristw kristw commented Sep 7, 2018

What were changed?

  • Install react-hot-loader and configure it to work with babel
  • Original index.jsx are renamed to App.jsx and exported as hot module.
  • New index.jsx are thin shells that calls ReactDOM.render to render <App />

Why?

Hot module replacement for react will enable us to develop the UI faster because when we make changes, the page keeps UI state and only replace the UI code affected by the change instead of reloading the entire page.

For example, you open an SQL editor, look up a few schema, switch tabs. When you modify code for one button and save, everything stays the same. Only the button will be changed.

Reference

Installed based on instruction here
https://github.com/gaearon/react-hot-loader

From the instruction page

Note: You can safely install react-hot-loader as a regular dependency instead of a dev dependency as it automatically ensures it is not executed in production and the footprint is minimal.

@williaster @graceguo-supercat @xtinec @conglei

@kristw kristw changed the title Enable hot module replace for react with react-hot-loader Enable hot module replacement for React via react-hot-loader Sep 7, 2018
@codecov-io
Copy link

codecov-io commented Sep 7, 2018

Codecov Report

Merging #5841 into master will decrease coverage by 0.09%.
The diff coverage is 12.05%.

Impacted file tree graph

@@            Coverage Diff            @@
##           master    #5841     +/-   ##
=========================================
- Coverage   63.73%   63.64%   -0.1%     
=========================================
  Files         368      374      +6     
  Lines       23219    23252     +33     
  Branches     2600     2600             
=========================================
  Hits        14799    14799             
- Misses       8405     8438     +33     
  Partials       15       15
Impacted Files Coverage Δ
...ets/src/visualizations/PairedTTest/PairedTTest.jsx 0% <ø> (ø) ⬆️
superset/assets/src/welcome/index.jsx 0% <ø> (ø) ⬆️
superset/assets/src/dashboard/index.jsx 0% <0%> (ø) ⬆️
superset/assets/src/addSlice/index.jsx 0% <0%> (ø) ⬆️
superset/assets/src/profile/App.jsx 0% <0%> (ø)
superset/assets/src/dashboard/App.jsx 0% <0%> (ø)
superset/assets/src/explore/App.jsx 0% <0%> (ø)
superset/assets/src/addSlice/App.jsx 0% <0%> (ø)
superset/assets/src/SqlLab/App.jsx 0% <0%> (ø)
superset/assets/src/welcome/App.jsx 0% <0%> (-94.45%) ⬇️
... and 10 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 3f8b970...6a1fe8c. Read the comment docs.

Copy link
Contributor

@williaster williaster left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!!!

thanks for making the dev env better for everyone 🙏

@kristw
Copy link
Contributor Author

kristw commented Sep 10, 2018

Thank you! This one is ready to merge.

@williaster williaster merged commit 6d57372 into apache:master Sep 10, 2018
@xtinec
Copy link
Contributor

xtinec commented Sep 10, 2018

LGTM. Well done!

@kristw kristw deleted the kristw-react-hot branch September 11, 2018 05:20
betodealmeida pushed a commit to lyft/incubator-superset that referenced this pull request Oct 12, 2018
…5841)

* Install react-hot-loader

* enable react-hot-reload for Explore, Dashboard, Profile and Sqllab

* enable hmr for welcome page

* enable hmr for welcome page

* enable react hot module replacement for addSlice

* fix lint

* fix Welcome test

* remove eslint comment
wenchma pushed a commit to wenchma/incubator-superset that referenced this pull request Nov 16, 2018
…5841)

* Install react-hot-loader

* enable react-hot-reload for Explore, Dashboard, Profile and Sqllab

* enable hmr for welcome page

* enable hmr for welcome page

* enable react hot module replacement for addSlice

* fix lint

* fix Welcome test

* remove eslint comment
@mistercrunch mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 0.28.0 labels Feb 27, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 0.28.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants