# Data snapshot

Snapshots retain rowData at a point in time for comparison with current data or another snapshot. They differ from view-state APIs that save column widths, filters, and focus.

Canonical: https://grid.syidax.com/docs/features/snapshots/

<a id="understand"></a>

## How it works and when to use it

Use them to create a baseline before bulk edits and compare additions, changes, and removals afterward. Retention is limited; snapshots are not persistent server backups after leaving the page.

In the code, grid is the Grid element prepared in the installation chapter. Check each example's data and settings, and implement the app functions and server endpoints for your project.

- [Installation and integration · Shared sample data](https://grid.syidax.com/docs/guides/getting-started.md)

<a id="example-1"></a>

## Example 1. Create a baseline before editing

Save a named snapshot before starting a bulk operation.

```javascript
grid.maxSnapshots = 10;
const before = await grid.captureSnapshot('Before quantity adjustment');
console.log(before);
```

Verify the result: An ID is returned for later comparison or restoration.

<a id="example-2"></a>

## Example 2. Compare with current data

Inspect changes after editing from the baseline.

```javascript
console.log(await grid.diffSnapshots(before));
```

Verify the result: Omitting the second ID compares against current data. Pass a second snapshot ID to compare two saved points.

<a id="example-3"></a>

## Example 3. Restore and clean up

Check the actual result when the user chooses to restore.

```javascript
const restored = await grid.restoreSnapshot(before);
console.log(restored, await grid.listSnapshots());
```

Verify the result: Restoration changes current data values. Remove unnecessary baselines with deleteSnapshot(id). Perform a separate save if server changes must also be reversed.

<a id="pitfalls"></a>

## Combining features and troubleshooting

Keep row IDs stable to compare additions, modifications, and removals meaningfully.

Snapshot restoration does not restore column layout or filters. Use getState()/setState() for view configuration.

<a id="related-api"></a>

## APIs used by this feature

- [maxSnapshots](https://grid.syidax.com/docs/options/maxSnapshots.md) — Maximum data snapshots retained in memory. Older snapshots may be removed.
- [captureSnapshot](https://grid.syidax.com/docs/methods/captureSnapshot.md) — Creates a named snapshot of current source data and returns its ID. Separate from saving column layouts.
- [listSnapshots](https://grid.syidax.com/docs/methods/listSnapshots.md) — Reads metadata for retained data snapshots.
- [deleteSnapshot](https://grid.syidax.com/docs/methods/deleteSnapshot.md) — Deletes a data snapshot and returns success without changing current data.
- [diffSnapshots](https://grid.syidax.com/docs/methods/diffSnapshots.md) — Compares two snapshots or a snapshot with current data. Omit the second ID to compare against current data.
- [restoreSnapshot](https://grid.syidax.com/docs/methods/restoreSnapshot.md) — Restores source data from a snapshot. Does not automatically save to the server or restore view state.
- [snapshotCaptured](https://grid.syidax.com/docs/events/snapshotCaptured.md) — Emitted when a data snapshot is created. Display the saved point using its ID, name, and row count.
- [snapshotRestored](https://grid.syidax.com/docs/events/snapshotRestored.md) — Emitted when snapshot restoration completes. Does not indicate completed server saving.

<a id="next"></a>

## Related reading

- [How rows, columns, and IDs relate](https://grid.syidax.com/docs/guides/concepts.md)
- [Connect results and events](https://grid.syidax.com/docs/guides/data-event-access.md)
- [Explore in Features](https://grid.syidax.com/grid/snapshots) — The guide describes which interactions are available to try.