JavaScript Sessions


Get new insights into JavaScript, the future of the language and its use in large-scale projects. Ajax framework creators and contributors go in-depth on jQuery, Dojo, Prototype, script.aculo.us, Yahoo UI, Google Web Toolkit and Mootools.

View all JavaScript sessions or click a title below to read its abstract:

 

Advanced CSS and Theming of Ext

with Jack Slocum, Chief Software Architect and Co-Founder, Ext JS

This session demonstrates how to manipulate the look and feel of Ext to integrate seamlessly with your application or company's style guide. As you probably know, all Ext widgets can be transformed to look radically different simply by adding an additional CSS theme file. Learn how to create a custom theme for your Ext application step by step in this hands-on demonstration.

 

Advanced JavaScript: Closures, Prototypes and Inheritance Demystified

with Stoyan Stefanov, Performance Engineer, Yahoo!

The times when JavaScript was just a toy language for making image rollovers and other, more irritating effects, are fortunately long gone. Today developers build much more sophisticated and complex applications be they for the Web (GMail), the desktop (Firefox extensions) or the server. JavaScript's prototypal nature makes its object-oriented features really different than "classical" languages like Java and C++, and we have to make sure we use the right tool the right way. In this talk you'll learn about JavaScript's most commonly misunderstood features and how you could put them to a good use.

 

Advanced jQuery

with John Resig, Creator/Lead Developer, jQuery

This session picks up where the Intro to jQuery session leaves off. Join us and look at some complex situations that are made easy with the jQuery framework.

In this session, we use jQuery and a number of jQuery plugins to create an advanced wizard. We implement complex form, navigation, and Ajax interactions, which provide the user with a seamless experience.

In this session you learn how to:

  • Understand exactly how jQuery plugins work;
  • Build a jQuery plugin;
  • Develop a complex piece of interaction using jQuery and jQuery plugins.

 

Applied JSON: HTTP REST, Ajax Databases and Beyond

with Kris Zyp, Research and Development, SitePen

JSON has proven to be a very easy to use, yet immensely powerful data interchange protocol. However, by itself JSON lacks a number of important expressibility capabilities and efficient client/server data interaction must usually be customized. This session looks at how we can use various open specifications built on JSON to standardize and automate this interaction.

We examine REST JSON, JSPON, and JSONPath. We also explore the capabilities of Ajax-accessible REST databases. The dynamic nature of non-relational databases can provide significant benefits for rapidly developing applications and providing JavaScript object persistence. Client-side code can directly participate in database interaction, simplifying the typical Web application stack. CouchDB, Persevere, and ActiveResource utilize a JSON REST interface. In this session, we learn how to interact with these simple interfaces and how to use JSONPath as a query language for JSON data stores. We see how these dynamic databases utilize JavaScript on the server for a consistent client/server JavaScript environment. We look at how Ajax databases affect security and provide an infrastructure for more secure Web applications. Finally, we cover JSON Referencing conventions as a mechanism for further expressing duplicate, circular, and cross-site referencing. Via a live demonstration, see how to use the Persevere open source tools to utilize these extensions to provide RESTful storage and server-side JavaScript.
In this session you learn how to:

  • Query JSON data with JSONPath;
  • Use Persevere to provide a powerful persistence object store for JavaScript;
  • Understand how JSON and the JSPON browser interacts with the Persevere object server;
  • Employ JSON extensions and tools to enable open communication formats that can be used for rich and robust serialized object interaction between clients and servers with full object graph descriptiveness.

 

Beyond the Standards - Advanced Animation and Physics in JavaScript

with Paul Bakaus, Creator and Lead Developer, jQuery UI

Forget about Web standards and go way beyond the usual capabilities of Web scripting languages. Learn how to create stunning effects using canvas/svg/vml, how to control animated graphics in JavaScript, and how to merge all kinds of standards and technologies to create a whole new world of possibilities. Using Paul's latest project as an example, he shows you how to adapt the things he talks about into new projects, featuring his new JavaScript game engine.

Paul demonstrates how to control animated graphics in the browser, how to scale and rotate elements smoothly, and how to combine canvas, svg and filters with CSS to adapt new standards in browsers that don't support them. See how to move physics from the real world to the Web browser.

In this session you learn how to:

  • Create a walking animated character;
  • Replicate new standards using existing technologies;
  • Combine new standards to create a new experience.

 

Cappuccino/Objective-J

with Francisco Tolmasky, Co-Founder, 290 North; Objective-J programming language

