You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
The React ↔ Cytoscape.js wrapper in the graph layer is a shallow module today: a ~50-prop interface fanned out across ~14 imperative hooks, coordinated by a home-grown structure-version counter, with the raw Cytoscape instance leaking out through a context ref so callers drive it directly. The interface is nearly as complex as the implementation, the core Cytoscape-touching logic is untested, and rendering rebuilds the entire element set on every change.
The goal is to turn this into a deep module — a small declarative interface over a substantial, well-tested implementation — that first and foremost serves the Graph View and Schema View, is significantly more performant at scale (50k+ elements), and has the potential to be reused in other products.
High-Level Plan
Four deepening candidates were identified in an architecture review. They compose: the reconciler is the deep engine that a small interface can later sit on top of.
B — Reconciler engine (first, in progress). Replace the full-replace + structure-version counter with a pure diff → thin apply reconciler over referentially-stable canvas elements. Directly delivers the performance goal and produces the internals the other candidates build on. Tracked in the child Epic below.
A — Shrink the interface. Collapse the ~50-prop surface into a small declarative interface (elements, stylesheet, layout, selection, handlers), keeping the internal hooks as private seams.
C — Move the seam. Replace the magic data-attribute handshake (__isGroupNode, __iconUrl) and domain imports in the generic layer with a typed element contract, so a second consumer only has to satisfy a clean interface.
D — Seal the raw-Cytoscape escape hatch. Replace the leaked raw instance with a small typed command handle (zoom, fit, center, screenshot, run layout).
A/C/D are not yet planned in detail — a scoping spike (child below) will investigate them before they become their own Epics.
Related Issues
Important
Internal only — this issue is maintained by the core team and is not accepting external contributions.
Description
The React ↔ Cytoscape.js wrapper in the graph layer is a shallow module today: a ~50-prop interface fanned out across ~14 imperative hooks, coordinated by a home-grown structure-version counter, with the raw Cytoscape instance leaking out through a context ref so callers drive it directly. The interface is nearly as complex as the implementation, the core Cytoscape-touching logic is untested, and rendering rebuilds the entire element set on every change.
The goal is to turn this into a deep module — a small declarative interface over a substantial, well-tested implementation — that first and foremost serves the Graph View and Schema View, is significantly more performant at scale (50k+ elements), and has the potential to be reused in other products.
High-Level Plan
Four deepening candidates were identified in an architecture review. They compose: the reconciler is the deep engine that a small interface can later sit on top of.
__isGroupNode,__iconUrl) and domain imports in the generic layer with a typed element contract, so a second consumer only has to satisfy a clean interface.A/C/D are not yet planned in detail — a scoping spike (child below) will investigate them before they become their own Epics.
Related Issues
Important
Internal only — this issue is maintained by the core team and is not accepting external contributions.