Для чего нужен «реагировать-горячий-загрузчик/бабель»?

Я настроил react-hot-reload на основе начало работы в npm. Первым шагом было добавление

// .babelrc
{
  "plugins": ["react-hot-loader/babel"]
}

У меня есть однокомпонентное приложение с состоянием счетчика и кнопкой, которая увеличивает счетчик состояний. При тестировании кажется, что он работает и сохраняет свое состояние с/без этого плагина в моем .babelrc, когда я добавляю/удаляю случайные компоненты в моем методе render().

Итак, мой вопрос: для чего предназначена эта часть головоломки? почему это требуется?

Приложение, которое я использую для проверки,

import { hot } from 'react-hot-loader/root';
import React from 'react';

class App extends React.Component {
    constructor(props) {
      super(props);
      this.state = {value:0};
    }

    handleButtonClick(event)
    {
        console.log("click");
        this.setState( state => ({
            value:state.value + 44

        }));
    }

    render() {
      return (
        <div>
            <div>
            <a>asd</a>
            <p>asssd</p>
        <input></input>
          <button onClick={this.handleButtonClick.bind(this)}></button>
            2<div>{this.state.value}</div>
            </div>
        </div>
      );
    }
  }

export default hot(App);