Vue && Vuex

HTML

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vuex"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<div id="app">
   <div>
      <div> Click on "Register" button to dynamically register ModuleB 100 times</div>
       <div> Click on "Un-Register" button to dynamically un-register ModuleB 100 times</div>
       <div>
      <button @click="registerModule">Register</button><span style="padding-right: 20px;"></span><button @click="unregisterModule">Un-Register</button>
      </div>
     </div>
      <br/>
      <div>Memory leak is happening on Store._vm since the oldVm is not getting garbage collected.</div>
      <br/>
      <div>Vuex Version : vuex v3.1.0</div>
      <div>
        <pre>
       <code>
    <b> Method - resetStoreVM()</b>
   
      // Existing Code
      <b>Vue.nextTick(function () { return oldVm.$destroy(); });</b>
       <br/>       
      // The OldVm Object is still in heap even after destory
      // Approporate Code
      <b>oldVm.$destroy(); 
      oldVm = null;
      </b>
      </code>
      </pre>
      </div>
      <br/>
      
   </div>
</div>

JavaScript 1.7

const moduleA = {
  namespaced: true,
  state: {
    ten: 10
  },
  getters: {
    getTwenty: state => {
      return state && state.ten + 10
    }
  }
}

const moduleB = {
  namespaced: true,
  state: {
    todos: [
      {id: 1, text: 'a', done: true},
      {id: 2, text: 'b', done: false},
      {id: 3, text: 'c', done: false},
      {id: 4, text: 'd', done: true},
      {id: 5, text: 'e', done: false},
      {id: 6, text: 'f', done: false},
      {id: 7, text: 'g', done: true}
    ]
  },
  getters: {
    doneTodos: state => {
      return state && state.todos.filter(todo => todo.done)
    }
  }
}


const store = new Vuex.Store({
  modules: {
    a: moduleA
  }
})

const app = new Vue({
  store,
  el: '#app',
  data() {
    return {}
  },
  mounted() {
  	window.$store = this.$store
    console.log(this.$store)
  },
  methods: {
    registerModule() {
      for (var i = 0; i < 100; i++) {
        this.$store.registerModule('b/' + i, moduleB)
      }
    },
    unregisterModule() {
      for (var i = 0; i < 100; i++) {
        this.$store.unregisterModule('b/' + i)
      }
    }
  }
})