The Future of
Firefox and JavaScript
John Resig (ejohn.org)
Mozilla Corporation / jQuery JavaScript Library
October 3rd, 2007 - Future of Web Apps

The Future of Firefox
Graphics
✦
✦ SVG
✦ Canvas
Video and Audio
✦
Offline Web Applications
✦
XMLHttpRequest++
✦
Desktop Integration
✦

SVG
SVG Foreign Object
✦
✦ Import normal HTML elements
✦ Demo: http://starkravingfinkle.org/blog/2007/07/firefox-3-svg-foreignobject/
Speed Improvements in the pipeline
✦
✦ Joost built on Mozilla platform

Canvas 3D

Canvas 3D
Works like normal 2D Canvas
✦
Thin layer to OpenGL
✦
Can embed native shader scripts
✦
✦ Run natively by the GPU
Extension: http://people.mozilla.com/~vladimir/canvas3d/
✦

Shader Scripting
<script type=”x-shader/x-fragment”>
✦
void main(void) {
gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0);
}
</script>
<script type=”x-shader/x-vertex”>
attribute vec4 myVertex;
uniform mat4 myPMVMatrix;
void main(void) {
gl_Position = myPMVMatrix * myVertex;
}
</script>

<video/> and <audio/>
Pioneered by Opera
✦
Generic means of playing video and audio
✦
Full JavaScript API
✦
Guaranteed to play, at least, Ogg Theora
✦
Plugin more video/audio types
✦
Demo: http://www.double.co.nz/video_test/
✦

Offline Web Apps
Very new territory
✦
Three Specs:
✦
✦ Mozilla
✦ Google Gears
✦ WHATWG
Working to converge!
✦
✦ A final amalgam will be in Firefox 3

Offline Web Apps
Global Storage
✦
✦ Cookies++
File caching (CSS, Images, etc.)
✦
offline/online-mode detection
✦
File Uploads Queueing
✦
Some SQL-like stuff (work in progress)
✦

XMLHttpRequest++
Cross-domain XMLHttpRequest
✦
✦ Already landed, in Firefox 3
JSON (De-)Serialization
✦
✦ object.toJSONString();
✦ string.parseJSON();

Desktop Integration
Webrunner
✦
✦ Deployable web applications
✦ (Built on XULRunner)
Prism (Still in Planning)
✦
✦ Webrunner in Firefox
✦ Bookmark puts an icon on the desktop
✦ Launches a dedicated application

The Future of JavaScript
“Old” Versions:
✦
✦ Firefox 1.5: JavaScript 1.6
✦ Firefox 2.0: JavaScript 1.7
New Versions:
✦
✦ Firefox 3: JavaScript 1.8
✦ Firefox 4 (?): JavaScript 2
Virtual Machines
✦
Server-Side JavaScript
✦

JavaScript 2
Optional Type Annotation
✦
✦ var foo : string = “”;
✦ type Pair = [ int, string ];
✦ var bar : Vector.<Pair>;
Classes
✦
✦ class User {
var name : string;
var age : int;
}

JavaScript 2
Block-Scoped Variables
✦
✦ let foo = “test”;
Packages
✦
✦ package com.mozilla.Foo;
import com.jquery.query;
query(“div”);
Dictionaries
✦
✦ Map.<*, int>

Tamarin
Tamarin
✦
✦ New Virtual Machine from Adobe
✦ Perfect for ActionScript
✦ (a mutant cousin of JavaScript 2)
The Three Monkies:
✦
✦ ActionMonkey
✦ ScreamingMonkey
✦ IronMonkey

Three Monkies
ActionMonkey
✦
✦ Integrating Tamarin into SpiderMonkey
✦ Powering Firefox 4 (?) + JavaScript 2
ScreamingMonkey
✦
✦ Forcing Tamarin into Internet Explorer
✦ (Kicking and screaming?)
IronMonkey
✦
✦ Bringing Python + Ruby to Tamarin

Server-Side JavaScript
As old as JavaScript itself
✦
Seeing a strong resurgence
✦
Web Application Dev:
✦
✦ Helma
✦ Phobos
Application Dev:
✦
✦ Spidermonkey
✦ Rhino

Rhino
JavaScript implemented in Java
✦
✦ Full JS 1.6 Support
✦ Upcoming JS 1.7 Support
Full access to Java packages
✦
Weird fun:
✦
✦ var myString = new java.lang.String();
Awesome new territory:
✦
✦ var myThread = new java.lang.Thread();
DOM to the Server
✦

Questions, et. al.
Bright future! Enjoy!
✦
John Resig
✦
http://ejohn.org/