How to make vuejs respond faster when using v-model on large data sets

When you are dealing with bunch of data It's always good idea to integrate the sort of pagination, but sometimes It's just not an option.

There is modifier called .lazy that lives on v-model directive.What it does is sync input with data model after change event.

Usage is pretty simple:

<input v-model.lazy="msg" >

Docs: https://v2.vuejs.org/v2/guide/forms.html#lazy

In reponse to Tarrakis, v-model.lazy isn't workign for you because you are using it on a custom component (a bootstrap form input component) and v-model.lazy doesn't work for custom components.

I have had a similar issue, and using v-model.lazy did not solve it. It performed a little bit better, but not as much as doing it manually.

So instead of:

<input v-model.lazy="msg">

I used:

<input :value="msg" @change="v => msg = v">

In theory it's pretty much the same, but in practice I found it much faster (at least using it on a <b-form-input> in Bootstrap-vue)