diff --git a/src/features/grid/components/grid-client.tsx b/src/features/grid/components/grid-client.tsx index 0bab401..b4290ae 100644 --- a/src/features/grid/components/grid-client.tsx +++ b/src/features/grid/components/grid-client.tsx @@ -55,9 +55,11 @@ export function GridClient({ initialRows, nomFournisseur, fournisseurs, magasins useEffect(() => { if (!isMounted) return; - // Deep clone to avoid mutating the React prop directly across re-renders - const rowsCopy = JSON.parse(JSON.stringify(initialRows)); - const scoredRows = computeProductScores(rowsCopy, { seuilAxeFort, bonusParAxe }); + + // Optimisation : On évite le JSON.parse(JSON.stringify()) qui est très lourd sur 1000 lignes + // On passe directement les initialRows au moteur de score, ou on fait une copie superficielle si nécessaire. + // Le moteur de score doit idéalement retourner de nouveaux objets. + const scoredRows = computeProductScores([...initialRows], { seuilAxeFort, bonusParAxe }); setRows(scoredRows); }, [initialRows, setRows, seuilAxeFort, bonusParAxe, isMounted]); diff --git a/src/features/grid/components/heatmap-cell.tsx b/src/features/grid/components/heatmap-cell.tsx index 7b9f7f3..69a99e2 100644 --- a/src/features/grid/components/heatmap-cell.tsx +++ b/src/features/grid/components/heatmap-cell.tsx @@ -1,4 +1,4 @@ -"use client"; +import React from "react"; interface HeatmapCellProps { value: number | null; @@ -13,7 +13,7 @@ function getHeatmapClass(value: number | null): string { return "heatmap-zero"; } -export function HeatmapCell({ value }: HeatmapCellProps) { +export const HeatmapCell = React.memo(({ value }: HeatmapCellProps) => { const heatClass = getHeatmapClass(value); const display = value === null || value === 0 ? "—" : Math.round(Math.abs(value)).toString(); @@ -25,4 +25,6 @@ export function HeatmapCell({ value }: HeatmapCellProps) { {display} ); -} +}); + +HeatmapCell.displayName = "HeatmapCell";