What are the conceptual differences between live reloading, hot reloading, and hot module replacement?
Asked Answered
I

1

27

I've seen a lot of posts and publications about live reloading, hot reloading, and hot module replacement, referring to different practices to reflect changes in code immediately in the browser when working in the web client/FE layer.

I have a fair understanding of what are these terms referring to, my only question is if these concepts are properly defined somewhere and which are the specific differences between them.

Imprecise answered 30/11, 2016 at 13:34 Comment(0)
F
32

So I just came across the same question today and thought it's good to share my findings:

  • Live Reload
    Triggers an app wide reload that listens to file changes
  • Hot Module Replacement
    Is the same as Live Reload with the difference that it only replaces the modules that have been modified, hence the word Replacement. The advantage of this is that it doesn't lose your app state e.g. your inputs on your form fields, your currently selected tab etc. Here's a full-blown explanation from another SO answer.

Lastly, Hot Reloading is just short for Hot Module Replacement.

Here's a explanatory video which you can look at and differentiate LR from HMR.

Flatulent answered 29/1, 2017 at 3:20 Comment(1)
The video is private! :(Diaphanous

© 2022 - 2024 — McMap. All rights reserved.