How does it not re-render <TextInput> in react-native without direct manipulation?

[Noitidart]

In the example on the homepage for react-native we see the way to use this lib in react-native is the code below. react-hook-form doesn't seem to be attaching a ref and doing direct manipulation https://reactnative.dev/docs/direct-manipulation#setnativeprops-to-clear-textinput-value (ie: textInputRef.current.setNativeProps({ text: '' })). So how is react-hook-form changing the value without causing re-renders?

import { TextInput } from 'react-native';

function Input({ control, name ) {
  const { field } = useController({ control, name, defaultValue: '' });

  return (
    <TextInput value={field.value} onChangeText={field.onChange} />
  )
}

function App() {
  const { control } = useForm();

  return (
    <Input name="firstName" control={control} />
  )
}

[bluebill1049]

for react native, you will need to use useController or Controller.

take a look at this section: https://react-hook-form.com/get-started#ReactNative there is expo snack there as well.

[bluebill1049]

oh we isolated the re-render without the Controller/useController so it doesn't impact your form/app.

[Noitidart]

Ohh! That's very interesting. I just verified that by putting a counter into the TextInput component. I will try creating a prototype of a direct manipulation based technique and ask you how it looks. Thanks for your kind and patience working with everyone's questions.

[bluebill1049]

Welcome.

[Noitidart]

I just wrote it so the textinput does not ever render either! :)

I had to make onChange and onBlur stable though, is this a sound assumption I made? That it's safe to make it stable - #5113

Here I add a counter and we see that with DirectHookedTextInput it never re-renders! I did the stable trick from the PR above, is this trick safe? https://snack.expo.io/@noitidart/react-hook-form-v7---controller - in this code here, the controller re-renders, but the render doesn't return anything new to commit. So it doesn't cause any react commit.

[Noitidart]

Here is a video, we see that with direct manipulation, the TextInput component never re-renders, the render counter stays at 1.

[Noitidart]

Answer to this question is in this comment - #5111 (reply in thread) thanks Bill!