UX DataTables

Type to search columns, filters, options, and extensions.

↑↓ to navigate · Enter to open · Esc to close

Documentation

Scroller Extension

Virtualized rendering for large datasets

When To Use

Use Scroller when table size is large enough to impact browser rendering performance.

Minimal Example

use Pentiminax\UX\DataTables\Model\Extensions\ScrollerExtension;

$dataTable
    ->addExtension(new ScrollerExtension())
    ->scrollY('480px');

Advanced Example

$dataTable
    ->addExtension(
        new ScrollerExtension(
            boundaryScale: 0.5,
            displayBuffer: 9,
            rowHeight: 'auto',
            serverWait: 200,
        )
    )
    ->scrollY('480px');

rowHeight accepts a pixel integer or 'auto' to measure it from the rendered rows. serverWait is the minimum milliseconds Scroller waits between Ajax requests while scrolling quickly.

Frequent Pitfalls

  • Using Scroller without vertical scroll (scrollY).
  • Expecting server-side mode behavior without enabling serverSide(true).