+ All Categories
Transcript
Page 1: Introducing Ext JS 4
Page 2: Introducing Ext JS 4

Ext JS 4.0

Ed Spencer@edspencer

Page 3: Introducing Ext JS 4

Ext JS 3.x

Page 4: Introducing Ext JS 4

Ext JS 3.x1M developers

Page 5: Introducing Ext JS 4

Ext JS 3.x1M developers

Richest UI components

Page 6: Introducing Ext JS 4

Ext JS 3.x1M developers

Richest UI components

Strong data package

Page 7: Introducing Ext JS 4

Ext JS 4.x

Page 8: Introducing Ext JS 4

Ext JS 4.xFaster

Page 9: Introducing Ext JS 4

Ext JS 4.xFaster

More stable

Page 10: Introducing Ext JS 4

Ext JS 4.xFaster

More stable

Easier to learn and use

Page 11: Introducing Ext JS 4

Faster

Page 12: Introducing Ext JS 4

Layouts

Page 13: Introducing Ext JS 4

Ext 2 Ext 3 Ext 4

Speed Flexibility

Layouts

Page 14: Introducing Ext JS 4

Ext 2 Ext 3 Ext 4

Speed Flexibility

Layouts

Page 15: Introducing Ext JS 4

Ext 2 Ext 3 Ext 4

Speed Flexibility

Layouts

Page 16: Introducing Ext JS 4

Layouts

Page 17: Introducing Ext JS 4

Layouts

Layout engine rewritten

Page 18: Introducing Ext JS 4

Layouts

Layout engine rewritten

Same API

Page 19: Introducing Ext JS 4

Layouts

Layout engine rewritten

Same API

Faster than ever

Page 20: Introducing Ext JS 4

Layouts

Layout engine rewritten

Same API

Faster than ever

New layout types

Page 21: Introducing Ext JS 4

Code Performance

Page 22: Introducing Ext JS 4

Code Performance

Every class performance-tuned

Page 23: Introducing Ext JS 4

Code Performance

Every class performance-tuned

Continual performance testing

Page 24: Introducing Ext JS 4

Code Performance

Every class performance-tuned

Continual performance testing

Feels much faster

Page 25: Introducing Ext JS 4

More Stable

Page 26: Introducing Ext JS 4

4000+ unit tests

Page 27: Introducing Ext JS 4

Visual QA

Page 28: Introducing Ext JS 4
Page 29: Introducing Ext JS 4
Page 30: Introducing Ext JS 4
Page 31: Introducing Ext JS 4

Visual QA

Page 32: Introducing Ext JS 4

Easier

Page 33: Introducing Ext JS 4

Best documentation ever

Page 34: Introducing Ext JS 4

Overhauled API docs

Page 35: Introducing Ext JS 4

Overhauled API docs

Page 36: Introducing Ext JS 4

Examples

Page 37: Introducing Ext JS 4

ExamplesOver 200 examples

Page 38: Introducing Ext JS 4

ExamplesOver 200 examples

Clean source code

Clear explanations

Page 39: Introducing Ext JS 4

ExamplesOver 200 examples

Clean source code

Clear explanations

Integrated with API docs

Page 40: Introducing Ext JS 4

Sample Applications

Page 41: Introducing Ext JS 4

Guides

Page 42: Introducing Ext JS 4

Upgrade Guide

Page 43: Introducing Ext JS 4

API Improvements

Page 44: Introducing Ext JS 4

Standardized API

Page 45: Introducing Ext JS 4

Standardized APIClear naming conventions

Page 46: Introducing Ext JS 4

Standardized APIClear naming conventions

Simplified and streamlined

Page 47: Introducing Ext JS 4

Standardized APIClear naming conventions

Simplified and streamlined

Published style guide

Page 48: Introducing Ext JS 4

Simpler configuration

Page 49: Introducing Ext JS 4

Simpler configuration

Page 50: Introducing Ext JS 4

Simpler configuration

Ext 3

Page 51: Introducing Ext JS 4

Simpler configuration

Ext 4

Page 52: Introducing Ext JS 4

Simpler configuration

Ext 4Ext 3

Page 53: Introducing Ext JS 4

faster, easier, more stable

Page 54: Introducing Ext JS 4

7 more things

Page 55: Introducing Ext JS 4

1

Page 56: Introducing Ext JS 4

Charts

Page 57: Introducing Ext JS 4

Charts

