If you need to write a complex table with server-side pagination, sorting, and filtering — what would you choose?

To implement a complex table with server-side pagination, sorting, and filtering, I would choose a library that supports server operations well and easily integrates with React or another framework.

Popular options:

• React Table — a lightweight and flexible library that does not implement UI itself but is excellent for server-side logic. It allows managing pagination, sorting, and filtering on the server by simply passing parameters.

• Ant Design Table — a ready-made component with a rich UI and support for server-side pagination and filtering via props. Convenient if you need a quick start and a beautiful interface.

• Material-UI DataGrid — a component supporting server-side processing, well-suited for projects using Material Design.

In general:

• The client-side table sends parameters of the current page, sorting, and filters to the server.
• The server returns only the required data slice.

Example of using React Table with server-side pagination:

import { useTable, usePagination, useSortBy } from 'react-table';

function ServerSideTable({ columns, fetchData, pageCount }) {
  const {
    getTableProps,
    getTableBodyProps,
    headerGroups,
    prepareRow,
    page,
    canPreviousPage,
    canNextPage,
    pageOptions,
    state: { pageIndex, pageSize, sortBy },
    gotoPage,
    setPageSize,
  } = useTable(
    {
      columns,
      manualPagination: true,
      manualSortBy: true,
      pageCount,
      initialState: { pageIndex: 0 },
    },
    useSortBy,
    usePagination
  );

  React.useEffect(() => {
    fetchData({ pageIndex, pageSize, sortBy });
  }, [pageIndex, pageSize, sortBy]);

  // render table and pagination controls
}

Thus, the choice depends on UI requirements and ease of integration, but React Table is an excellent choice for custom solutions with server-side logic.