question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Performance problem with Field or FieldArray during registration and unregistration fields

See original GitHub issue

Are you submitting a bug report or a feature request?

Bug

What is the current behavior?

Check the sandbox below and click on Initialize button and then on Reset. Slow registration and unregistration bigger amount of fields(500 rows with 3 columns = 1500 fields). I have used subscription only to ‘value’ and ‘submitting’. I haven’t provided any validation yet but keep in mind that it will be also included for the subscription. I have tried also Field instead of FieldArray. In the sandbox, it is included as a comment.

What is the expected behavior?

Better performance.

Sandbox Link

https://codesandbox.io/s/youthful-morning-msnpk https://msnpk.csb.app/

What’s your environment?

"final-form": "^4.18.5",
"final-form-arrays": "^3.0.1",
"react": "16.8.6",
"react-dom": "16.8.6",
"react-scripts": "3.0.1",
"react-final-form": "^6.3.0",
"react-final-form-arrays": "^3.1.1"

Other information

<Form debug={console.log}> During initialization produce lot of records image

I really love the final form. I have used redux-form, formik, react hook form and nothing is so powerful than your library. Just this performance makes me crazy. Thank you for help.

Issue Analytics

  • State:open
  • Created 4 years ago
  • Reactions:5
  • Comments:10 (1 by maintainers)

github_iconTop GitHub Comments

9reactions
nj314commented, Nov 14, 2019

This issue is a major blocker for my current project. Is anyone able to suggest a workaround? My project has up to ~200 fields on the page, and the unmounting time is critical.

7reactions
joni3kcommented, Jan 30, 2020

Any updates on this?

Read more comments on GitHub >

github_iconTop Results From Across the Web

useFieldArray - Simple React forms validation
Whether Field Array will be unregistered after unmount. keyName, string = id. Name of the attribute with autogenerated identifier to use as the...
Read more >
Performance trouble with FieldArray in react-final-form
I have performance troubles with my components of Array. Each component also contains for about 8 Fields (each of them contain validation rule) ......
Read more >
reduxForm(config:Object)
Whether or not to force unregistration of fields -- use in conjunction with ... retain the value of dirty fields and update every...
Read more >
Learn the most of react-hook-form in less than 5 minutes
# Need to know · # Register fields using register · # unregister · # Watch for changes and apply validation · #...
Read more >
@aaronuu/react-forms - npm
Each <Field /> is registered with it's closest form container on mount and by default is unregistered when unmounting (changed by the ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found