> For the complete documentation index, see [llms.txt](https://docs.rowsncolumns.app/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.rowsncolumns.app/configuration/features/cell-format-registry.md).

# Cell format Registry

Cell format registry lets you store formats in a central place and reference each format on the cell via a short ID (`sid`) instead of inlining the full format object. This typically gives \~70% compression on cell data.

```tsx
// Before cellXfs registry
// Cell data A1:

{
  uf: {
    backgroundColor: "green",
    horizontalAlignment: "left"
  },
  ue: {
    sv: "Cell with styleId",
  },
  fv: "Cell with styleId",
  note: "Hello world, this is notes.",
},

// After cellXfs registry — `uf` becomes a StyleReference
{
  uf: {
    sid: "123",
  },
  ue: {
    sv: "Cell with styleId",
  },
  fv: "Cell with styleId",
  note: "Hello world, this is notes.",
},
```

{% hint style="info" %}
Only `uf` is written. The effective format is no longer persisted on `CellData` — the renderer derives it on the fly from `uf` (via the registry lookup), the cell value, and (for formula cells) precedent formats.
{% endhint %}

### Usage

```tsx
const App = () => {
  const [cellXfs, onChangeCellXfs] = useState<CellXfs | null | undefined>(
    new Map()
  );
  
  // With useSpreadsheetstate
  const { getEffectiveFormat } = useSpreadsheetState({
     cellXfs,
     onChangeCellXfs
  })
  
  // With yjs
  const { } = useYSpreadsheetV2({
     onChangeCellXfs
  })
  
  return (
      <CanvasGrid getEffectiveFormat={getEffectiveFormat} />
  )
  
}
```