Проблема производительности сетки ExtJS 4.1.0

Question

Я использую сетку ExtJS с 50 столбцами и более 1000 записей. У меня проблемы с производительностью при прокрутке по вертикали / горизонтали и при редактировании ячеек. Можно ли получить плавную производительность без разбивки на страницы для такого размера данных или это единственное решение?

Answer 1

Вы должны использовать бесконечный сколлинг. Это позволяет вам отображать вашу таблицу с 1000 записями, в то время как они не создаются в DOM, поэтому они не замедляют работу вашего браузера.

Посмотрите на этот пример в документации.

Вам необходимо определить буферизованное хранилище и настроить параметры для бесконечной прокрутки, например:

Ext.define('Test.store.Owners', {
    extend: 'Ext.data.Store',
    model: 'Test.model.PersonalInfo',
    autoLoad: true,
    buffered: true,
    pageSize: 25,
    purgePageCount: 5,
    leadingBufferZone: 5,
    trailingBufferZone: 5,
});

Ваш бэкэнд должен поддерживать разбиение на страницы и возвращать объект json, включая totalа также offset свойства. Пример:

{"total":"1003",
"offset":225,
"data":[
    {"id":"227","name":"Candice","address":"P.O. Box 247, 7586 Eget Av.","state":"Minnesota"},
    {"id":"228","name":"Benedict","address":"P.O. Box 664, 7028 Vitae Rd.","state":"FL"},
    ...
}

Мой ответ для ExtJs 4.2.2, я не знаю, есть ли разница с версией 4.1.