Friday, January 14, 2011

ArcGIS Online Javascript API - Compact Build vs Standard Build

ESRI has (at least) two editions of the ArcGIS Online Javascript API.  One of those is the "compact" edition:

  1. http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1 (550k)
  2. http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1compact (355k)

Other than 200k, what is the difference?

The compact edition exclusively contains "esri.dijit.InfoWindowLite" whereas the basic edition contains (exclusively) the following:

"dijit._base", "dijit._base.focus", "dijit._base.place", "dijit._base.popup", "dijit._base.scroll", "dijit._base.sniff", "dijit._base.typematic", "dijit._base.wai", "dijit._base.window", "dijit._Container", "dijit._CssStateMixin", "dijit._HasDropDown", "dijit._Templated", "dijit._Widget", "dijit.form._FormWidget", "dijit.form.Button", "dijit.form.HorizontalRule", "dijit.form.HorizontalRuleLabels", "dijit.form.HorizontalSlider", "dijit.form.VerticalRule", "dijit.form.VerticalRuleLabels", "dijit.form.VerticalSlider", "dojo.AdapterRegistry", "dojo.cache", "dojo.cldr.nls.gregorian", "dojo.cldr.nls.gregorian.en_us", "dojo.cldr.nls.number", "dojo.cldr.nls.number.en_us", "dojo.cldr.supplemental", "dojo.date.locale", "dojo.date.stamp", "dojo.dnd.autoscroll", "dojo.dnd.common", "dojo.dnd.move", "dojo.dnd.Moveable", "dojo.dnd.Mover", "dojo.number", "dojo.parser", "dojo.regexp", "dojo.uacss", "dojo.window", "esri.dijit.InfoWindow", "esri.layers.agsimageservice", "esri.tasks._task", "esri.tasks.find", "esri.tasks.geometry", "esri.tasks.gp", "esri.tasks.identify", "esri.tasks.locator", "esri.tasks.na", "esri.tasks.query", "esri.tasks.route", "esri.toolbars._toolbar", "esri.toolbars.draw", "esri.toolbars.navigation", "esri.virtualearth.VEGeocoder", "esri.virtualearth.VETiledLayer"

How do I know this?

First, load the basic IDE:

(function() {
    var url = "http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1",
        init = function() {
            console.log("Restore djConfig, AOL may need it, ESRI does not");
            djConfig = dojo.config;
            coretech.ext.inspect("esri21fDojo");
        };


        djConfig = {
            scopeMap: [
                ["dojo", "esri21fDojo"],
                ["dijit", "esri21fDijit"],
                ["dojox", "esri21fDojox"]
            ],
            addOnLoad: init
        };
        $LAB.script(url);
}());

Second, load the compact IDE:

(function() {
    var url = "http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.1compact",
        init = function() {
            console.log("Restore djConfig, AOL may need it, ESRI does not");
            djConfig = dojo.config;
            coretech.ext.inspect("esri21cDojo");
        };

        djConfig = {
            scopeMap: [
                ["dojo", "esri21cDojo"],
                ["dijit", "esri21cDijit"],
                ["dojox", "esri21cDojox"]
            ],
            addOnLoad: init
        };
        $LAB.script(url);
}());

Finally, compare the two:

var compact = esri21cDojo._loadedModules;var full = esri21Dojo._loadedModules;
var compactOnly = [];
for (var c in compact) {
  if (undefined === full[c]) compactOnly.push(c);
}
compactOnly.push("---------------------------------");
for (var f in full) {
  if (undefined === compact[f]) compactOnly.push(f);
}
dojo.toJson(compactOnly, true);

If you run the compact JS code through a beautifier you can see that InfoWindowLite declares a InfoWindow, presumably customized for smaller screens but also to avoid any dijit dependencies (there is still a dependency on dijit._base.manager):

    if (!dojo._hasResource["esri.dijit.InfoWindowLite"]) {
        dojo._hasResource["esri.dijit.InfoWindowLite"] = true;
        dojo.provide("esri.dijit.InfoWindowLite");
        dojo.declare("esri.dijit.InfoWindow", null, {...


Links


No comments:

Post a Comment