How to work with arrays of data objects coming from the back?

Question

React

Let's say we go to the settings page (there are a lot of them).
1 setting contains the following information:

settings_one: {
  [
    'type' => 'setting_name_1',
    'switch' => true,
    'input' => 5,
    'other_input' => NULL,
    'text' => 'Описание настройки 1',
  ],
  [
    'type' => 'setting_name_2',
    'switch' => false,
    'input' => 3,
    'other_input' => NULL,
    'text' => 'Описание настройки 2',
  ],
  // ..........................
}

Now we get the following situation:

const [settings, setSettings] = useState(null);
  const memoizedGetSettings = useCallback(async () => {
    const response = await getSettings();
    setSettings(response.settings);
  }, []);

  useEffect(() => {
    memoizedGetSettings();
  }, [memoizedGetSettings]);

If I go to the page with the settings, then the data is loaded every time from the back, which is logical.
Is it possible to do something so that if I have not changed the data, the request for backing is not sent?

The project has a final-form, is it possible to get involved with pristine somehow?