Ext version tested: Browser versions tested against: DOCTYPE tested against: Description:

  • Buffered rendering always gets disabled, for some reason. In beforeRender event, bufferedRenderer flag is still set to true, but in afterRender it gets toggled to false.


Steps to reproduce the problem: run example and check console

Code:



var items = [];
for(var i = 0;i<175;i++) {
    items.push({ 'name': 'Lisa',  "email":"lisa@simpsons.com",  "phone":"555-111-1224"  });
}


Ext.create('Ext.data.Store', {
    storeId:'simpsonsStore',
    fields:['name', 'email', 'phone'],
    data:{'items':items},
    proxy: {
        type: 'memory',
        reader: {
            type: 'json',
            rootProperty: 'items'
        }
    }
});


var table = {
    title: 'Simpsons',
    xtype: 'gridpanel',
    // height: 123,
    store: Ext.data.StoreManager.lookup('simpsonsStore'),
    columns: [
        { text: 'Name',  dataIndex: 'name' },
        { text: 'Email', dataIndex: 'email', flex: 1 },
        { text: 'Phone', dataIndex: 'phone' }
    ],
    listeners: {
        beforeRender: function(me) {
            console.log('beforeRender bufferedRenderer: ' + me.bufferedRenderer);
        },
        afterRender: function(me) {
            console.log('afterRender bufferedRenderer: ' + me.bufferedRenderer);
        }
    }
};




Ext.create('Ext.container.Viewport', {
    border: true,
    title: 'a Viewport',
    layout: 'fit',
    items: [table]
});

The result that was expected:

  • buffered renderer should be enabled


The result that occurs instead:

  • buffered renderer gets disabled for some reason


Workaround: setting table height to arbitrary value.