Results 1 to 6 of 6

Thread: How can I build production by Ext JS 5 app, but keep separate the Ext JS library?

  1. #1
    Sencha Premium User SebTardif's Avatar
    Join Date
    Feb 2011
    Location
    Cambridge, MA
    Posts
    1,295
    Vote Rating
    117
      1  

    Default How can I build production by Ext JS 5 app, but keep separate the Ext JS library?

    To improve caching between applications. I would like to keep separate the Ext JS library from my built code.

    Mainly, my production index.html will looks similar to:

    <script type="text/javascript" src="ext-all.js"></script>
    <script type="text/javascript" src="MyApp-all.js"></script>

    How do I easily get that result from: sencha app build production ?

  2. #2
    Sencha User dongryphon's Avatar
    Join Date
    Jul 2009
    Location
    Kansas
    Posts
    1,742
    Vote Rating
    260
      0  

    Default

    We have discussed "multi-app" aware builds, but there is no direct support for that at present, so while you could coax Cmd into splitting its output along these lines, the framework content would be effectively app-specific.

    Or perhaps you are intending to use "ext-all.js" (literally) and not the subset Cmd determined as actually needed? That would mean you just want Cmd to concat / optimize the files of each app and each would then load 100% of the framework?

    If so, it would be interesting to see if the increase in size of ext-all vs only what each app needs would actually be a benefit to total load time...
    Don Griffin

    "Use the source, Luke!"

  3. #3
    Sencha Premium User SebTardif's Avatar
    Join Date
    Feb 2011
    Location
    Cambridge, MA
    Posts
    1,295
    Vote Rating
    117
      0  

    Default

    I want the original ext-all.js, then sencha cmd could compress and optimize the code of app only.

  4. #4
    Sencha User dongryphon's Avatar
    Join Date
    Jul 2009
    Location
    Kansas
    Posts
    1,742
    Vote Rating
    260
      0  

    Default

    There is an Ant property called "build.operations" which you can define that is injected just prior to Cmd saving the set of files it determines are needed by your app. These are the files that will be concatenated into the build/app.js file.

    I added this to build.xml since multi-line properties are much cleaner in this file then in a .properties file:

    Code:
        <target name="-before-init">
            <property name="build.operations">
                exclude
                    -all
                and
                include
                    -namespace=App
            </property>
        </target>
    This will only keep your app code by using its namespace name (a white-list). In more complex scenarios you might need to exclude only specific things (a black-list). This will exclude only the core and ext packages:

    Code:
        <target name="-before-init">
            <property name="build.operations">
                exclude
                    -tag=package-sencha-core
                    -tag=package-ext
            </property>
        </target>
    You didn't mention the theme you are using but that will come into play because themes have JavaScript overrides. To exclude the Neptune theme as well (if you plan to also include its all.js file):

    Code:
        <target name="-before-init">
            <property name="build.operations">
                exclude
                    -tag=package-sencha-core
                    -tag=package-ext
                    -tag=package-ext-theme-neptune
            </property>
        </target>
    If you do an A/B test on this I would love to hear your results of "cache benefit" using this approach vs "less code to execute" using the stock app build.
    Don Griffin

    "Use the source, Luke!"

  5. #5
    Sencha Premium Member
    Join Date
    Jan 2010
    Location
    Vancouver, Canada
    Posts
    228
    Vote Rating
    71
      0  

    Default

    @SebTardif: I know it's almost 3 years later, but I am interested in the same thing in Ext Js 6. What did you end up doing?

    The solution proposed by dongryphon works for me, though the build time still takes as long as a normal build that includes just dependencies.

  6. #6
    Sencha Premium Member
    Join Date
    Jan 2010
    Location
    Vancouver, Canada
    Posts
    228
    Vote Rating
    71
      0  

    Default

    I used this command to concatenate my app files:

    Code:
    sencha compile -classpath=app,app.js exclude -namespace=Ext and concat app-all.js

Tags for this Thread

Posting Permissions

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