Optimizations in Javascripts and CSS files

From Opentaps Wiki

Jump to: navigation, search

Contents

Javascripts

Note on DOJO

The DOJO files can be combined using the packager included with the DOJO sources. The opentaps DOJO files are based on the 0.9.0 release.

To make a packaged DOJO:

  • get the release tarball with sources: dojo-release-0.9.0-src.tar.gz
  • define the profile (set of modules included in a package) by creating util/buildscripts/profiles/opentaps.profile.js with:
  dependencies = {
       layers: [
               {
                       name: "opentaps-dojo.js",
                       dependencies: [
                                      "dojo.fx",
                                      "dojo.dnd.source",
                                      "dojo.dnd.manager",
                                      "dojo.dnd.move",
                                      "dojo.currency",
                                      "dojo.data.JsonItemStore",
                                      "dojo.data.JsonItemStoreAutoComplete",
                                      "dijit.Tree",
                                      "dijit.Dialog",
                                      "dijit.form.window",
                                      "dijit.form.Form",
                                      "dijit.form.Button",
                                      "dijit.form.ComboBox",
                                      "dijit.layout.ContentPane",
                                      "dijit.nls.loading"
                       ]
               }
       ],
       prefixes: [
                  [ "dijit", "../dijit" ],
                  [ "dojox", "../dojox" ]
       ]
  }
  • in util/buildscripts : do ./build.sh profile=opentaps action=release copyTests=false
  • get the files from release/dojo
  • this includes a opentaps-dojo.js which will be used later

Note that for opentaps dome patches were applies (see the revision control system).

To include in a HTML page, the simple dojo.js must still be included first

Packing other JS files

From hot-deploy/opentaps-common/webapp/js:

  • merge the various scripts
  cat protoaculous.1.8.2.p1.6.1.min.js ../../../../framework/images/webapp/images/calendar_date_select.js opentaps.js selectall.js fieldlookup.js formwidget.js opentapsDisplayEffects.js opentapsWindow.js shortcuts.js jscalendar-1.0/calendar.js jscalendar-1.0/calendar-setup.js > opentaps-packed1.js
  jsmin <opentaps-packed1.js >opentaps-packed.js
  • merge with the dojo package in hot-deploy/opentaps-common/webapp/js/dojo_0.90/dojo
  cat opentaps-dojo.js ../../opentaps-packed.js > opentaps-dojo-packed.js

CSS files

The CSS files where already merged, except the jscalendar CSS (since this is an external module), to merge it, in hot-deploy/opentaps-common/webapp/css

  cat opentaps.css ../js/jscalendar-1.0/calendar-system.css > opentaps-packed.css

To further reduce the CSS file size an external CSS compressor can be used (for example http://www.cleancss.com/).



© Open Source Strategies, Inc. Development of this documentation site is sponsored by Open Source Strategies, Inc.
Help support opentaps with a subscription to this documentation site.