This lightening round introduces Cappuccino and Objective-J and the road to going open source. Cappuccino was implemented using a new programming language called Objective-J, which is modeled after Objective-C and built entirely on top of JavaScript. Programs written in Objective-J are interpreted in the client, so no compilation or plug-ins are required. Hear from Francisco Tolmasky, creator of the Objective-J language.

 

Defensive, Cross-Browser Coding with Prototype

with Andrew Dupont, Developer, Prototype; Front-end Developer, frog design

Tired of writing code that breaks in IE? This session explores strategies that Prototype users can employ to write code that works in the real world. Prototype 1.6 is a major revision to the Prototype framework and introduces many code idioms.

The process can be broken up into several stages:

  • Diagnosing the problem. Are you using APIs that aren't supported in all browsers? Are you leaking memory or tripping over a performance pothole in IE? Find out how to spot leaks and run benchmarks on your code.
  • Solving the problem. Know how to get around memory leaks. Know where the low-hanging optimization fruit lie, and the simple changes that'll increase performance ten-fold.
  • Managing code complexity. Learn how Prototype makes it easy to tailor code to a particular browser without code-forking.
  • Preventing future problems. "Write tests" is the "eat your vegetables" maxim of JavaScript development - everyone knows they should, but few people do. Writing unit and functional tests isn't as hard as it may seem. Prototype's Test.Unit library lets you run the sort of continuous integration tests that you'll run on your server-side code.

This session shows you how to:

  • Get useful information from ambiguous JavaScript errors thrown by IE;
  • Use Drip or Process Explorer to diagnose IE memory leaks;
  • Use Prototype's unit testing framework to run performance benchmarks in all browsers;
  • Decipher which parts of your code are making things slow;
  • Attack messy, complex, forking JavaScript with some basic code patterns made possible by Prototype.

 

Dojo Fundamentals

with Alex Russell, Project Lead, Dojo Toolkit and Director of R&D, SitePen, Inc.

Many advanced Web applications which rely heavily on Ajax have difficulty in the development phase with squaring the mantra of progressive enhancement with the reality that CSS just isn't powerful enough. Dojo provides a middle ground which provides the strongest progressive enhancement tools available while still comprehensively addressing performance, flexibility, modularization, and reuse needs of large-scale teams.

In this session, many common application construction "gotchas" are addressed. Learn about many of the low-level tools which Dojo provides to help implement progressive enhancement, optimize scripts for deployment to ensure that pages load fast, and how to use many of Dojo's layout widgets to provide flexible solutions to hard application construction problems.

In this session, you will learn:

  • Dojo.query and progressive enhancement;
  • How to construct advanced layouts;
  • How to build custom widgets;
  • How to optimize with builds.

 

Dojo Grid and Charting

with Alex Russell, Project Lead, Dojo Toolkit and Director of R&D, SitePen, Inc.

In this session, you learn about the powerful features in Dojo for accessing data, interacting with data, and visualizing trends and patterns; all without plug-ins or commercial products. Walk away with a new set of tools for providing your users with rich interactivity and the ability to tightly control the presentation of your data. Many designers aren't yet aware of the capabilities of Dojo's Grid and Charting packages and instead use applets, flash, or server-generated images to accomplish similar tasks, solutions which don't print well (if at all) and which result in less fluid, non-degradable user experiences. Likewise, many developers don't yet understand how simple it is to access virtually any type of data source through the uniform dojo.data APIs which underly both Dojo's Charting and Grids. Walk away with familiarity with the capabilities of these systems, an understanding of how they fit together, and techniques for how to customize them to suit their needs.

This session addresses:

  • Introduction to dojo.data;
  • How to set up simple grids;
  • dojo.data in-depth (optimization, lazy-loading, etc.);
  • Advanced grid layouts, locked columns, views, and compound rows;
  • Computed cell values, formatters;
  • Chart types and chart themes;
  • Scrolling, panning, viewing;
  • How to build sparklines;
  • Events, tooltips, and actions.

 

Enterprise JavaScript Error Handling

with Nicholas Zakas, Senior Front-end Engineer, Yahoo!

A lot of focus goes into error handling and error management on the back-end, this session brings the same eye to the front-end. This session teaches you how to prepare your JavaScript code for errors. Topics include usage of wondow.onerror, try/catch, throwing your own errors, logging error messages, identifying commonly error-prone code, how to discern between fatal and non-fatal errors, and how to deal with each.

