Gelmiş geçmiş en büyük porno sitemiz olan 2pe de her zaman en kaliteli pornoları sunmayı hedefledik. Diğer video sitemiz olan vuam da ise hd porno ağırlıklı çalışmalara başladık.

  1. #1
    Ext JS Premium Member SimonFlack's Avatar
    Join Date
    Jul 2010
    Location
    Norway
    Posts
    241
    Vote Rating
    3
    SimonFlack is on a distinguished road

      0  

    Default Greatly reduce the size of the DOM

    Greatly reduce the size of the DOM


    Hey Guys

    Its late (02:15) here and I am playing around with a big Sencha Touch 2 app (Huge DOM) and I have come up with a concept that greatly reduced the size of my DOM.

    The contents of my "main" deck now only contain stuff that the user is looking at. Everything seems to be working as usual. Like I said "its late".

    Try it out and see what you think. I am going to sleep now. ;-)

    I will test performance on my iPhone in the morning. (App is packaged in Cordova/PhoneGap)

    Code:
    Ext.define('godtur.view.SmartContainer',{
        extend: 'Ext.Container',
        xtype: 'smartcontainer',
        config: {
            layout: 'fit',
            listeners: {
                show: function(cmp){
                    if(!cmp.items.items[0] && cmp.v){
                        cmp.add(cmp.v);
                        cmp.v.show();
                    }else{
                        cmp.items.items[0].show();
                    }
                },
                hide: function(cmp){
                    var v = cmp.items.items[0];
                    if(v){
                        cmp.v = v;
                        cmp.v.hide();
                        cmp.removeAll(false,false);
                    }
                }
            }
        }
    });
    
    
    Ext.define("godtur.view.Main", {
        extend: 'Ext.Container',
        xtype: 'main',
        config: {
            id: 'mainDeck',
            layout: {
                type: 'card',
                animation: {type: 'fade'}
            },
            items: [{
                //xtype: 'home'
                xtype: 'smartcontainer',
                items: [{xtype: 'home'}]
            },{
                //xtype: 'info'
                xtype: 'smartcontainer',
                items: [{xtype: 'info'}]
            },{
                //xtype: 'mapcontrols'
                xtype: 'smartcontainer',
                items: [{xtype: 'mapcontrols'}]
            },{
                //xtype: 'mypagedeck'
                xtype: 'smartcontainer',
                items: [{xtype: 'mypagedeck'}]
            },{
                //xtype: 'searchdeck'
                xtype: 'smartcontainer',
                items: [{xtype: 'searchdeck'}]
            }]
        }
    });
    DOM.jpg
    Simon Flack
    CEO and UX Designer
    WhiteFox AS, Norway

    Web: www.whitefox.no

    Facebook: www.facebook.com/WhiteFoxAS

    Twitter: @WhiteFoxAS

  2. #2
    Ext JS Premium Member SimonFlack's Avatar
    Join Date
    Jul 2010
    Location
    Norway
    Posts
    241
    Vote Rating
    3
    SimonFlack is on a distinguished road

      0  

    Default


    I compiled xcode project and tested on my iPhone 4 this morning. It does seem to run faster.

    App seems to be running correctly also.

    But I will need to do more testing to be 100% certain.
    Simon Flack
    CEO and UX Designer
    WhiteFox AS, Norway

    Web: www.whitefox.no

    Facebook: www.facebook.com/WhiteFoxAS

    Twitter: @WhiteFoxAS

  3. #3
    Sencha User
    Join Date
    Apr 2012
    Posts
    103
    Vote Rating
    10
    pepperseb is on a distinguished road

      0  

    Default


    Is it different from this great plugin?
    https://github.com/mitchellsimoens/Ux.tab.OptimizedTab


  4. #4
    Ext JS Premium Member SimonFlack's Avatar
    Join Date
    Jul 2010
    Location
    Norway
    Posts
    241
    Vote Rating
    3
    SimonFlack is on a distinguished road

      0  

    Default


    Quote Originally Posted by pepperseb View Post
    Is it different from this great plugin?
    https://github.com/mitchellsimoens/Ux.tab.OptimizedTab

    Looks like pretty much the same idea. Just work on different events.
    Simon Flack
    CEO and UX Designer
    WhiteFox AS, Norway

    Web: www.whitefox.no

    Facebook: www.facebook.com/WhiteFoxAS

    Twitter: @WhiteFoxAS

  5. #5
    Sencha User
    Join Date
    Aug 2011
    Location
    London
    Posts
    392
    Vote Rating
    16
    digeridoopoo will become famous soon enough

      0  

    Default Thanks...

    Thanks...


    Thanks a lot for this Simon, would it be possible to see a really basic example in a tabpanel setup this way?

    I am really interested in reducing the DOM size and have tried Mitchell's optimised tab but I am getting blank panels and I can't work out why. Would be great if someone could post an example to help the community :-)

    Thanks

  6. #6
    Ext JS Premium Member SimonFlack's Avatar
    Join Date
    Jul 2010
    Location
    Norway
    Posts
    241
    Vote Rating
    3
    SimonFlack is on a distinguished road

      0  

    Default


    If you are using a tabpanel try Mitch's plugin.

    https://github.com/mitchellsimoens/Ux.tab.OptimizedTab
    Simon Flack
    CEO and UX Designer
    WhiteFox AS, Norway

    Web: www.whitefox.no

    Facebook: www.facebook.com/WhiteFoxAS

    Twitter: @WhiteFoxAS

  7. #7
    Sencha User
    Join Date
    Aug 2011
    Location
    London
    Posts
    392
    Vote Rating
    16
    digeridoopoo will become famous soon enough

      0  

    Default Tried that...

    Tried that...


    I've attached a tabpanel based on your smart container but I'm not sure if it is actually doing anything. Would this be the correct way of doing it or does it only work best for card containers?

    Here's the link:

    http://wtrns.fr/fUgdVl-b1bUBXMp

    I think I've managed to get Mitchell's tabpanel working with an xtype now after adding a height parameter. It was there but hidden!

    :-)

  8. #8
    Ext JS Premium Member SimonFlack's Avatar
    Join Date
    Jul 2010
    Location
    Norway
    Posts
    241
    Vote Rating
    3
    SimonFlack is on a distinguished road

      0  

    Default


    "The interesting thing is if I inspect the DOM it is there, but hidden."

    Hmm.. I had heaps of troubles with this when making my code too. Heights set to 0px.

    Have you checked your layout configs? Not missing any?

    Mitch will probably see this post and help you out soon. If not send me a message.

    "Anyway, I've attached a tabpanel based on your smart container but I'm not sure if it is actually doing anything."

    I will check it out asap. To check if its working use Chromes Developer Tools or Safaris Web Inspector. The tabs that are hidden should be empty.
    Simon Flack
    CEO and UX Designer
    WhiteFox AS, Norway

    Web: www.whitefox.no

    Facebook: www.facebook.com/WhiteFoxAS

    Twitter: @WhiteFoxAS

Thread Participants: 2