What's New in AG Grid 31.1

Kiril Matev -

AG Grid 31.1 is an important minor version - it integrates the AG Charts enterprise-grade charting and adds key improvements to user experience, UI customization, accessibility and performance:

1. Introducing Integrated Enterprise Charts
2. Column Menu Redesign
3. Custom Column/Context Menu Item Components
4. Compressed Exported Excel File
5. Client-side Sorting in Server-side Row Model

Please note that AG Grid 31.1 has no breaking changes from AG Grid 31. We're providing Codemods to help you upgrade by automating the migration process as much as possible. Please review the migration guide when planning to update to this version.

Introducing Integrated Enterprise Charts

The Enterprise Bundle, AG Grid Enterprise and AG Charts Enterprise, introduces advanced charting capabilities directly within AG Grid. This integration includes all enterprise charting features, including a variety of new capabilities - series types, animations, and zoom, etc. enhancing the grid's visualisation and interactivity.

0:00
/0:09

See "Installing Integrated Charts" for more details.

Column Menu Redesign

AG Grid 31.1 includes a redesigned column menu which uses a flat layout to deliver a modern and uncluttered experience. It separates filters and the column chooser from the column menu and allows the user to open the column menu using a right-click on the column header. This simplifies the grid column menu UI and makes it easier to use.

See this documented here and demonstrated below:

0:00
/0:19

Custom Column/Context Menu Item Components

AG Grid 31.1 allows developers to display custom menu item components in the column and context menus. This allows you to completely customize the appearance and behavior of menu items and more closely implement your requirements.

See this documented here and demonstrated below:

0:00
/0:04

Compressed Exported Excel File

AG Grid 31.1 compresses files by default when exporting to Excel. This important change helps generate significantly smaller files than before and allows users to share the exported files more easily.

Client-side Sorting in Server-side Row Model

AG Grid now supports client-side sorting when using the server-side row model. Client-side sorting allows to avoid making a server request for the sorted data when all the data at a particular level is loaded by the grid. This is especially helpful when using row grouping as only a small number of groups are expanded at any one point and allows to deliver a more responsive user experience and reduce the server load.

See this documented here and demonstrated below:

0:00
/0:09

Figma Design System Updates

AG Grid 31.1 release adds the Quartz theme to the Figma Design System. It also allows you to better customize your AG Grid themes as listed below:

  • Dark / light mode switcher
  • Density switcher
  • Token studio design tokens included (json)

These new capabilities can help better implement your design vision and deliver themes which are more user-friendly and visually appealing.

Summary

AG Grid 31.1 is a key minor version - it integrates an enterprise-grade charting experience along with improvements to user experience, UI customization, accessibility and performance.

We suggest reviewing the migration guide when planning to upgrade and seeing the full list of changes in our Changelog.

As always, we’re keen to help you upgrade and to hear your feedback.

Happy coding!