Formik: Add dependencies prop to FastField

[nealfwilliams2]

🚀 Feature request

Current Behavior

Formik FastFields will block updates unless a change was made to the slice of Formik state that is related to that field.

Desired Behavior

Allow FastFields to specify additional slices of Formik state they depend on.

Suggested Solution

Add dependencies prop to FastField to specify other dependencies in the same form. In shouldComponentUpdate, check for changes to the other listed slices of Formik state.

Consider an example where we have a form with two fields, for job title and specialization. Upon selecting the job title, and the options for selecting a population are populated. The implementation
of this example would look something like this using the proposed dependencies prop.

<Form>
  <FastField name="job-title">...</FastField />
  <FastField name="job-specialization" dependencies={["job-title"]} /> 
</Form>

Who does this impact? Who is this for?

Keeping large forms performant is a difficult problem to solve. FastField can take us a large part of the way there, but it isn't usable in two scenarios:
a.) Form Field body depends on other formik values
b.) Form Field body depends on state external to formik

This change would effectively solve most common a.) scenarios because, in these cases, the dependency typically is consistent and known.

Describe alternatives you've considered

As far as I am aware, this is the only way to solve this problem at a library level. Without this feature, one must write a wrapper component, put it directly within the Field component, and implement the shouldComponentUpdate method there. This assumedly is less performant than the library solution because the Field render logic will still occur, but the difference may be negligible.

If there aren't any objections, and others agree this would be valuable, I would be happy to submit a PR adding this feature.

[MiguelMadero]

Any update on this? Sounds exactly like what we need!

[andrwo]

This is a really good idea. It will allow FastField to be used for those who knows what the external dependency of that field are. It should also be easy to implement since shouldComponentUpdate() gets both old and new props.

My comment is that there should be 2 dependency list, one is a fieldDependency (list of formik fields to monitor for values,touched,errors) and otherDependency (list of other props from elsewhere to shallow-compare).