Skip to content

Question about redraw performances impact on field value update with massive object array. #5057

Open
@rMonell

Description

@rMonell

Hello,

I'm working on a project using vee-validate in combination with a data table component (AG Grid). We're using useField to validate the selection model of the table. While testing a large dataset (around 50,000 items per page), we noticed a significant redraw performance hit when updating the field value.

The performance issue only seems to occur when the field value is an array of objects (using a selection of primitive values does not lead to noticeable performance degradation),

This raised a few questions for me:

  • Is this performance cost expected when using useField with large arrays?
  • Are we using vee-validate correctly for such a use case?
  • Could this be considered a performance bottleneck within vee-validate itself?

To illustrate the issue, I’ve created a minimal reproduction here:
🔗 https://stackblitz.com/edit/vee-validate-issue-template-75gvnu2f?file=src%2FApp.vue,src%2Fcomponents%2FHeavyField.vue

In this example, you can observe the slow UI response when the useField value is updated. This behavior does not occur when setting the value to a simpleref and printing it in the DOM.

Thanks in advance for your insights!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions