How to prevent memory crash on auto refresh in vue?

Question

Vue.js

There was a task to automatically update the list of orders on the page. I used the most banal solution using setInterval, but soon after opening the page, chrome starts swearing that there will be a memory crash right now (Paused before potential out of memory crash)

data () {
  return {
    interval: null,
  }
},
methods: {
  refreshData () {
    console.log('Заказы обновлены')
    Vue.http.get('orders').then(response => {
      this.orders = response.body
    }
  },
},
created: function () {
  this.interval = setInterval(this.refreshData, 3000)
},
beforeDestroy () {
  clearInterval(this.interval)
}

Tell me where to dig, what to do? First time I encountered this.

Answer 1

Dig towards web sockets
If you still want to make requests, then send a request that the data is updated, for this, create a simple path and answer yes / no, or send a timestamp of the last request when requesting and receive only new positions, increase the time between requests, Three seconds is wildly common.
I also don't see orders in your data. This may cause additional errors
. It also all depends on the amount of information you receive, maybe you just ran out of memory on your device.