You are on page 1of 19

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/