Dojo Web Builder
                                                          Building Dojo in the Cloud




http://www.flickr.com/photos/turtlemom_nancy/2046347762/
                                                                                       James Thomas
Me.




@thomasj
Who uses the Dojo
builder for their app?
So... why do we need a
    “Web Builder”?
Existing Dojo Build

• Learning curve too steep for many users
• Toolset may put some some users, i.e.
  commands lines and shell scripts
• Users from simpler toolkits aren’t used to
  “building” JavaScript components
Why does this matter?
“Dojo is slow....”
http://www.flickr.com/photos/mrhayata/107290472/
http://www.flickr.com/photos/88933162@N00/5190194408/
Dojo Web Builder
build.dojotoolkit.org

•   Launched in April 2011


•   Served nearly 3000
    builds of Dojo!


•   Hosted on EC2
github.com/dojo/dwb
Time for a demo!
How does it work?
Architecture

                  XHR
Web Application           REST API     Asynchronous
                                           Builder
                  JSON     (Java)
                                        (JavaScript)




 Dojo 1.5                  Jetty      Rhino
                         JAX-RS      Dojo Build
Architecture

                  XHR
Web Application             REST API               Asynchronous
                                                       Builder
                  JSON       (Java)
                                                    (JavaScript)




             Retrieve all packages available....
GET /packages

{
    "packages":
       [
          {
            "link":"http://your.dojotoolkit.org/api/packages/dojo",
            "name":"dojo"
          }
       ],
       [
          {
            "link":"http://build.dojotoolkit.org/api/packages/dwb",
            "name":"dwb"
          }
       ]
}
GET /packages/dojo
{
    "versions":
       [
          {
             "link":"http://build.dojotoolkit.org/api/packages/dojo/1.4.3",
             "name":"1.4.3"
          },
          {
             "link":"http://build.dojotoolkit.org/api/packages/dojo/1.5.1",
             "name":"1.5.1"
          },
          {
             "link":"http://build.dojotoolkit.org/api/packages/dojo/1.6.1",
             "name":"1.6.1"
          }
       ]
}
GET /packages/dojo/1.6.1

