diff --git a/src/components/grid/cell/cell.tsx b/src/components/grid/cell/cell.tsx index 8448f422..8531dd17 100644 --- a/src/components/grid/cell/cell.tsx +++ b/src/components/grid/cell/cell.tsx @@ -54,7 +54,7 @@ export const areEqual = (prevProps: CellProps, nextProps: CellProps): boolean => ); }; -export const CellComponent: FunctionComponent = ({ coords, children, ...restProps }) => { +export const CellComponent: FunctionComponent = React.memo(({ coords, children, ...restProps }) => { const [mouseDown, onMouseDown, onMouseUp] = useMouseDown(); const onClick = () => restProps.onClick(coords); @@ -82,7 +82,7 @@ export const CellComponent: FunctionComponent = ({ coords, children, }; return ; -}; +}, areEqual); export const ComponentsMap: FunctionComponent = ({ children, ...rest }) => { const nonActiveCellProps: RevealedProps = { diff --git a/src/modules/GameWithHooks/GameWithHooks.tsx b/src/modules/GameWithHooks/GameWithHooks.tsx index e83294b4..6f37404c 100644 --- a/src/modules/GameWithHooks/GameWithHooks.tsx +++ b/src/modules/GameWithHooks/GameWithHooks.tsx @@ -6,7 +6,7 @@ import { Top } from "@components/top-section"; import { openCell } from "@helpers/cells/cells-manipulator"; import { CellState, Coordinates, Field, fieldGenerator, generateFieldWithDefaultState } from "@helpers/field"; import { GameLevels, GameSettings, LevelNames } from "@modules/GameSettings"; -import React, { FunctionComponent, useState } from "react"; +import React, { FunctionComponent, useMemo, useState } from "react"; export const GameWithHooks: FunctionComponent = () => { const [level, setLevel] = useState("beginner"); @@ -14,7 +14,7 @@ export const GameWithHooks: FunctionComponent = () => { const [playerField, setPlayerField] = useState(generateFieldWithDefaultState(size, CellState.hidden)); - const gameField = fieldGenerator(size, bombs / (size * size)); + const gameField = useMemo(() => fieldGenerator(size, bombs / (size * size)), [size, bombs]); const onClickHandler = (coords: Coordinates) => { const newPlayerField = openCell(coords, playerField, gameField);