The second developer milestone of the next release of Firefox - code named Shiretoko Alpha 2 - is now available for download. Shiretoko is built on pre-release version of the Gecko 1.9.1 platform, which forms the core of rich internet applications such as Firefox. Please note that this release is intended for developers and testers only.

This Alpha of Shiretoko / Gecko 1.9.1 introduces several new features:

• Support for the HTML 5 <video> element
• Initial support for web worker threads
• You can now drag and drop tabs between browser windows
• New selector to create areas of Aero-style “glass” in XUL
• Support for CSS 2.1 properties: ::before and ::after, and white-space:pre-line
• Support for CSS 3 properties: -moz-border-image, word-wrap: break-word, text-shadow, box-shadow and column-rule
• Performance improvements and new preference values for color management profile support

Anyone interested in Shiretoko should read the release notes, as well as the “Firefox 3.1 For Developers” article on the Mozilla Developer Center before downloading. Please use the following links to download Shiretoko:

• Windows: Shiretoko Alpha 2 Setup.exe
• Mac OS X: Shiretoko Alpha 2.dmg
• Linux: shiretoko-alpha2.tar.bz2

We would appreciate hearing about any feedback you have, or any bugs you may find.

(Those interested in testing Mozilla’s new JavaScript engine “Tracemonkey” should note that it is not included in this development milestone. If you’re interested in that technology, please obtain a nightly build and follow these instructions)

One of the reasons Dion is such an effective editor here at Ajaxian is his sense for filtering all of the available news from the Ajax community down to about three stories a day. Truth-be-told, with all the submissions we get and what we find on our own, we could easily post 10 stories a day. But in today’s saturated environment, we find three stories is about the right number to keep from overwhelming our readership with too much noise. We hope you agree, and we’re interested in hearing if you feel otherwise.

A consequence of this arbitrary filtering is that some of the lesser known frameworks and libraries simply don’t get covered. We never try to be king-makers, nor do we have that kind of clout–we simply can’t cover everything.

We enjoyed Six Revisions’ recent round-up of 10 new/up-and-coming JavaScript frameworks, many of which we’ve never covered, like Midori, Archetype, JUNE, UIZE, Simple.js, and fleegix.js.

The adventurous among you should take a look! Not too long ago, an up-start named jQuery shook up the existing players… some of these may be next.

In the run up to The Ajax Experience conference coming up at the end of this month, Dion and I thought it would be fun to interview a few of the speakers. In this episode of Audible Ajax, we talk with Gavin Doughtie, a Dojo contributor and Google employee. The topics range from browser graphics to hiring good JavaScript engineers. Hope you enjoy it!

We have the audio directly available, or you can subscribe to the podcast.

We were all very impressed with the work that the 280 North team did with 280 Slides, and they fulfilled their promise by opensourcing Cappuccino and Objective-J under LGPL:

Cappuccino is an open source application framework for developing applications that look and feel like the desktop software users are familiar with.

Cappuccino is built on top of standard web technologies like JavaScript, and it implements most of the familiar APIs from GNUstep and Apple’s Cocoa frameworks. When you program in Cappuccino, you don’t need to concern yourself with the complexities of traditional web technologies like HTML, CSS, or even the DOM. The unpleasantries of building complex cross browser applications are abstracted away for you.

Cappuccino was implemented using a new programming language called Objective-J, which is modelled after Objective-C and built entirely on top of JavaScript. Programs written in Objective-J are interpreted in the client, so no compilation or plugins are required.

The team has done a good job doing what many opensource projects miss, giving documentation and discussion. It will be interesting to see how others take this work and produce compelling Web based products. Let us know if it is you!

The data grid above is a jQuery plugin jTPS that creates a table you can sort and page through, using nice animations, all via a simple call out:

