Results 1 to 4 of 4

Thread: Ext.requires not working, long load times

  1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    4
    Vote Rating
    0
      0  

    Default Ext.requires not working, long load times

    I am evaluating use of Ext JS for an intranet application to run under ultidev Cassini.

    Using the 'getting started guide' I put the helloext application at localhost:5078/Helloext

    It seems that, if I add the Ext.require('Ext.container.Viewport'); to the example application it does not effect the load times. Looking at the developers tools under chrome, the entire framework still seems to be loading.

    I do not see the warning message regarding synchronously loading 'Ext.container.Viewport'.

    Is this down to the port number used in the request - the loader would need to use this port for loading?

    I think we are tied to using Cassini to make this an installable intranet application.

    Appreciate any help with this.

    Updated:

    This does not seem to be an issue with Cassini.

    If I include ext-all.js the page is delivered in about 2.5 seconds.
    If I use the start up example and use ext-debug.js and add Ext.require('Ext.container.Viewport');
    to the script, the page takes 12+ seconds to load with a lot of separate requests for what appears to be the entire framework.

    I'm clearly not understanding something?

  2. #2
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,381
    Answers
    3997
    Vote Rating
    1536
      0  

    Default

    When you use ext-debug.js and use Ext.requires (or the other ways of file dependancies) Ext.Loader will be loading the files as it is told to by the requires. This will extend load time as it has to download the file and eval it. So when using ext-debug.js versus using ext-all-debug.js yes, ext-debug.js during development will take longer. I say development because in production you should use the SDK Tools to build into a single JS file with only the classes you need.

    Ext.require(); will defer the execution of Ext.onReady (or Ext.application#launch) until all the files listed and their dependancies are loaded.

    It is normal to see 200/300 files being loaded in a developed application.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

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

  3. #3
    Sencha User
    Join Date
    Mar 2012
    Posts
    4
    Vote Rating
    0
      0  

    Default

    Thank you for this.

    I confess to not really understanding why so many files are downloaded as the Ext.require only asks for a "Ext.container.Viewport".

    At present the best approach seems to be to use
    ext-debug-all.js during development, and as you say, build a smaller js for production.

    Regards

  4. #4
    Sencha Premium User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    40,381
    Answers
    3997
    Vote Rating
    1536
      0  

    Default

    It is recommended during development to use ext-debug.js. If you don't then when you do the build you are not guaranteeing that you will have all your classes included in the build.

    Think about it. Ext.container.Viewport requires Ext.container.Container which requires Ext.Component which requires Ext.AbstractComponent. Now you have mixins and a slew of files needed like that.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    ________________
    Need any sort of Ext JS help? Modus Create is here to help!

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

Posting Permissions

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