Regrouper les notifications de mesure en un seul rendu

Chaque noeud remonte sa taille reelle apres rendu. Sur une carte de 120 noeuds,
appliquer un reglage a toute la selection declenchait autant d'increments de
`sizeVersion` que de noeuds redimensionnes, donc autant de rendus successifs.

Les increments sont desormais regroupes dans une microtache : un seul rendu par
lot. Mesure sur 121 noeuds, onglet en arriere-plan (donc pessimiste) :
application d'un padding a toute la selection de ~730 ms a ~500 ms.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-09 17:36:06 +02:00
parent af6fd519c5
commit bf83292e65

View File

@@ -202,6 +202,9 @@ function cloneSubtrees(
}
export const useEditorStore = create<EditorState>((set, get) => {
/** Regroupe les notifications de mesure d'un meme lot en un seul rendu. */
let sizeBumpScheduled = false;
/**
* Applique une transformation sur la carte.
* `history: false` regroupe les micro-modifications (glisser-deposer) pour
@@ -1004,9 +1007,19 @@ export const useEditorStore = create<EditorState>((set, get) => {
if (known && known.width === size.width && known.height === size.height) return;
state.measuredSizes.set(id, size);
// React Flow a besoin des dimensions sur les noeuds controles (minimap,
// cadrage). On ne redessine que lorsqu'une taille a reellement change.
set({ sizeVersion: state.sizeVersion + 1 });
/*
* React Flow a besoin des dimensions sur les noeuds controles (minimap,
* cadrage, redimensionnement). On ne redessine que lorsqu'une taille a
* reellement change, et une seule fois par lot : sans cela, appliquer un
* reglage a cent noeuds declencherait cent rendus successifs.
*/
if (sizeBumpScheduled) return;
sizeBumpScheduled = true;
queueMicrotask(() => {
sizeBumpScheduled = false;
set({ sizeVersion: get().sizeVersion + 1 });
});
},
};
});