embedJS

15
embedJS uxebu the JavaScript toolkit that fits all Sonntag, 26. September 2010

description

Those slides explain embedJS, a super optimized JavaScript framework for embedded devices (mobile phones, TVs, etc.) based on the Dojo Toolkit.

Transcript of embedJS

Page 1: embedJS

embedJS

uxebu

the JavaScript toolkit that fits all

Sonntag, 26. September 2010

Page 2: embedJS

The Supported Devices

... and there will be moreto embed JavaScript on

Sonntag, 26. September 2010

Page 3: embedJS

http://www.flickr.com/photos/tacoekkel/25538919/

The Approach

take your library apartto reconstruct it as needed

Sonntag, 26. September 2010

Page 4: embedJS

http://www.flickr.com/photos/hugo90/3916794427/

Packager

package just what you need!Ship no useless byte

Sonntag, 26. September 2010

Page 5: embedJS

How To Ship No Useless Byte

1. Shrink Your API

2. Build Only What You Use

3. Reduce Features

4. Device Specific Build

Sonntag, 26. September 2010

Page 6: embedJS

Shrink Your API

20kB 8kB

1

Sonntag, 26. September 2010

Page 7: embedJS

kitchensink.js

Build

string

file.js

queryfile.js

file.js

file.jsfile.js

file.js

array

file.js

file.jsfile.js

fxfile.js

file.js

langfile.js

file.js

file.jsfile.js

file.js

htmlfile.js

file.js

file.jsfile.js

file.js

20kb(unzipped)

OO

declare.js

mixin.js

extend.js

delegate.jsinherit.js

http://github.com/uxebu/embedjs/tree/master/build/

2

Sonntag, 26. September 2010

Page 8: embedJS

kitchensink.js

Tiny/Custom Build

string

file.js

queryfile.js

file.js

file.jsfile.js

file.js

array

file.js

file.jsfile.js

fxfile.js

file.js

langfile.js

file.js

file.jsfile.js

file.js

htmlfile.js

file.js

file.jsfile.js

file.js

8kb(unzipped)

OO

declare.js

mixin.js

extend.js

delegate.jsinherit.js

2

Sonntag, 26. September 2010

Page 9: embedJS

vs.

Simple queries > simple library functionOnly ".class" and "#id" queries

3

Sonntag, 26. September 2010

Page 10: embedJS

vs.

Simple queries > simple library functionOnly ".class" and "#id" queries

Full fledged queries > Full blown library function

3

Sonntag, 26. September 2010

Page 11: embedJS

vs.

Simple queries > simple library functionOnly ".class" and "#id" queries

Full fledged queries > Full blown library function

13 LOC

~200 LOC

3

Sonntag, 26. September 2010

Page 12: embedJS

4

At RuntimeAt Build Time

Sonntag, 26. September 2010

Page 13: embedJS

dojo-blackberry.js

dojo-blackberry46.js

dojo-nokia-wrt.js

dojo-opera.js

dojo-webkit-mobile.js

dojo-windows-mobile.js

4

Sonntag, 26. September 2010

Page 14: embedJS

How To Ship No Useless Byte

1. Shrink Your API

2. Build Only What You Use

3. Reduce Features

4. Device Specific Build

> Smallest, Most Efficient JavaScript

Sonntag, 26. September 2010

Page 15: embedJS

thx

http://uxebu.com

uxebu

http://twitter.com/embedjshttp://twitter.com/uxebu

http://embedjs.org

Sonntag, 26. September 2010