Sencha Inc. | HTML5 Apps

Conference Sessions


Join us for SenchaCon’s grand opening keynote. Understand the vision, hear the strategy, and learn about our exciting plans for the future. We’ll also be demoing a range of great customer applications, and announcing the winners of our SenchaCon 2011 App Contest.

Introducing Sencha Touch 2

Sencha Touch is the industry’s first HTML5 mobile framework, and in v2 we’ve reworked the platform to make it faster to build apps, faster to get to market, and faster on all devices. Come and join Sencha in this session to learn about what’s changed, and how much more effective you can be using Sencha Touch 2. You’ll learn about the framework’s new native packaging capabilities, lighting fast Android performance, and host of other ways that Touch makes developing mobile apps easier than ever.

Introducing Designer 2

Join us at this session to learn about the newest version of Designer. Sencha Touch 2 support just scratches the surface of what Designer will enable in this latest version. Attendees will learn how to use Designer to build mobile applications, desktop applications and add interaction to their applications. You’ll be surprised at how fast you can go from whiteboard to web in this session.

Using UIBinder with Ext GWT 3.0

With Ext GWT 3.0 it is now possible to leverage declarative layouts with Ext GWT widgets and containers. In this session, you’ll learn how to use UIBinder within your Ext GWT application.

Sencha Animator

Sencha Animator is the industry’s leading CSS3 animation tool. With powerful timeline capabilities, interactive editing, rich previews, and a slick interface, designers have never had it easier to build their mobile animations and applications. Animator’s exclusive use of CSS3 lets your imagination go wild with high performance, hardware-accelerated visuals that will dazzle your customers. Attendees in this session will learn how to use and design top-flight animations and walk away mobile animation experts.

Introducing Ext GWT 3.0

This session will provide an overview of Ext GWT 3.0. There are many new features and lots of new functionality in this major release including Cell-based data widgets, Cell-based fields, a new data API, new charts, and theming.

Ext GWT 3.0 Data Widgets

The data widgets in Ext GWT3 have been completely rewritten. Rather than using renderers in 2.x, the new data widgets are GWT Cell-based. In this session you will learn about the changes and how to use the new API.

What’s New in HTML5, CSS3 and JavaScript

A review of the state of the fast-moving HTML5, CSS3, and JavaScript landscape, how these exciting new technologies are being implemented in browsers today, and a glimpse of some of the things we can look forward to in coming years.

Hacking WebKit & Its JavaScript Engines

WebKit, along with its JavaScript engines, is not a magical black box. We will show you the internal of various WebKit building blocks
(10,000-foot overview) and how they work together. In particular, learn also the simple steps on how to experiment with WebKit with your own and leverage WebKit functionalities to find the performance problems, track the network issues, automate effective smoke tests, and implement per-pixel correctness tests. In addition, armed with a little extra knowledge about JavaScript engines, you will be ready to improve both the quality and performance of your JavaScript code.

Ext GWT 3.0 Layouts

The Ext GWT 3.0 layout system was redesigned to support UiBinder and to provide an easy to use typed API. Learn about the new changes and see several examples of the new layout system.

Migrating from Ext GWT 2.x to 3.0

Looking to move to Ext GWT 3.0 from 2.x? This session will walk through the important API changes to help make the migration as straightforward as possible.

The Sencha Class System

Ext JS 4.x and Sencha Touch 2.0 went through a huge refactoring from the ground up with the new class system. It combines the familiar class-based programming style with the dynamic nature of JavaScript into a robust architecture which stands behind every single class written in the frameworks. This session will give you a complete picture of everything our new foundation has to offer as well as their benefits and best practices.

MVC In Depth (pt 1)

A two-part journey through the recommended patterns for building complex, Model-View-Controller-centric applications with both Ext JS 4 and Sencha Touch.

MVC In Depth (pt 2)

A two-part journey through the recommended patterns for building complex, Model-View-Controller-centric applications with both Ext JS 4 and Sencha Touch.

Using Node.js with Sencha Technologies

No doubt you’ve heard of Node. You’ve certainly heard of NoSQL. And you’re intrigued by this idea of server-side JavaScript in general. What are these technologies and why are they important? What does the modern application stack look like nowadays? What could it look like in the future? Can I really just write JavaScript everywhere, all-the-time? And how does this all fit into a Sencha-based application development workflow? Think of this talk as a spoken discussion document with which to tantalize and possibly confuse while I lay out my vision for the apocalypse that is Node and its accompanying technologies…

Creating Ext GWT Extensions and Components

Do you have a need for custom components or behavior? This session will bring you the knowledge you require to create and extend custom components. Learn which calls to intercept for your custom logic.

WebGL Fundamentals

3D Graphics have come to the browser and this represents a new world of possibilities. WebGL has a reputation for a high entry barrier, but fortunately there are already some frameworks out there making things simpler. We’ll cover some of the WebGL basics and show you what to look for in a framework for 3D graphics in the browser. You’ll also meet PhiloGL, a WebGL framework focused on data visualization, creative coding and game development from Sencha Labs. Prepare to watch cool 3D demos!

