mitchoMichael Yoshitaka Erlewine

JSConf US, Washington DC

April 15, 2010

The latest fromMozilla Jetpack

Today:

The latest from the Jetpack Project at Mozilla Labs

mitcholinguist, coder, teacher

© 2010 Douglas Hanna

mitcholinguist, coder, teacher

© 2010 Douglas Hanna

Mozilla Labs: Ubiquity core developer, Jetpack Ambassador

mitcholinguist, coder, teacher

© 2010 Douglas Hanna

Mozilla Labs: Ubiquity core developer, Jetpack Ambassador

MIT: Linguistics PhD student

mitcholinguist, coder, teacher

© 2010 Douglas Hanna

mitcho.com @mitchoyoshitaka

Mozilla Labs: Ubiquity core developer, Jetpack Ambassador

MIT: Linguistics PhD student

The big question:

The big question:

hackability

the web should be generative

the browser should be generative

Firefox Add-ons

1. addons.mozilla.org (AMO)

2. over 6000 in the wild

3. HTML, JavaScript, XPCOM, XUL

Firefox Add-ons

1. addons.mozilla.org (AMO)

2. over 6000 in the wild

3. HTML, JavaScript, XPCOM, XUL

Firefox Add-ons

1. addons.mozilla.org (AMO)

2. over 6000 in the wild

3. HTML, JavaScript, XPCOM, XUL

Firefox Addons

+

Firefox Addons

+

largest extension platform ever

Firefox Addons

+

Firefox Addons

+

1.9 billion downloads

Firefox Addons

+

over 170 million in active use

but...

Current Add-ons

1. installs need restarts

2. not trivial to develop

3. requires manual upgrades

4. not designed for quick security review

Current Add-ons

1. installs need restarts

2. not trivial to develop

3. requires manual upgrades

4. not designed for quick security review

Current Add-ons

1. installs need restarts

2. not trivial to develop

3. requires manual upgrades

4. not designed for quick security review

Current Add-ons

1. installs need restarts

2. not trivial to develop

3. requires manual upgrades

4. not designed for quick security review

© John Slabyk

© John Slabyk

jetpack.mozillalabs.com

Jetpack

Jetpack

a new way to extend Firefox

Jetpack

a new way to extend Firefox

doesn’t replace XUL add-ons

It’s easy

1. JavaScript, HTML, CSS

• use your favorite libraries

• simple, modular API

2. instant install

3. great development tools

4. export to XPI

Jetpack

It’s easy

1. JavaScript, HTML, CSS

• use your favorite libraries

• simple, modular API

2. instant install

3. great development tools

4. export to XPI

Jetpack

It’s easy

1. JavaScript, HTML, CSS

• use your favorite libraries

• simple, modular API

2. instant install

3. great development tools

4. export to XPI

Jetpack

It’s easy

1. JavaScript, HTML, CSS

2. instant install

3. great development tools

4. export to XPI

Jetpack

It’s easy

1. JavaScript, HTML, CSS

2. instant install

3. great development tools

• built in memory tracker, unit testing

• IDE integration

4. export to XPI

Jetpack

It’s easy

1. JavaScript, HTML, CSS

2. instant install

3. great development tools

• built in memory tracker, unit testing

• IDE integration

4. export to XPI

Jetpack

It’s easy

1. JavaScript, HTML, CSS

2. instant install

3. great development tools

• built in memory tracker, unit testing

• IDE integration

4. export to XPI

Jetpack

It’s easy

1. JavaScript, HTML, CSS

2. instant install

3. great development tools

4. export to XPI

Jetpack

It’s secure

1. modularized “capabilities”

2. fast review

3. automatic updates

Jetpack

It’s secure

1. modularized “capabilities”

2. fast review

3. automatic updates

Jetpack

It’s secure

1. modularized “capabilities”

2. fast review

3. automatic updates

Jetpack

It’s built for the future

1. stable API

2. compatible with future versions

Jetpack

It’s built for the future

1. stable API

2. compatible with future versions

Jetpack

Jetpack

Jetpack

IDE integration?

Jetpack

IDE integration?

For example, an IDE on the web

DEMO:

tab control

Began with a blog post, May 2009

Now, an important dispatch from the mothership...

CC BY-NC-SA www.flickr.com/photos/joshmichtom/3846011713/

This is a prototype.

CC BY-NC-SA flickr.com/photos/the_pdub/4269928124/

Jetpackreboot

Jetpackreboot

SDK 0.2

Jetpackjetpack.mozillalabs.com

Jetpackjetpack.mozillalabs.comSDK 0.3

later this month, with first high-level API’s:“panel” overlays, context menu, selection, tabs

CC BY-NC-SA www.flickr.com/photos/razmataz/3933467547/

FirefoxXUL + XPCOM

CC BY-NC-SA www.flickr.com/photos/razmataz/3933467547/

youand your JavaScript

FirefoxXUL + XPCOM

CC BY-NC-SA www.flickr.com/photos/razmataz/3933467547/

youand your JavaScript

FirefoxXUL + XPCOM

CC BY-NC-SA www.flickr.com/photos/razmataz/3933467547/

youand your JavaScript

FirefoxXUL + XPCOM

CC BY-NC-SA www.flickr.com/photos/razmataz/3933467547/

youand your JavaScript

FirefoxXUL + XPCOM

CC BY-NC-SA www.flickr.com/photos/razmataz/3933467547/

Jetpack

the power of add-ons

Jetpack

the power of add-ons

the benefits of a modern,

webby api

Jetpack

+

the power of add-ons

the benefits of a modern,

webby api

Jetpack

+

easy, secure, future-proof

CC BY-NC-SA flickr.com/photos/terryhart/2979919447/

Jetpack workshoptoday 3:15–4:15

game room

© 2005 en.wikipedia.org/wiki/File:Rocket_man02_-_melbourne_show_2005.jpg

Welcome to the future.

© 2005 en.wikipedia.org/wiki/File:Rocket_man02_-_melbourne_show_2005.jpg

Welcome to the future.

Thank you!

by-nc-samitcho.com@mitchoyoshitaka