Turbo-Charge Your Ext JS AppPer Minborg, Speedment & Jon Jarboe, Senchafeaturing Anselm McClain, xh.ioNovember 9, 2016

You will learn:

• About Ext JS and Ext Speeder

• How to make the back end development process faster

• How Ext Speeder improves your performance

2

Ext Speeder Related Sessions

• 2:00 PM, Using Ext JS Components to Turn Big Data into Actionable Intelligence

• Olga Petrova, Sencha, Starvine 3-5

• 4:10 PM, How to Auto Generate a Back-end in Minutes

• Emil Forslund, Per Minborg, Starvine 1-2

3

About Ext JS and Ext Speeder

Fast Development and Extreme Performance

Front end

Back endOne end

Ext Speeder

• Database back end tool for applications

• Simplifies development of database applications

• Quickly design, develop and deploy Ext JS applications

• Automatic generation of code, no need to worry about the back end

• In-memory acceleration

EXT JS Application

Sencha Ext JSRapidly build feature-rich, data intensive cross-platform enterprise applications

• High performance, customizable widgets

• Backend agnostic data package

• Responsive layout manager

• Advanced charting package

• Easily customizable themes

• ARIA / 508 Compliance

Accelerating Back End Development

Web ServerApp

Client

Data in Ext JS Apps

Server

UI Components

Data Manager

Local data

Pages, Assets, etc.

Data Services

REST

SOAP

etc.

Database

Traditional Back End Development Process

• Model the database 5h

• Secure Connection 1h

• Parse http command 1h

• Deserialize parameters 1h

• Manage database connections 1h

• Convert into SQL 2h

• Optimize queries 3h

• Parse database response 2h• Format into JSON 1h• Send back to Client 1h• Write XML config 1h• Deploy in Java EE 1h• Fix bugs 4h• Run Application 0.1 h

24 h

Web Server

Client

Data in Ext Speeder

Server

Complete REST API

In-memoryObject Store(entire db)

Database

Automatic Refresh Logic

Introspection

Data Services

Web ServerApp

Client

Data in Ext JS + Ext Speeder Apps

Server

UI Components

Data Manager

Local data

Pages, Assets, etc.

REST

Obj Store Database

Ext Speeder Back End Development Process • Install Ext Speeder 0.4 h

• Connect to database 0.1h

• Select tables and columns 0.3 h

• Press ”Generate” 0.0 h

• Deploy in Java EE 0.1h

• Run application 0.1h

1 h

Ext Speeder

• REST API automatically generated

• In-Memory Technology for High Perfor-mance

• Deployment stand-alone or in Java EE server like Oracle WebLogic or Tomcat.

Ext Speeder Back End Development Process

1. Connect

2. Generate

3. Use

Ext Speeder Acceleration• Convert large databases into

In-memory Objects

• Extreme Performance, real time Big Data

• Downloads a copy of the most recent database state in the background

• Seamlessly switches over to the copy

• Configurable in-memory reload time-Default reload each hour-Configurable per second, minute or hour

• Multi-versioning concurrent control (MVCC)

Automatic Data Reload

Deployment Scenarios

• Stand Alone Java SE 8

• Java EE Application Server- Oracle WebLogic

- Tomcat / TomEE

- Glassfish / Payara

- Wildfly / JBoss

- Jetty

IDEs

Databases

Ext JS Versions

• No change in Ext Speeder - Works for these versions:  -Ext JS 6 (BufferedStore) -Ext JS 5 (BufferedStore) -Ext JS 4 (Use regular Store with buffered = true)

Accelerating Run-Time Performance

How Ext Speeder improves your performance

• Data Database objects are stored in-memory

• Sort A sorted view of every column resides in-memory

• Filter Resolved without querying the database. In-memory filtering lookup.

• Skip In-memory dictionaries improve skip performance

• Total Number of results are cached for each set of parameters

Performance Test : Open database

• Open database with US doctors

• 40 million objects

• Comparison with and without Ext Speeder

See full video on www.extspeeder.com

Performance Test : Pivot Grid

See full video on www.extspeeder.com

Case Study : Portfolio IQ by xh.io

See full video on www.extspeeder.com

Ext Speeder: Summary

• Data-driven apps developed faster with less effort

• Seamless integration with Ext JS Grid

• Improved User Experience with apps accessing large amounts of data

• Lower effort to create and maintain comprehensive REST APIs

How to get Ext Speeder

Want Maintenance & Support?

• Up to 5 Developers $ 2,475 / Year

• Every Additional Developer $ 495 / Year

• Renewal: 50% of regular price

Need Custom Features Tailored for Your Project?

Contact Salessales@extspeeder.com

Additional Database Connectors

Scale-Out Over Multiple Nodes

Aggregating Operators

Create, Update, Delete...

Connect Several Databases

Reactive WebSockets

Learn More

Ext Speederhttp://www.extspeeder.com

Ext JShttps://www.sencha.com/products/extjs/

Xh.iohttps://xh.io/

Please Take the Survey in the Mobile App

• Navigate to this session in the mobile app

• Click on “Evaluate Session”

• Respondents will be entered into a drawing to win one of five $50 Amazon gift cards

Thank You! minborg@speedment.com jon.jarboe@sencha.com

atm@xh.io

Ext Speeder Example

• ~25 million rows

• User Interaction “scrollbar”- Sort by price

- Skip to row 15,342,132

- Show 50 following rows

Ext Speeder Example

• Use the sorted view “price” in descending order (instant)

• Use the dictionary to find the closest token for 15,342,132 (instant)- Closest token might be $30.23 at 15,342,102

• Find that token (instant)

• Skip (15,342,132 – 15,342,102 = 30 rows) (30 operations)

• Retrieve the following 50 rows directly from memory

• Convert to JSON