{
    "description":"Dojo Toolkit, release 1.6.1",
    "name":"Dojo Toolkit",
    "modules":
       [
         ["dijit.Calendar","A simple GUI for choosing a date in the context of a monthly
         calendar. "],
         ["dijit.CheckedMenuItem","A checkbox-like menu item for toggling on and off "],
         ["dijit.ColorPalette","A keyboard accessible color-picking widget "],
         ["dijit.Declaration","The Declaration widget allows a developer to declare new
         widget classes directly from a snippet of markup. "],
         .......
       ]
}
Architecture

                  XHR
Web Application                REST API      Asynchronous
                                                 Builder
                  JSON          (Java)
                                              (JavaScript)




                         Submit a build...
POST /build
{
    "packages":[
       {
          "name":"dojo",
          "version":"1.6.1"
       }
    ],
    "layers":[
       {
          "name":"dojo.js",
          "modules":[
             {"name":"dijit.Calendar", "package":"dojo"},
             {"name":"dijit.Dialog", "package":"dojo"},
             {"name":"dijit.Menu","package":"dojo"}
          ]
       }
    ],
    "optimise":"shrinksafe",
    "cdn":"none",
    "themes":"claro",
    "cssOptimise":"comments"
}
HTTP 202 Accepted
{
    "buildStatusLink": "http://build.dojotoolkit.org/api/build/status/
    HtHlqBVzBAztHRKMlClyYPzBofk_"
}
GET /build/status
{
     "buildStatusLink": "http://build.dojotoolkit.org/api/build/status/
     HtHlqBVzBAztHRKMlClyYPzBofk_"
}



{
    "logs": "Beginning build process...”
    "state": "BUILDING"
}
GET /build/status
{
     "buildStatusLink": "http://build.dojotoolkit.org/api/build/status/
     HtHlqBVzBAztHRKMlClyYPzBofk_"
}



{
    "logs":"Beginning build process...”
         Local build selected.
         Loading build scripts... done
         Found custom module package, set up build....
         Custom user package analysis... done
         Creating layer profiles....
         Discovered layer, dojo.js
         Creating layer contents from profile...
         ....
         Build process completed successfully!",
    "state" : "COMPLETED",
    "result": "http://build.dojotoolkit.org/api/build/
            HtHlqBVzBAztHRKMlClyYPzBofk_"
}
http://www.flickr.com/photos/decade_null/142235888/
LOGS



       http://www.flickr.com/photos/decade_null/142235888/
Statistics!
              http://www.flickr.com/photos/gasi/348050339/
Builds Per Month
                       Build Requests

800


600


400


200


  0
        May     June          July      August   Sept


      Total Builds Since Launch - 2740*
Most Popular Modules
      Module Name               Builds Contained
             dijit.Dialog             30.80%
         dijit.form.Button            30.58%
   dijit.layout.ContentPane           26.57%
          dijit.form.Form             23.80%
            dojo.parser               22.85%
 dojo.data.ItemFileReadStore          22.85%
           dijit.Calendar             22.55%
   dijit.form.FilteringSelect         22.26%
     dijit.form.ComboBox              22.08%
   dijit.layout.TabContainer          22.01%
Auto Analysis
           Analysis Type

2,000


1,500


1,000


 500


   0
        Remote URL         Local File   Profile


    Total Auto-Analyse Requests - 2180
Auto Analysis
           Analysis Type                Localhost

2,000


1,500


1,000


 500


   0
        Remote URL         Local File           Profile


    Total Auto-Analyse Requests - 2180
What’s next?
• Full AMD support (build & auto-analysis)
• Full AMD support (build & auto-analysis)

• Dojo Foundation Package Repository
• Full AMD support (build & auto-analysis)

• Dojo Foundation Package Repository

• Build process purely client-side?
Thank you for listening!

     http://build.dojotoolkit.org



     http://github.com/dojo/dwb

Building Dojo in the Cloud

  • 1.
    Dojo Web Builder Building Dojo in the Cloud http://www.flickr.com/photos/turtlemom_nancy/2046347762/ James Thomas
  • 2.
  • 3.
    Who uses theDojo builder for their app?
  • 5.
    So... why dowe need a “Web Builder”?
  • 6.
    Existing Dojo Build •Learning curve too steep for many users • Toolset may put some some users, i.e. commands lines and shell scripts • Users from simpler toolkits aren’t used to “building” JavaScript components
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
    build.dojotoolkit.org • Launched in April 2011 • Served nearly 3000 builds of Dojo! • Hosted on EC2
  • 13.
  • 14.
  • 15.
  • 16.
    Architecture XHR Web Application REST API Asynchronous Builder JSON (Java) (JavaScript) Dojo 1.5 Jetty Rhino JAX-RS Dojo Build
  • 17.
    Architecture XHR Web Application REST API Asynchronous Builder JSON (Java) (JavaScript) Retrieve all packages available....
  • 18.
    GET /packages { "packages": [ { "link":"http://your.dojotoolkit.org/api/packages/dojo", "name":"dojo" } ], [ { "link":"http://build.dojotoolkit.org/api/packages/dwb", "name":"dwb" } ] }
  • 19.
    GET /packages/dojo { "versions": [ { "link":"http://build.dojotoolkit.org/api/packages/dojo/1.4.3", "name":"1.4.3" }, { "link":"http://build.dojotoolkit.org/api/packages/dojo/1.5.1", "name":"1.5.1" }, { "link":"http://build.dojotoolkit.org/api/packages/dojo/1.6.1", "name":"1.6.1" } ] }
  • 20.
    GET /packages/dojo/1.6.1 { "description":"Dojo Toolkit, release 1.6.1", "name":"Dojo Toolkit", "modules": [ ["dijit.Calendar","A simple GUI for choosing a date in the context of a monthly calendar. "], ["dijit.CheckedMenuItem","A checkbox-like menu item for toggling on and off "], ["dijit.ColorPalette","A keyboard accessible color-picking widget "], ["dijit.Declaration","The Declaration widget allows a developer to declare new widget classes directly from a snippet of markup. "], ....... ] }
  • 21.
    Architecture XHR Web Application REST API Asynchronous Builder JSON (Java) (JavaScript) Submit a build...
  • 22.
    POST /build { "packages":[ { "name":"dojo", "version":"1.6.1" } ], "layers":[ { "name":"dojo.js", "modules":[ {"name":"dijit.Calendar", "package":"dojo"}, {"name":"dijit.Dialog", "package":"dojo"}, {"name":"dijit.Menu","package":"dojo"} ] } ], "optimise":"shrinksafe", "cdn":"none", "themes":"claro", "cssOptimise":"comments" }
  • 23.
    HTTP 202 Accepted { "buildStatusLink": "http://build.dojotoolkit.org/api/build/status/ HtHlqBVzBAztHRKMlClyYPzBofk_" }
  • 24.
    GET /build/status { "buildStatusLink": "http://build.dojotoolkit.org/api/build/status/ HtHlqBVzBAztHRKMlClyYPzBofk_" } { "logs": "Beginning build process...” "state": "BUILDING" }
  • 25.
    GET /build/status { "buildStatusLink": "http://build.dojotoolkit.org/api/build/status/ HtHlqBVzBAztHRKMlClyYPzBofk_" } { "logs":"Beginning build process...” Local build selected. Loading build scripts... done Found custom module package, set up build.... Custom user package analysis... done Creating layer profiles.... Discovered layer, dojo.js Creating layer contents from profile... .... Build process completed successfully!", "state" : "COMPLETED", "result": "http://build.dojotoolkit.org/api/build/ HtHlqBVzBAztHRKMlClyYPzBofk_" }
  • 27.
  • 28.
    LOGS http://www.flickr.com/photos/decade_null/142235888/
  • 29.
    Statistics! http://www.flickr.com/photos/gasi/348050339/
  • 30.
    Builds Per Month Build Requests 800 600 400 200 0 May June July August Sept Total Builds Since Launch - 2740*
  • 31.
    Most Popular Modules Module Name Builds Contained dijit.Dialog 30.80% dijit.form.Button 30.58% dijit.layout.ContentPane 26.57% dijit.form.Form 23.80% dojo.parser 22.85% dojo.data.ItemFileReadStore 22.85% dijit.Calendar 22.55% dijit.form.FilteringSelect 22.26% dijit.form.ComboBox 22.08% dijit.layout.TabContainer 22.01%
  • 32.
    Auto Analysis Analysis Type 2,000 1,500 1,000 500 0 Remote URL Local File Profile Total Auto-Analyse Requests - 2180
  • 33.
    Auto Analysis Analysis Type Localhost 2,000 1,500 1,000 500 0 Remote URL Local File Profile Total Auto-Analyse Requests - 2180
  • 34.
  • 35.
    • Full AMDsupport (build & auto-analysis)
  • 36.
    • Full AMDsupport (build & auto-analysis) • Dojo Foundation Package Repository
  • 37.
    • Full AMDsupport (build & auto-analysis) • Dojo Foundation Package Repository • Build process purely client-side?
  • 38.
    Thank you forlistening! http://build.dojotoolkit.org http://github.com/dojo/dwb