I am interested in analyzing the content of an <input> field when there is no activity from the user.
One simple example I have considered is counting the number of characters, but the actual analysis process is very resource-intensive. To optimize this, I would prefer to break it into batches and only perform the analysis during periods of user inactivity rather than for every change of the bound variable.
The code snippet for a straightforward analysis could be as follows:
var app = new Vue({
el: '#root',
data: {
message: ''
},
computed: {
// a computed getter
len: function() {
// `this` references the vm instance
return this.message.length
}
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.6/vue.js"></script>
<div id="root>
<input v-model="message">Length: <span>{{len}}</span>
</div>My issue is that the function() gets called every time the message changes. Is there a way to implement throttling or what is a common approach to addressing such problems in JavaScript?