Проблема с компонентом скроллера и большим содержимым в Sencha Touch

Question

У меня есть приложение Sencha Touch с простой панелью.

var scrolling = new Ext.Application({
        launch : function () {

            var titlebar = {
                dock : 'top',
                xtype : 'toolbar',
                title : 'Scrolling Test'
            };

            new Ext.Panel({
                    fullscreen : true,
                    id : 'panel',
                    scroll : {
                        direction : 'vertical',
                        eventTarget : 'parent'
                    },
                    dockedItems : [titlebar],
                    styleHtmlContent : true,
                    html : ''
                });
        }
});

Эта панель заполняется ответом Ext.Ajax.request.

Ext.Ajax.request({
    url : 'largefile.html',
    success : function (response) {
        Ext.getCmp('panel').update(response.responseText);
    },
    failure : function (response) {}
});

В ответе содержится около 1,6 МБ текста. Да, это слишком много контента. Тем не менее, когда я пытаюсь запустить его в Ipad 1, после загрузки панели, эффект прокрутки не работает гладко. Он останавливается на 1 ~ 2 секунды, немного прокручивается, снова останавливается и затем завершается.

Я попытался измерить fps панели, используя

panel.scroller.getLastActualFps();

В браузере Chrome метод возвращает ~ 60 кадров в секунду. На iPad метод возвращает ~ 0,25 кадров в секунду.

Я думал о создании «облегченного» компонента скроллера, отключающего много событий и слушателей. Как вы думаете? Компонент Scroller на самом деле имеет эту проблему для большого контента?

Answer 1

У меня та же проблема, и я обнаружил, что интервал fps (кадров в секунду) по умолчанию равен 80! для iOS и это означает, что скроллер sencha запускает setInterval (someDecelerationAndBouncingFunction, 1000/80) 80 раз в секунду.

Я бы предложил попробовать вариант с меньшим количеством кадров в секунду. скажем 25

scroll : {
             direction : 'vertical',
             eventTarget : 'parent',
             fps : 25,
         },

в моем случае это решило проблему.

Кстати, та же проблема, что у меня была с iScroll и TouchScroll ...