Hardware Acceleration on Mobile

GPU acceleration on mobile browsers, if it is leveraged correctly, can lead to a smooth and fluid applications, thus improving the user experience. There has been a lot of mentions and best practices of hardware acceleration these days, although so far it has been pretty general and hasn’t provided much technical direction apart from simple magical advice such as “use translate3d”. This talk sheds some more light on browser interactions with the GPU and explain what happens behind the scenes, covering the topic of acceleration of primitive drawing, the use of tiled backing store, and composited layer. Knowing the actual machinery behind hardware acceleration, you will be in the position to plan your strategy to improve the performance of your web application.

Ext GWT 3.0 Data Binding and Editors

With the GWT Editor framework, any Java bean can have its data bound to a view. Data can be any bean-like object, POJO, AutoBean, or RF EntityProxy, as well as BaseModelData subclass, to facilitate migrating legacy code. We’ll discuss creating Editor subclasses and reusing them, as well as look at possible patterns for using the Drivers.

Building Sencha Themes

Learn how to use the power of CSS3, Sass, Compass, and Sencha tools to create consistent and cross-platform themes for Ext JS 4 and Sencha Touch.

Ext GWT 3.0 Advanced Templates

Templates in Ext GWT 3.0 are generated at compile time, allowing them to be optimized. In addition to being mapped to a model, Templates can render data from beans, and can work with CssResources. We’ll discuss how to use these to create new component or how to create new appearances for existing ones, and how to use them with GWT Cells.

Ext GWT 3.0 Theming and Appearances

Theming in Ext GWT 3.0 now uses the GWT Appearance pattern and utilizes GWT ClientBundle and CssResource. This session will provide a detailed overview of how theming works and how to extend and create new themes.

Community Code: The SenchaCon App

Jay Garcia will discuss how Modus Create constructed the SenchaCon mobile application using Sencha Touch 2. Through this presentation, take you through deep dives into the SenchaCon app codebase, as well as discuss many of the decisions they made along the way. Many technical details about Sencha Touch itself will be peppered through this walkthrough.

Performance Optimization for Ext GWT 3.0

Application performance is an important part of an application’s usability. This session will provide detailed information and tips to keep your applications running fast.

Charting & Data Visualization in Ext GWT 3.0

It has always been a challenge to draw objects in GWT because SVG and VML are not supported out of the box. In Ext GWT 3.0, we solve this problem by providing a draw framework that runs everywhere, from IE6 to the latest Chrome that is developed as a pure GWT library. Learn about the new API’s and features including examples.

Documenting with JSDuck

Documentation is an important part of any project, especially when there is an API to be exposed to other developers. JSDuck is an open source ExtJS 4 project developed at Sencha to help Javascript developers generate beautiful documentation viewable in a web browser. Based loosely on JavaDoc, JSDuck parses documentation embedded in the source files of your project enabling you to keep your docs close to your code. In this session we will cover the many features of JSDuck and by the end you will know how to create API documentation, guides, videos and examples for your own project or application.

Application Security for RIAs

In this session, you’ll learn about the top 10 security risks in web applications, and, with demos, how REST backends and rich JavaScript applications map to these risks. Current and upcoming countermeasures include new HTTP headers, double submit cookies, and escaping input client-side to avoid DOM-based XSS. We’ll look at each of these, discuss the techniques you’ll want to add to your developer toolbox, and how to build reasonable security processes into an agile team environment.

Ext JS 4.1: Layouts, Performance, and API updates

Improving layout and rendering performance is a major focus of Ext JS 4.1. This session will discuss some of these details and how they might impact your application, custom components and custom layouts. Beyond these largely invisible features, Ext JS 4.1 has other exciting enhancements. We will also cover: improvements to Grid, Border layout, XTemplate, Data and the class system.

Community Code: SCircles

Custom Components, Theming, Drag-and-drop - Building a Social Network Engine with Ext JS 4

This showcase will demonstrate that Ext JS is not only suitable for internal corporate applications, but can be used for powerful consumer servies as well. ‘SCircles’ is an application that looks so different to normal Ext JS apps that it is hard to recognize it uses Sencha technology at all - and will serve as a demonstration of custom theming, custom components, and the use of the framework’s drag-and-drop capabilities.

Migrating from Ext JS 3 to 4

Anyone with existing code based on Ext 3.x or earlier will sooner or later want to start taking advantage of the new capabilities offered by Ext 4.  From MVC to charting to infinite grid scrolling, there are many reasons to upgrade, but where to begin?  This session will provide practical strategies for migrating to Ext 4, including following the “Four R’s” of migration, dealing with common problems and pitfalls, debugging best practices, migrating custom components and much more.  We’ll introduce the Ext 3 Compatibility layer and outline how it can minimize the time and effort required to convert your existing applications to Ext 4.

