frontend: introduces propsAreEqual function passed to React.memo to reduce re-rendering

This function accepts the component’s previous props, and its new props.
It should return true if the old and new props are equal: that is, if the component will
render the same output and behave in the same way with the new props as with the old.
I need to use this function as state objects that are passed as props will always have different references.

frontend/src/components/SliderComponent.tsx

@@ -6,6 +6,7 @@ import { NumberComponent, NumberObject } from "./NumberComponent";
 import { LevelName } from "./NotificationsComponent";
 import { SerializedObject } from "../types/SerializedObject";
 import { QuantityMap } from "../types/QuantityMap";
+import { propsAreEqual } from "../utils/propsAreEqual";
 import { useRenderCount } from "../hooks/useRenderCount";
 
 interface SliderComponentProps {
@@ -244,6 +245,6 @@ export const SliderComponent = React.memo((props: SliderComponentProps) => {
       </Collapse>
     </div>
   );
-});
+}, propsAreEqual);
 
 SliderComponent.displayName = "SliderComponent";