JavaScript driven

Page 58: Introducing Ext JS 4

Charts

JavaScript driven

Canvas/SVG/VML

Page 59: Introducing Ext JS 4

Charts

JavaScript driven

Canvas/SVG/VML

Extremely customizable

Page 60: Introducing Ext JS 4

Charts

Page 61: Introducing Ext JS 4

Charts

Page 62: Introducing Ext JS 4

Charts

Page 63: Introducing Ext JS 4

Charts

Page 64: Introducing Ext JS 4

Charts

Page 65: Introducing Ext JS 4

2

Page 66: Introducing Ext JS 4

ARIA and RTL

Page 67: Introducing Ext JS 4

ARIA and RTL

508a Compliance

Page 68: Introducing Ext JS 4

ARIA and RTL

508a Compliance

Right-to-left text support

Page 69: Introducing Ext JS 4

ARIA and RTL

508a Compliance

Right-to-left text support

Excellent accessibility support

Page 70: Introducing Ext JS 4

3

Page 71: Introducing Ext JS 4

New Themes

Page 72: Introducing Ext JS 4

4

Page 73: Introducing Ext JS 4

Upgraded Components

Page 74: Introducing Ext JS 4

RowEditor

Page 75: Introducing Ext JS 4

TreeGrid

Page 76: Introducing Ext JS 4

5

Page 77: Introducing Ext JS 4

No more FormLayout

Page 78: Introducing Ext JS 4

6

Page 79: Introducing Ext JS 4

Advanced data package

Page 80: Introducing Ext JS 4

Ext.data.Record

Record

DataFields

Page 81: Introducing Ext JS 4

Ext.data.Model

DataFields

Model

Page 82: Introducing Ext JS 4

Ext.data.Model

DataFields Associations

Model

Page 83: Introducing Ext JS 4

Ext.data.Model

DataFields Associations Proxy

Model

Page 84: Introducing Ext JS 4
Page 85: Introducing Ext JS 4

New Proxies

New Proxies

LocalStorage SessionStorageWeb SQL

Page 86: Introducing Ext JS 4

New Proxies

WebStorageProxy

WebSqlProxy

Store data o!ine

Page 87: Introducing Ext JS 4

New Proxies

WebStorageProxy

WebSqlProxy

Store data o!ine

1 line of config

Page 88: Introducing Ext JS 4

New Proxies

WebStorageProxy

WebSqlProxy

Store data o!ine

1 line of config

Works transparently with other Proxies

Page 89: Introducing Ext JS 4

7

Page 90: Introducing Ext JS 4
Page 91: Introducing Ext JS 4

Application Architecture

ViewModel

Controller

Page 92: Introducing Ext JS 4

Application Architecture

MVC

ViewModel

Controller

Page 93: Introducing Ext JS 4

Application Architecture

MVC

Common file structure

ViewModel

Controller

Page 94: Introducing Ext JS 4

Application Architecture

MVC

Common file structure

Best practices throughout

ViewModel

Controller

Page 95: Introducing Ext JS 4

Application Architecture

MVC

Common file structure

Best practices throughout

Unit testing baked inViewModel

Controller

Page 96: Introducing Ext JS 4

Application Architecture

MVC

Common file structure

Best practices throughout

Unit testing baked in

Generators & Build toolsViewModel

Controller

Page 97: Introducing Ext JS 4

Sencha Command

Page 98: Introducing Ext JS 4

./sencha generate app Blog

Page 99: Introducing Ext JS 4

Sencha CommandGenerators Application

Page 100: Introducing Ext JS 4

Sencha CommandGenerators Application Model

Page 101: Introducing Ext JS 4

Sencha CommandGenerators Application Model Controller

Page 102: Introducing Ext JS 4

Sencha CommandGenerators Application Model Controller Store

Page 103: Introducing Ext JS 4

Sencha CommandGenerators Application Model Controller Store View

Page 104: Introducing Ext JS 4

Sencha CommandGenerators Application Model Controller Store View

Only the beginning

Page 105: Introducing Ext JS 4

7 more things

Page 106: Introducing Ext JS 4

Release date

Page 107: Introducing Ext JS 4

Release date

First beta: 6 weeks

Page 108: Introducing Ext JS 4

Release date

First beta: 6 weeks

4.0 February 28th

Page 109: Introducing Ext JS 4

Ext JS 4.0

Ed Spencer@edspencer


Top Related