Vue-formulate: Slow performance with large sets of data

[mrkwdwrd]

Describe the bug
Performance is slow when using checkbox input bound to a model with a large number of records.

To Reproduce
See CodePen below. I have set up a simple form with Vue Formulate inputs populated by an array of 500 records (and have also included native inputs for comparison). The inputs are bound to an array that stores the selected values.

The performance of the checkboxes individually is quite slow (there is a noticeable lag compared to the native inputs) and seems worse when using check/uncheck all. Vue developer tool shows around 1,500 events being emitted from FormulateInput and FormulateForm whenever the values are updated.

https://codepen.io/mrkwdwrd/pen/LYNGaEz

[justin-schroeder]

Not ideal at all. This is technically the same as #171 (checkboxes are technically groups internally) but has a different manifestation to end users so lets leave it open on here for now.

[justin-schroeder]

To help address this issue, 2.5.1 shipped a debouce prop that prevents these kinds of large data sets from being so problematic. To be clear it isn't perfect, but it's a big improvement. Here's the same form as above with a 50ms debounce

https://codepen.io/justin-schroeder/pen/wvojNwV

[anisite]

With a large form (e.g. >150 fields) we got very high lag while typing on text fields, we fixed it changing v-model into v-model.lazy in input text component.
All is working great now (we also removed debounce after that, it's incompatible)