Optimizations in Javascripts and CSS files
From Opentaps Wiki
Revision as of 20:08, 1 March 2010 by Jwickers (talk | contribs) (Protected "Optimizations in Javascripts and CSS files": Sysop page [edit=sysop:move=sysop])
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
- pack with [jsmin]
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/).