Page 1 of 2 12 LastLast
Results 1 to 10 of 11

Thread: Optimize ExtJS Application

  1. #1
    Sencha User
    Join Date
    Sep 2010
    Posts
    83

    Default Optimize ExtJS Application

    Hi,

    I'm coding a web application with ExtJS 3.3.
    I'm on a web desktop (extjs demo) and when I open a window, the javascript is really slow.

    All panel in the window contain many component (Button, Combo, Grid...) who are initialized by JSON.

    How is possible to optimize the javascript to accelerate the loading component creation ?

    I have minify my javascript and optimize with the Ext.getCmp remove in my code.

    Do you know an other method to accelerate loading ?

    Thank

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379

    Default

    Not being able to see any code I would say this:

    Just because you minify code doesn't make it good code.
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  3. #3
    Sencha User
    Join Date
    Feb 2008
    Location
    USA
    Posts
    162

    Default

    You can do a lot of optimizations on the HTTP server sending the data. Enable gzip compression, setup proper caching so that the extjs framework files expire far into the future. Additionally using as much lazy loading (xtypes) as possible will allow you to use the most optimized rendering by only rendering components when they are needed.

    Be sure you are not using the debug files when you deploy (ie. ext-all-debug.js should change to ext-all.js when you deploy).
    JSJoy.com - my blog on the joy that is JavaScript!
    Ext Extension: Awesome Uploader - Drag n' Drop Awesome Uploading

  4. #4
    Sencha User
    Join Date
    Sep 2010
    Posts
    83

    Default

    Hi,
    thanks for your answer.

    I'm trying to convert my code to use xtype instead of initializing the components.
    But, I have an other problem.
    I don't know how to add listener for xtype component

    thanks in advance for your help

  5. #5
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379

    Default

    Code:
    {
        xtype: "panel",
        ...
        listeners: {
            afterrender: someFunction
        }
    }
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  6. #6
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default

    Code:
    ...
    {
       xtype: 'whatever',
       listeners: {
         render: function() {
           alert('render');
         },
         destroy: function() {
           alert('destroy');
         }
         ...
       }
    },
    ...

  7. #7
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,379

    Default

    Quote Originally Posted by mschwartz View Post
    Code:
    ...
    {
       xtype: 'whatever',
       listeners: {
         render: function() {
           alert('render');
         },
         destroy: function() {
           alert('destroy');
         }
         ...
       }
    },
    ...
    I win!
    Mitchell Simoens @LikelyMitch

    Check out my GitHub:
    https://github.com/mitchellsimoens

    Posts are my own, not any current, past or future employer's.

  8. #8
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default

    Quote Originally Posted by mitchellsimoens View Post
    I win!
    You certainly do!

  9. #9
    Sencha User
    Join Date
    Sep 2010
    Posts
    83

    Default

    Thanks

    It's perfect !


    If you have any idea to accelerate the javascript execution...

  10. #10
    Sencha User mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,061

    Default

    Get a faster computer?

    Get a faster internet connection?

    Seriously, you're not giving us much to go on.

    Firebug and chrome dev tools have all the features you need to figure out what network transactions are taking a long time.

Page 1 of 2 12 LastLast

Similar Threads

  1. Optimize ExtJS / JavaScript
    By same66 in forum Ext 3.x: Help & Discussion
    Replies: 3
    Last Post: 9 Feb 2011, 2:05 AM
  2. Replies: 3
    Last Post: 20 May 2009, 1:16 PM
  3. Optimize ExtJS for IE 6
    By lionheart33806 in forum Ext 2.x: Help & Discussion
    Replies: 18
    Last Post: 3 Apr 2009, 5:17 AM
  4. [Solved] How can I optimize loading of my ExtJS Appliction ?
    By ritesh.kapse in forum Ext 2.x: Help & Discussion
    Replies: 6
    Last Post: 22 Dec 2008, 8:42 PM
  5. How can optimize the extjs?
    By Capi666 in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 25 Mar 2008, 2:47 AM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •