Ext JS 4.1.2 (GA) Now Available - Support Only

[westy]

Now suspect something to do with either the ghost panel, or the fact it's animating.
Will try and find that example and mess about with it...

Edit: Yup, animating from the button does it.

Try this (have just added btn parameter to show call):

Ext.require([
    'Ext.grid.*',
    'Ext.window.Window',
    'Ext.container.Viewport',
    'Ext.layout.container.Border',
    'Ext.state.*',
    'Ext.data.*'
]);


Ext.define('Person', {
    extend: 'Ext.data.Model',
    fields: ['first', 'last', 'review', {
        name: 'age',
        type: 'int'
    }]
});


Ext.onReady(function(){


    // setup the state provider, all state information will be saved to a cookie
    Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));


    Ext.create('Ext.container.Viewport', {
        layout: {
            type: 'border',
            padding: '5'
        },
        items: [{
            region: 'north',
            styleHtmlContent: true,
            height: 150,
            bodyPadding: 5,
            split: true,
            html: [
                'Between refreshes, the grid below will remember',
                '<ul>',
                    '<li>The hidden state of the columns</li>',
                    '<li>The width of the columns</li>',
                    '<li>The order of the columns</li>',
                    '<li>The sort state of the grid</li>',
                '</ul>'
            ].join(''),
            dockedItems: [{
                xtype: 'toolbar',
                items: [{
                    text: 'Show window',
                    handler: function(btn){
                        Ext.create('Ext.window.Window', {
                            width: 300,
                            height: 300,
                            x: 5,
                            y: 5,
                            title: 'State Window',
                            maximizable: true,
                            stateId: 'stateWindowExample',
                            stateful: true,
                            styleHtmlContent: true,
                            bodyPadding: 5,
                            html: [
                                'Between refreshes, this window will remember:',
                                '<ul>',
                                    '<li>The width and height</li>',
                                    '<li>The x and y position</li>',
                                    '<li>The maximized and restore states</li>',
                                '</ul>'
                            ].join(''),
                            listeners: {
                                destroy: function(){
                                    btn.enable();
                                }
                            }
                        }).show(btn);
                        btn.disable();
                    }
                }]
            }]
        }, {
            bodyPadding: 5,
            region: 'west',
            title: 'Collapse/Width Panel',
            width: 200,
            stateId: 'statePanelExample',
            stateful: true,
            split: true,
            collapsible: true,
            html: [
                'Between refreshes, this panel will remember:',
                '<ul>',
                    '<li>The collapsed state</li>',
                    '<li>The width</li>',
                '</ul>'
            ].join('')
        }, {
            region: 'center',
            stateful: true,
            stateId: 'stateGridExample',
            xtype: 'grid',
            store: Ext.create('Ext.data.Store', {
                model: 'Person',
                data: [{
                    first: 'John',
                    last: 'Smith',
                    age: 32,
                    review: 'Solid performance, needs to comment code more!'
                }, {
                    first: 'Jane',
                    last: 'Brown',
                    age: 56,
                    review: 'Excellent worker, has written over 100000 lines of code in 3 months. Deserves promotion.'
                }, {
                    first: 'Kevin',
                    last: 'Jones',
                    age: 25,
                    review: 'Insists on using one letter variable names for everything, lots of bugs introduced.'
                }, {
                    first: 'Will',
                    last: 'Zhang',
                    age: 41,
                    review: 'Average. Works at the pace of a snail but always produces reliable results.'
                }, {
                    first: 'Sarah',
                    last: 'Carter',
                    age: 23,
                    review: 'Only a junior, but showing a lot of promise. Coded a Javascript parser in Assembler, very neat.'
                }]
            }),
            columns: [{
                text: 'First Name',
                dataIndex: 'first'
            }, {
                text: 'Last Name',
                dataIndex: 'last'
            }, {
                text: 'Age',
                dataIndex: 'age'
            }, {
                flex: 1,
                text: 'Review',
                dataIndex: 'review'
            }]
        }]
    });
});

[westy]

Turning on constrainHeader in the above example means can get the window back by resizing the viewport, again exactly as I'm seeing...

Edit: Another observation... if move the window the position is saved correctly.

[dongryphon]

Yup, animating from the button does it.

Try this (have just added btn parameter to show call):

Thanks for digging in!

Sounds like a bug - can you post your findings/example to the Bugs forum and we'll get it tracked?

[westy]

Thanks for digging in!

Sounds like a bug - can you post your findings/example to the Bugs forum and we'll get it tracked?

Posted here, thanks.

[westy]

Another point worth mentioning, I am seeing some very severe performance issues on one particular page in the application, where it seems that some of the Ext.Direct calls are taking a huge amount of time. Talking 2-9 secs...

Changing back to 4.1.0 makes the calls lightning quick again, i.e. 50-100ms, implying it's not server-side.
Not quite sure what's going on, and none of the other pages seem to have the issue.

Will try and keep digging, although I've probably already spent too long tinkering with it in truth... we cannot upgrade to 4.1.2 at this stage anyway, even if it was perfect.

Edit: Few things going on, but one of the issues is certainly the layout of a fieldset that uses a column layout; at least that's my guess at this stage.
No sure if the direct calls are taking a long time, or if they're being stalled by something else, but suspect the latter.

Edit2: Commented out a method and has made it much faster, so suspect it's something we're doing... the method in question calls getComponent a few times, so maybe that's got massively more expensive; will try and track it down.
Things should be getting faster, not significantly slower!

Edit3: Put an Ext.batchLayouts around the function body and changed it from taking 800ms to around 5ms! Implies that layout has got more expensive in places though.
Still, will push my change...

[dongryphon]

Glad to hear you have been able to resolve most of the issues and thanks for logging the bug your found!

If you have anything on what got slower, I'd love to hear about it...

[terrycursh]

As an open-source programmer，it is very upset to see this！

[alabs]

Hi,

May I check where can I find the update to 4.1.2? I will need to have the bug fix in this release for my chart.

Thanks.

[dongryphon]

Hi,

May I check where can I find the update to 4.1.2? I will need to have the bug fix in this release for my chart.

Thanks.

This release is available in the Sencha Support portal. Have you logged in to the portal before?

[alabs]

I have logged in and got the update package. Thanks!