Multiple Ext.Applications (Big Applications)

[bclinton]

This is working great for me so far, but I did encounter one issue. When the controller class from my sub-application is loaded, it looks for the stores and models in my main application's app path rather than in the application path of my sub-application. I get this error:

Uncaught Error: [Ext.Loader] Failed loading synchronously via XHR: 'app/store/Products.js'; please verify that the file exists. XHR status code: 404

If I specify the full class names of my models and stores in my sub-application's controller like this:

    stores: [
        'MYSUBAPP.store.Products'
    ],

and in my grids' configs like this:

store: 'MYSUBAPP.store.Products'

It seems to work, but I no longer have access to the get methods that are supposed to be automatically created, eg. getProductStore(). It creates them as getMYSUBAPPStoreProductsStore() which while unwieldy, makes sense. But I find it easier to use my_grid.getStore() anyway since I have refs set up for my views so I'm not too worried about this.

Is this working as designed, or should I not need to use full class names for my models and stores?

[james.shannon]

Has anyone managed to get this approach working with a Sencha Architect project?

I modified the sample Portal project from https://github.com/SenchaArchitect/Portal to use the MVCLoader controller, portlets, etc. and everything works fine until you use a portlet with a store.

When the master application tries to load a portlet with a store the following is logged to the console:

Uncaught TypeError: Cannot read property 'buffered' of undefined (ext-all-debug.js:94482)

...presumably because it can't resolve the underlying store. I've tried fully qualifying the store class references in the portlet's Main controller (as in the post above) and even tried overriding some of the architect-generated classes to match the ExtJS working portal/portlet sample, but something must be different with the Architect version that's causing this issue.

Any ideas? Has anyone got this working with Architect?!

Many thanks,

James

[savonac]

Same problem here.

[gilcachaca]

Hi Frederic,

The implementation of multiple applications using Extjs with MVC architecture is very interesting. I wonder if you can give us some information in a real application you have used this architecture. I would like some information as I am in the process of analysis to use ASP.NET MVC + Extjs as interfaces for my application. I have an ERP with 350 tables and 300 interfaces without counting the reports.

Doing a study. Today I was developing a new version of my application using Extjs and MVC architecture, which would use a solution like yours to be able to have each module its own APP. The problem is the number of models, views and controllers for the system. Thinking quickly we would have 350 controller, 350 views and 350 models.If it all together in the app-all.js will give about a 5mb

Using the solution of multiple MVC applications, can reduce the size of the file; since each module will have its own app, and still have the performance gain over the creation / destruction of each module on user interaction.

Can you give us more information?
How big is the largest application you have ever used this technique?
How many tables she has?
How many interfaces? Controllers? Views?
Which file size and app.js classes.js each app?
Have you had any problems related to performance during use of the system after some time because an interface is not changing?

Sorry for so many questions. I can not find more information on this subject in extjs forum. I see that you are the one who now works as a solution to this and that holds the knowledge of the advantages and disadvantages. In a crucial moment that I am, I need to take this decição because this new version will be increased gradually and can grow to be twice or more tables and interfaces. It really is a great application.


I can not make the decision to start developing it without having a deeper study of this process extjs MVC applications.

[rix]

Hi guys,

Fredric's portal solution is very impressive. I've been working a hybrid portal solution since about a year but it is based on ext 3 at the moment. It was the similar requirement that I claimed to be able hosting independently deployable applications in a portal shell. Its hybrid nature means it is conditionally uses the ext js library when complex user interaction requiring. Unless just a plain HTML presentation.
While ext3 had no dynamic class loading mechanism I'm simulating this feature with requirejs' module approach with successful.
Although ext4 has more sophisticated and complex solution handling it all together so I am going toward.

Fredric's solution covers all the needs what I must implement - bless his name - but I was experiencing a strange behavior of sync script loading. When any of portlet views was instantiating duplicated XHR requests will be injected. While stack trace shows nested requires in ext core and I'm using ext 4.1.1a I'm not sure is it whether an Ext4 issue currently or not. That seems to be sure why these files are can't debuggables under firebug.

Does anybody can confirm my experiences?

----
Finally made a patch so now breakpoints are working.
More info: http://www.sencha.com/forum/showthre...732#post904732

[Fredric Berling]

Sorry for the late reply guys.

I have been busy doing other stuff and its time for a code review and hopefully I will be able to solve any issues you have or at least answer them.

On the question of stores my first thing to look for is of the model actually are loaded in time of the store being instantiated. I know that in some cases (even in pure Ext) i have ended up putting the model in the requires:[] on the grid or store itself. Try that.

On the question of HOW big applications you can do with this i would say that there is no limit as long as you are letting the Ext.Loader load the sub-applications. Thats the whole point. Thats also goes for Ext not using the Multi MVC approach.

Did i miss any important question?

[vadimv]

is it possible to create an app-all.js for each portlet mvc app with sencha sdk command and then load each portlet as needed with ext.loader ???

I'm testing now and yes seems to work, with the new Sencha Cmd version (250). What I just implemented is a workspace with 2 apps: a main app which has viewport + Frederic's code + extjs lib, and one sub app which just shows a window with a grid. Sub app's code is minified with the comand:

sencha compile -classpath=app exclude -all and include -namespace SubAppNamespace and concat -yui minified.js

which concats and minifies only app's code without extjs's.
An example to load the script:

  // when using scriptElements, look at preserveScripts
   if (Ext.Loader.scriptElements['../../SubAppName/production/minified.js']) {
                                    Ext.create('Ext.window.Window',{
                                        width: 350,
                                        height: 350,
                                        layout: 'fit',
                                        items:[{
                                            xtype: 'gridportlet'
                                        }]
                                    }).show();
                        }else{
                            Ext.Loader.loadScript({
                                url: '../../SubAppName/production/minified.js',
                                onLoad: function() {
                                    Ext.create('Ext.window.Window',{
                                        width: 350,
                                        height: 350,
                                        layout: 'fit',
                                        items:[{
                                            xtype: 'gridportlet'
                                        }]
                                    }).show();
                                },
                                onError: function(op){
                                    console.log(op);
                                }
                            });
                        }

[Fredric Berling]

Had to make some adjustments to the MVCLoader preprocessor to be able to use ExtJS-4.1.3.

Please fetch new code at https://github.com/Fredric/ExtJS-Multiple-MVC

If you want to contribute just tell me and i will add you to the project.

[vadimv]

Had to make some adjustments to the MVCLoader preprocessor to be able to use ExtJS-4.1.3.

great, thx a lot

[bclinton]

Had to make some adjustments to the MVCLoader preprocessor to be able to use ExtJS-4.1.3.

I haven't moved to 4.1.3 yet, but I'm glad to see that you are staying active on this. Thanks!