Attend and find out how to:

  • Develop error handling strategies for JavaScript;
  • Identify common patterns that cause errors;
  • Determine whether an error is fatal or not;
  • Recover from errors;
  • Plus the importance of logging errors for tracking purposes and more.

 

Hacking Netflix

with Bill Scott, Director of User Interface Engineering, Netflix

Netflix will be releasing its open APIs for developers. Now you can finally mashup Netflix! Bill Scott gives a tour of the APIs and widgets, and showcases a series of cool hacks from this month's internal Netflix Hack Day. This talk gives you a really quick sense of what can be done with the  new Netflix APIs.

 

Hands-on Ext

with Aaron Conran, Senior Software Architect and Ext Services Team Leader

Hands-On Ext is a fast-paced session in which we will build an Ext application in less than an hour. This session demonstrates how to get started using Ext JS and how quickly you can put together a simple application from scratch. Learn how to utilize Ext's high-level UI widgets like GridPanel, TabPanel and FormPanel instead of re-inventing the wheel.

In this session you learn how to:

  • Create an application from scratch with Ext JS;
  • Utilize Ext's high-level UI widgets, such as GridPanel, TabPanel and FormPanel.

 

Interoperable Ajax Tools and Mashups

with Jon Ferraiolo, Web Architect, IBM; Head, OpenAjax Alliance

This session describes current work at OpenAjax Alliance around Ajax tooling and Ajax mashups. Ajax developer tools have been hampered by lack of interoperability among various IDEs and Ajax toolkits. This session introduces a new XML industry standard, OpenAjax Metadata for Ajax Libraries, designed at OpenAjax Alliance's IDE committee by representatives from Adobe, Aptana, Eclipse/ATF, and Microsoft Visual Studio. This standard will result in plug&play between Ajax IDEs and toolkits.

