Remove unnecessary re-renders / page refresh

[Falsal]

In certain cases like when using the search bar/button the page re-renders a few times, making unnecessary calls to the backend.
Normally, in development there are 2 re-renders (React 18) but this case goes beyond that and actually making an additional call.

If you slow the speed of Network , you can better follow the unwanted re-renders.

The goal of this issue is, to remove all unnecessary re-renders and reloads.

Installation:

1. nvm install 20.5.0
2. nvm use 20.5.0
3. npm install

Running the application:

1. npm run start-remote-api
2. http://localhost:3000/suche?city=wien

GitHub Branch:

• Please use this branch to work on: https://github.com/bahnzumberg/zuugle-suchseite/tree/unnecessary-reloads

[martinheppner]

The video shows the unnecessary reloads:

Unnecessary-Reloading.mp4

[Falsal]

we seem to have different behavior in the search functionality depending on the network speed.
So on slow 3G speed, upon clicking search and after a few renders the final-render is giving the correct cards on top of the list shown but below them other cards which should not be there. On fast networks we get the correct result list of cards after a few renders.

[Falsal]

@martinheppner :
Situation on Tuesday 21st May:
checked the updated version of branch "unnecessary-reloads", but the behaviour of the search functionality on results page (Main.js) remains the same as before. A video link is pasted here:
https://www.loom.com/share/9af0e0b96f3d43c694dc7d19ba20ba6f?sid=1bfb7ba3-fd37-43bd-8837-df29474460a0

[Falsal]

The job is completed except for one item that was a result of this work, FAL will do the fix and will close this issue as soon as it is done.

[Falsal]

issue is setting filter to localStorage value when re-opening filter form.

[Falsal]

done