BlackBerry WebWorks APIs

Research In Motion, the maker of BlackBerry mobile phones and tablets, has been investing heavily in Web technologies over the past couple of years, including a number of Open Source projects. In this session, we will present this work: WebWorks, a platform to package Web apps and adopt a native app life cycle; Ripple, a browser-based tool to test your mobile Web apps for any platform (not just BlackBerry), and BlackBerry’s unique remote WebInspector facility, which allows you to remotely debug your mobile Web application from your desktop. This session will walk you through a technical description of the steps involved in building, testing and packaging a Web app with all those modern tools.

Ext JS 4: Advanced Expert Techniques

This session will take a detailed look into a variety of internal and less known properties of Ext JS. Topics range from component lifecycles to properties such as renderTpl, renderSelectors, childEls, renderData, and mon. Other topics include delegated events (where the framework utilizes it, and where you should be using them in your code) and many useful utility classes like MixedCollection, DelayedTask, TaskRunner, and more.

Accessing Native APIs from Touch

Learn how to use hybrid technologies like PhoneGap and NimbleKit to hook into native device capabilities, and then distribute your mobile applications into app stores and marketplaces.

Migrating from Touch 1.x to 2.0

Understand how to benefit from the latest capabilities of the Sencha Touch framework, and how to ensure your code is compatible when you upgrade.

Community Code: VGF

The VGF mobility SmartApp for public transport in Frankfurt, Germany, is a mobile web app developed with Sencha Touch for iPhone and Android smartphones. The app allows you to search for nearby barrier free stations, informs the user of delays, and displays Twitter news.

In this session, we will go through the app architecture, show how large data lists from a Ruby on Rails backend are loaded and handled, and how custom templates, Google Maps and Twitter were integrated. Finally, we cover the custom SASS theming, including custom CSS3 elements - and discuss the lessons we learned and the performance optimizations we used during development.

Community Code: ClickTime

“How To Create 1000 ExtJS UI Controls. Fast”. So your business requirements necessitate putting a ton of UI controls on a single page? Sure, you say, but there’s going to be a performance hit. Not so! We recently ran into this issue at ClickTime and were able to achieve the desired user experience without sacrificing speed. In this session, Allen will show you how to scale the hell out of the number of controls on a page while keeping your load times fast and your overall performance nice and zippy, even in older browsers.

HTML5 Distribution and API Strategies

After the recent dominance of mobile native apps, HTML5 is ready to make the mobile web a viable solution for developers. While other sessions focus on the tools developers can use to create their applications, this session will focus on what support AT&T can provide from carrier perspective particularly around marketing, distribution, and network APIs to help developers differentiate and monetize their HTML5 content.

Community Code: Nanocrowd

Nanocrowd 2.0: Transforming a website into an interactive consumer touch application

We’ll show you how Sencha Touch enabled our team (a bunch of desktop PC and Web nerds) to transform our recommendation website into an interactive multimedia mobile consumer app for finding and watching movies on the iPad. We used a combination of technology including Sencha Touch, HTML5, and
webSQL. We’ll show the code and methods we developed to: find and display lists of movies with embedded buttons, database info, and media objects;
present context-sensitive information and navigate collections of related videos; and manage a complex client/server data storage model.

Building Modern Web Apps with HTML5 and DART

Modern Web apps are rich, snappy, and work offline and mobile, too. In this talk, we’ll look at the frameworks and HTML5 features that make these possible, including support in GWT and Chrome:

- File handling / FileSystem API
- Offline (AppCache)
- LocalStorage
- Determining form factor

In addition, we’ll introduce DART, a new language for structured Web programming, and discuss it in relation to Javascript and GWT.

Community Code: Pega

Lessons from the Dynamic Enterprise Pega Mobile App

This session explains why we chose Sencha Touch over other frameworks and how we implemented a very dynamic and configurable enterprise mobile app. After briefly presenting the results of our prototypes in other frameworks, we will focus on the programming techniques used in our app. We explain how we architected and implemented JSON data, navigation, pinned toolbar, UI that redresses to phone and tablet (multi-device implementation techniques), and error handling - all using the Sencha MVC architecture. For achieving extreme configurability, we created the “UI JSON” for screens on the server using xtypes in Sencha Touch. Finally, we will cover some of the Sencha Touch 2 considerations and migration issues.

Community Code: The TouchForums App

This session will discuss the “TouchForums” mobile app, which is built with SenchaTouch and currently in development. The app combines features available in the Sencha forums and the support portal.

In its current state, the app runs on Sencha Touch 1.1.1, but will be migrated to Sencha Touch 2.0 in the near future. From an architectural level the app is built using MVC, and incorporates history support and unit tests run via Jasmine/JsTestRunner.

Server-side Breakout: Java

Understand the approaches and best practices for integrating client side applications - both desktop and mobile - with server-side Java.

Server-side Breakout: PHP

Understand the approaches and best practices for integrating client side applications - both desktop and mobile - with server-side PHP.