The second major topic in this session focuses on mashups. Mashups have the potential for revolutionizing the way Web applications are developed where users create their own applications, but there are interoperability challenges and security risks. In order to unleash the industry, OpenAjax Alliance has developed an open source secure mashup framework as part of OpenAjax Hub 1.1 (leveraging a set of techniques called "SMash" that were originally developed by IBM Research and allows for secure mashups that run in today's browsers) and a companion set of widget standards (OpenAjax Metadata for Widgets).

This session introduces you to:

  • A new XML industry standard, OpenAjax Metadata for Ajax Libraries, that allows interoperability between Ajax IDEs and toolkits;
  • An open source secure mashup framework as part of OpenAjax Hub 1.1 and a companion set of widget standards.

 

Interviewing for JavaScript Gurus

with Gavin Doughtie, Front-end Developer, Google; Contributor, Dojo toolkit

Now that JavaScript is being used for large commercial projects, we need to grow and develop our teams without losing code quality. For companies moving existing application functionality to the Web or intranet, how do we find JavaScript expertise to get us up to speed before we've developed it ourselves?

This session presents key areas to probe for when interviewing developers with "JavaScript" on their resumes, along with concrete questions and code samples.

In this session you discover:

  • The power and responsibility of programming with closures;
  • The hair-raising horrors of real-world Web browsers;
  • Functional programming idioms that JavaScript programmers should actually understand;
  • How to flunk a developer in three lines of code;
  • How to spot a Java developer masquerading as a JavaScript developer.

 

Intro to jQuery

with John Resig, Creator/Lead Developer, jQuery

jQuery is increasingly becoming one of the most popular JavaScript libraries to use. jQuery is a concise open source JavaScript Library used for DOM traversal, event handling, Ajax requests, and animations.

In this introduction, we look at what makes jQuery unique and why it helps you to write smaller code, faster. We also go hands-on (bring your laptops!) and write an animated Accordion Widget and an Ajax To-Do List from scratch.

In this session you learn:

  • A basic overview of jQuery;
  • How to develop a number of common-case widgets;
  • How to use jQuery to handle DOM, event, animations and Ajax interactions.

 

JavaScript: The Good Parts

with Douglas Crockford, Creater, JSON; Architect, Yahoo!

JavaScript is a language with more than its share of bad parts. It went from non-existence to global adoption in an alarmingly short period of time. It never had an interval in the lab when it could be tried out and polished, yet JavaScript has some extraordinarily good parts. In JavaScript there is a beautiful, highly expressive language that is buried under a steaming pile of good intentions and blunders. The best nature of JavaScript was so effectively hidden that for many years the prevailing opinion of JavaScript was that it was an unsightly, incompetent abomination.

This session exposes the goodness in JavaScript, an outstanding dynamic programming language. Within the language is an elegant subset that is vastly superior to the language as a whole, being more reliable, readable and maintainable.

 

jQuery on Rails (The Real Ones)

with Jonathan Sharp, Owner, Out West Media

This session looks at how a large Class 1 transportation company leveraged jQuery to develop a client-side framework for building 80+ internal and customer-facing applications, using a variety of backend frameworks, such as Wicket, Struts, JSF, ColdFusion and raw servlets. This project streamlined the workflow from UI prototype through application implementation, increasing developer productivity regardless of which framework was utilized. The presentation explores the techniques utilized such as DOM transformations, and presents best practices and lessons learned along with code demonstrations. The talk examines how to develop and enterprise solution for leveraging a diverse server-side framework portfolio and deliver a consistent experience to end users.

In this session, you find out how to:

  • Develop an enterprise solution for leveraging a diverse server-side framework portfolio;
  • Deliver a consistent experience to end users with a client-side solution;
  • Avoid consolidating your development environment to one framework;
  • Understand how jQuery fits into an enterprise development environment;
  • Determine the cross browser/cross framework development issues to consider.

 

Making your jQuery Code Modular

with Yehuda Katz, Plugins team leader, jQuery; Author, jQuery in Action

Get up-to-date with current best practices for developing lean, efficient and reusable code with jQuery. Almost all long-time jQuery users use the plugin architecture to build modularity into their code, so you don't need to be developing a plugin for mass-release to find this talk useful.

In this session, we examine the basic hook that all plugins use and dive into the element data store, custom events, and the new setup and teardown feature for jQuery's events. Included is a demonstration where we build a full auto-complete plugin in 100 lines of code or less.

In this session you learn:

  • How to build modularity into your jQuery code with plugin architecture;
  • New features of jQuery 1.2;
  • How to build a full auto-complete plugin in 100 lines of code or less.

 

MooTools: An Overview

with Aaron Newton, Contributor, MooTools; Founder, Iminta.com

In this session, we cover MooTools from top to bottom. We explore the basic utility methods provided by the framework, delve into the provided functionality from the straight forward (Ajax, Drag'n'Drop, etc) to the more complex (rich effects, sortables, psuedo-selectors, etc), and then move into how to extend Mootools for your own use. We examine the Class inheritance architecture and provide some real world examples of how it all works.

In this session you discover:

  • What makes MooTools different than other frameworks;
  • How to use MooTools as it's intended;
  • How to extend MooTools and the Javascript environment using it;
  • How to write your own MooTools plugins;
  • What MooTools has to offer and how it fits with your own sense of style.

 

New Features in DWR Version 3

with Joe Walker, Creator, Direct Web Remoting (DWR); Director, Support & Development, SitePen

This session looks at the new features of DWR version 3, including server proxy APIs and integration with Dojo, script.aculo.us, Pub/Sub message passing and integration with JMS and the OpenAjax Hub, image and binary file support for both upload and download, support for JSON and Bayeux and integration with Google Gears.

In this session you see:

  • The new features of DWR version 3;
  • How to use DWR in any Web site.

 

*Practical* Functional JavaScript

with Oliver Steele, Principal, Oliver Steele Consulting; Author, Functional JavaScript and more

This session covers how to use functional programming with JavaScript in real-life applications to implement client-side asynchronous processing, scheduling, and concurrency. These are complex areas that are difficult to think about or implement using straight object-oriented techniques, and become simpler with a handful of idioms that this talk demonstrates. Ajax developers (JavaScript or ActionScript) who are building applications that feature both ambient and reactive functionality, and that perform sophisticated tasks such as precompute display state or prefetch data, will benefit from this session.

This session provides:

  • A firmer understanding of closures and when to use them;
  • Insight into implementing time-based and threadlike client-side behavior in the browser.

 

Shiny Things in Spinoffsland: What's Up with Prototype and script.aculo.us?

with Christophe Porteneuve, CTO, Ciblo.net

This sessions takes a look at the latest features in both Prototype and script.aculo.us, including custom events and how to leverage them, method wrapping for AOP-style programming, sprockets, the refactorings and improvements on Ajax, scheduling and the DOM, the new effects engine, and more.

We wrap up with an overview of the community landscape for these libraries, looking at major helpful resources, prominent peripheral frameworks, and seeing what the future looks like for both Prototype and script.aculo.us.

In this session you learn:

  • How to write your scripts faster and in a cleaner, more concise, more expressive way;
  • To improve your scripts' performance by leveraging optimizations in the frameworks; 
  • To achieve cooler visual effects with the new effects engine;
  • To modularize your scripts and augment Prototype or native JavaScript in a clean way; 
  • The latest features in Prototype and script.aculo.us;
  • Where to find quality information, documentation and third-party toolkits and widgets;
  • Where Prototype and script.aculo.us are headed.

 

The Road to Cappuccino

with Francisco Tolmasky, Co-Founder, 280 North; Creator, Objective-J programming language

This session explores the story behind the development of the Objective-J language and Cappuccino frameworks. This will not only serve as an introduction to building Cappuccino applications, but also shed some light on why this particular course was chosen when developing these technologies.  Francisco discusses the future of the open source project and the next steps being taken with Objective-J and Cappuccino.

 

Tutorial: Intro to Ajax

with Ben Galbraith, Co-founder, Ajaxian.com and Dion Almaer, Co-founder, Ajaxian.com

This tutorial provides a proper introduction to Ajax and Ajax fundamentals - perfect for those who are new to Ajax or would like to brush up on their skills. Ajaxian.com co-founders, Ben and Dion, demonstrate basic Ajax techniques through live coding, and demonstrate and deconstruct more advanced examples of Ajax, including a discussion of how Ajax can improve any type of Web application. Ben and Dion also discuss how to avoid turning an Ajax application into an unmaintainable pile of hacked-up JavaScript, with a focus on debugging techniques.

 

Tutorial: JavaScript Library Overview

with John Resig, Creator/Lead Developer, jQuery

JavaScript Libraries are the de-facto way of developing client-side JavaScript code. Learning which frameworks best suit your needs will drastically affect your development.

This tutorial is a whirlwind tour of all the modern, open source, JavaScript frameworks. Libraries examined include Prototype, Dojo, jQuery, and Yahoo UI. We examine everything from features, to coding style, to file size, to community and growth; helping you to make an informed decision about your framework choice.

 

Using Milescript To Build JavaScript Applications

with Joshua Harrison, Co-founder, Point5u, LLC

Milescript addresses the growing trend of layering object-oriented frameworks on top of JavaScript to ease development of complex applications. As the size and complexity of these applications grow, they become more difficult to maintain. To address some of these challenges, Milescript provides static type-checking, auto-generated documentation, unit-testing and a standardized method for building and linking libraries of precompiled code and applications.

The session covers the basics of Milescript and how it can be useful for developing complex JavaScript applications. We start by describing Milescript's mission of creating a language, which stays as similar to JavaScript syntax as possible, while layering on a typical statically-typed object oriented framework. Included is an in-depth discussion of Milescript's ability to interact with existing and ongoing JavaScript development via its 'external' and 'export' class features. This ability to easily interact with existing JavaScript is an important part of Milescript's utility, as it allows you great freedom to decide precisely which portions of the problem domain are best implemented in JavaScript itself, and which portions will benefit from more rigorous type-checking.

In this session you learn:

  • What Milescript is;
  • How it can be useful for large and/or complex JavaScript development efforts;
  • How to use externals and exports to integrate with a JavaScript application;
  • The differences between Milescript and other frameworks that offer statically-typed OO layers on top of JavaScript.

 

Visual Programming with JavaScript

with John Resig, Creator/Lead Developer, jQuery

The release of the Processing.js library has taken the JavaScript world by storm — offering users an intuitive way of creating complex, interactive, pieces of visualization with JavaScript. The library was made possible by a fantastic new piece of Web development technology snuck in under the radar and works in all modern browsers: the HTML 5 Canvas element.

In this talk we'll take a complete exploration of the library, starting with the low-level Canvas element, working through the API and language parsing, and examine how to create impressive works using Canvas and Processing language — all using pure JavaScript.

 

YUI for Control Freaks

with Christian Heilmann, Web Architect, Yahoo!

The hidden quality of the YUI library is the ability to control and test what you are doing at any point in the process. This session breaks down the internal events of YUI, how to control animations, and what you need to know about the browser instance you apply your code to. With the classic "Web site" dying out more and more, we need to make sure our scripts and widgets are as open as possible to outside applications. This talk shows you how YUI is built to allow for integration with other scripts.

In this session you learn why:

  • Custom events are a great idea;
  • Animation goes hand-in-hand with moderation;
  • The user owns the interface;
  • Components-on-demand is a good plan.