1.  
2. $(document).ready(function () {
3. $(’#TABLETOCONTROL’).initTable( {perPages:[5,12,15,50,'ALL']} ).controlTable();
4. });
5.  

Selim Arsever wants to make it easier to great JavaScript games, so he created gameQuery, based on jQuery.

gameQuery allows you to declare animations, which are made of one image with a succession of frames just like in a css sprite. An animation in itself doesn't exist until it's associated with a sprite.

1.  
2. var myAnimation = new Animation({ imageURL: "./myAnimation.png", numberOfFrame: 10, delta: 60, rate: 90, type: Animation.VERTICAL | Animation.ONCE});
3.  

SitePen continues their work on Deft with a multi-file uploader:

The Dojo Toolkit now has support for multi-file uploads, thanks to the new Deft project. The dojox.form.FileUploader class embeds a hidden SWF file in the page which, when triggered, will open a system dialog that supports multiple file selection, and also file masks, which allows the user to filter their selection by file type.

Better yet, it’s fully degradable. If the user does not have version 9 or greater of the Flash Player installed it can, depending on the options you set, present the user with a standard HTML file input instead (or the option to install the latest Flash Player). The HTML form also supports multiple files, although due to browser restrictions, only one can be selected at a time. But they are all uploaded at once.

A major benefit to developers is the flexibility to supply your own styled upload button. For example, a paperclip icon toolbar button in an email application should not look like the standard file input with a text field followed by a “browse …” button. What inspired this design was working on projects where designers and clients would hand me a specification which would say, “the upload button looks like this“.

To use it? Fairly simple:

1.  
2. var uploader = new dojox.form.FileInputFlash({
3.         uploadUrl:"http.localHost/FileUpload.php",
4.         button:myButton,
5.         uploadOnChange: false,
6.         selectMultipleFiles: true,
7.         fileMask: ["All Images", "*.jpg;*.jpeg;*.gif;*.png"],
8.         degradable: true
9. });
10.  

Want to try it out?

This comes after the YouTube uploader that uses Gears.

Andi Gutmans announced Zend Framework 1.6 which includes the new Dojo support which they put to work on the site itself:

With this release we continue to provide enterprise-grade features with our new Zend_Soap component, which brings PHP-style simplicity to building and exposing SOAP web services. This component can operate in both WSDL and non-WSDL mode and makes creating or consuming a SOAP service a snap.

Preview of Tooling Project:

Zend_Tool is a component currently under development in the Zend Framework library. It provides services for generating and managing ZF-based projects. We are offering a preview release along with ZF 1.6 to collect feedback from users in a variety of environments and with different requirements. Please let us know how Zend_Tool works for you by visiting the Zend_Tool focus group site at http://tech.groups.yahoo.com/group/zf-tool/. We will also be posting an overview of Zend_Tool on the Zend Developer Zone within the next 24 hours.

Lucene 2.3 Index File Format Support:

Starting with 1.6, ZF supports version 2.3 of Lucene’s index file format. This update to the format allows segments to share a single set of doc store (vectors & stored fields) files, which enables faster indexing in certain cases. This also makes Zend_Search_Lucene compatible with the latest version of the Lucene project.

Zend_Session save handler for Database Tables:

This is a database independent adapter for use with Zend_Session. Saving sessions in the database may be used for supporting sessions which must be maintained across multiple servers or kept for logging purposes.

Paginator Component:

Zend_Paginator is a new component for displaying large data sets in groups of ‘pages’ on a website. It can paginate data from virtually any source, and it fetches data lazily to maximize performance and minimize memory use when the data set is particularly large (as is often the case with data stored in a relational database). Zend_Paginator comes with a few data source adapters out of the box, along with an interface for implementing additional data source adapters.

Figlet Support:

Zend_Text_Figlet can create large ascii-character-based text given a figlet font and a string to render. Although they’ve been around for a long time, Figlets are most useful for captchas nowadays, especially when a lightweight solution is required and/or bandwidth is constrained. In fact, the new captcha form element includes an adapter for figlets.

ReCaptcha Service:

ReCaptcha is a very cool service that provides text-based captcha images. The answers submitted to ReCaptcha help digitize printed books. The new captcha form element also includes an adapter for the ReCaptcha service. Read more about ReCaptcha here: http://recaptcha.net/learnmore.html.

Captcha Form Element:

A form element to render and validate captchas, which are commonly used to ensure a human is submitting a form and not a (potentially malicious) bot. The captcha form element is backed by several adapters for different captcha mechanisms, including GD-based graphics, figlets, and the ReCaptcha service. Users can implement their own adapters;each adapter takes care of validation and decorators to ensure the form element looks and behaves correctly, regardless of the captcha mechanism used.

Zend_Config_Xml Attribute Support:

XML attribute support has been added to Zend_Config_Xml that allows ZF developers to write smaller XML documents that are more human-readable. This attribute support is already seeing a lot of adoption inthe Zend_Tool project.

Zend_File_Transfer Component:

This is a new component used for transferring files from one machine to another over multiple protocols. It currently supports HTTP, with an adapter interface that can be implemented to support additional protocols in the future. This component also supports validation on the transferred file.

File Upload Form Element:

This component completes the HTML form element support in Zend_Form. Files can be chosen by the user, validated for properties such as size, and uploaded to the server simply by adding a file upload form element to your forms. The element utilizes Zend_File_Transfer internally to validate the uploaded file and move it to its final destination.

Zend_Wildfire Component with FireBug Log Writer:

Zend_Wildfire is a new component supporting the Wildfire protocol: http://www.wildfirehq.org/. This feature also adds a FireBug log writer to write server-side log events to a FireBug console. A specialized FireBug Zend_Db profiler is provided to log DB profiler data to the FireBug console, as well.

Media View Helpers (Flash, QuickTime, Object, and Page):

ZF 1.6 contains new view helpers for embedding Flash, QuickTime, Objects, and Pages in a view.

Zend_Translate adds the INI file format:

This addition adds to the long list of translation file formats it already supports.

Eric Lawrence posted on IE 8 security issues in the beta 2 release, which include:

Restricting document.domain

In Internet Explorer 7, the following set of calls would succeed:

1.  
2.     // initial document.domain is app1.example.com
3.     document.domain = "app1.example.com";  // 1. Domain property set to default value
4.     document.domain = "example.com";        // 2. “Loosen” domain
5.     document.domain = "app1.example.com";          // 3. “Tighten” domain
6.  

In Internet Explorer 8 and other browsers, the 3rd assignment will throw an exception, because app1.example.com is not a suffix of the then-current value, example.com.

Put simply, once you’ve loosened document.domain, you cannot tighten it.

Restricting Frame-Targeting

HTML5 also specifies the circumstances in which one frame is permitted to use the targetname parameter of a window.open() call to navigate another named frame or window.

The rules are meant to help prevent a window injection vulnerability. In a window injection attack, a malicious website in one browser frame attempts to “hijack” a frame or popup owned by a trusted webpage.

For instance, consider the scenario where http://contoso.com opens a popup window with the name helpPage.

1.  
2.     window.open("helpTopic.htm", "helpPage", "height=200,width=400");
3.  

If another page at http://evil.example.com attempts to hijack this window, like so:

1.  
2.     window.open("spoof.htm", "helpPage", "height=200,width=400");
3.  

…instead of navigating the helpPage window owned by Contoso.com, spoof.htm will instead open in a new browser window. While Internet Explorer 7 and 8 always show an address bar on every window, this new restriction makes window injection spoofs even less convincing.

MIME-Handling: Sniffing Opt-Out

As discussed in Part V of this blog series, Internet Explorer’s MIME-sniffing capabilities can lead to security problems for servers hosting untrusted content. At that time, we announced a new Content-Type attribute (named “authoritative”) which could be used to disable MIME-sniffing for a particular HTTP response.

Over the past two months, we’ve received significant community feedback that using a new attribute on the Content-Type header would create a deployment headache for server operators. To that end, we have converted this option into a full-fledged HTTP response header. Sending the new X-Content-Type-Options response header with the value nosniff will prevent Internet Explorer from MIME-sniffing a response away from the declared content-type.

For example, given the following HTTP-response:

1.  
2.     HTTP/1.1 200 OK
3.     Content-Length: 108
4.     Date: Thu, 26 Jun 2008 22:06:28 GMT
5.     Content-Type: text/plain;
6.     X-Content-Type-Options: nosniff
7.  
8.     <html>
9.     <body bgcolor="#AA0000">
10.     This page renders as HTML source code (text) in IE8.
11.     </body>
12.     </html>
13.  

XSS Attack Surface Reduction: CSS Expressions Disabled IE8 Standards Mode

Also known as “Dynamic Properties,” CSS expressions are a proprietary extension to CSS that carry a high performance cost. CSS Expressions are also commonly used by attackers to evade server-side XSS Filters.

As of Beta 2, CSS expressions are not supported in IE8 Standards Mode. They are still supported in IE7 Strict and Quirks mode for backward compatibility. While the IE8 XSS Filter can block attempts to reflect CSS Expressions as part of an XSS attack, blocking them in IE8 Standards Mode brings a performance benefit, improves standards-compliance, and acts as an attack surface reduction against script injection attacks.

There have been some clever tricks to create new custom tags in Internet Explorer, such as the createElement trick. However, I never realized that Internet Explorer itself provides a facility to define new tags in the markup and have them styled, since Internet Explorer 5!

Some details from the MSDN documentation on this feature, titled "Using Custom Tags In Internet Explorer". The trick lies in making sure you namespace things. For example, in the MSDN docs for this feature the example of creating a new JUSTIFY tag is given:

You can even style this with CSS!

The docs then go on to discuss applying an Internet Explorer 'behavior' to this custom element to give it expanded abilities:

Custom tags become much more interesting when applied with a DHTML behavior. Introduction to DHTML Behaviors (or behaviors) are applied to elements on a page, the same way styles are, using cascading style sheets (CSS) attributes. More specifically, the proposed CSS behavior attribute allows a Web author to specify the location of the behavior and apply that behavior to an element on a page.

Using DHTML in Internet Explorer 4.0.0, it is possible to create simple animated effects, such as flying text, by manipulating the position of elements on a page over time. Beginning with Internet Explorer 5, this functionality can be encapsulated in a behavior, applied to a custom <InetSDK:FLY> tag, and wrapped around blocks of text on a page. This can be applied to cause text to fly from various directions.

I'm going to do more testing on this functionality today to see how deep it goes, but if true it makes it easier to create browser shims for Internet Explorer for things like SVG, MathML, etc., including HTML 5 (if we namespace the HTML 5 elements, required to get this to work).

The reason I'm looking for an alternative to the createElement trick is I've found that it doesn't work with nested custom tags, which limits its usefulness. For example, I've found the following to not enter the DOM correctly:

1. <html>
2. <body>
3.   <custom_container>
4.      <custom_child></custom_child>
5.   </custom_container>
6. </body>
7. </html>
8.  

Brendan Eich jumped right in and benchmarked the tip of tree for TraceMonkey, with the V8 version that came with Google Chrome:

We win on the bit-banging, string, and regular expression benchmarks. We are around 4x faster at the SunSpider micro-benchmarks than V8.

This graph does show V8 cleaning our clock on a couple of recursion-heavy tests. We have a plan, to trace recursion (not just tail recursion). We simply haven’t had enough hours in the day to get to it, but it’s “next”.

Brendan shows SunSpider running there, and V8 has that and other benchmarks to run too. Isn’t it great when a performance arms war is on? Thank god for competition here. We all win.

Ray Cromwell ran tests himself, on his own app Chronoscope (note, probably NOT using tip of tree TraceMonkey):

Chronoscope is written in GWT, and to some extent, the GWT compiler may negate some of Chrome’s V8 technology in the sense that GWT “de-classes” many OO polymorphic dispatches into a more functional style of programming, removing as much dynamic dispatch as possible, and eliminating prototype lookups and function call overhead through inlining. I don’t know if GWT hurts “hidden classes” or not, but it might be possible that if GWT didn’t provide such optimizations, the performance differential might be larger.

Despite this, the results are still good. The test consisted of calling the chart’s redraw() function 100 times per trial, with 10 trials. The slowest and fastest trial are thrown out, and the mean and standard deviation are calculated on the remaining data.

I tested on a Mac Pro 2.66Ghz with 6Gb of memory, OSX 1.5. The tests were conducted within a Parallels VM running XP2 Service Pack 2, given 2 CPUs and 2Gb of memory. For each browser, I rebooted the VM from a clean start, and ran only the test browser.

And for a bit of fun, Marc-Andre Cournoyer tied together HotRuby (remember that? the beast that runs YARV code in the browser!) and V8 to create fast Ruby in the browser.

Good times.

Everyone knows that the big news of the week is Google Chrome, Chromium, and V8. Ben and I sat down for our podcast update and delve deeper at how all of the browsers are doing interesting things and progressing nicely. We discuss SquirrelFish, TraceMonkey, and of course V8.

We also delve into Canvas land and the fun and frolics that are planned for The Ajax Experience in Boston that happens soon. I am excited about the framework mini-events that happen around the same time too, and gather the crew behind jQuery, Dojo, and Prototype.

We have the audio directly available, or you can subscribe to the podcast.