Can JavaScript performance become a big selling point for browser acceptance? That’s what Jeff Atwood is speculating as he put several browsers through the WebKit SunSpider JavaScript Benchmark. The tests evaluate the performance of a browser’s implementation of JS language only and claims to be a real world, balanced and statistically sound testing suite.

Jeff put IE 7, Firefox 2, Opera 9.5 & Safari 3.0.4 through the benchmark to determine who had the best performance.

Image from Jeff Atwood’s posting.

What surprised me here is that Firefox is substantially slower than IE, once you factor out that wildly anomalous string result. I had to use a beta version of Opera to get something other than invalid (NaN) results for this benchmark, which coincidentally summarizes my opinion of Opera. Great when it works! I expected Opera to do well; it was handily winning JavaScript benchmarks way back in 2005. The new kid on the block, Safari, shows extremely well particularly considering that it is running outside its native OS X environment. Kudos to Apple. Well, except for that whole font thing.

More results are available for review here and you can run your own benchmark tests via WebKit’s SunSpider site.

When the news broke that DWR had joined the Dojo Foundation, it left a lot of questions regarding the future of the DWR framework. Joe Walker aims to address the future of DWR in his recent post, DWR: State of the Union.

So DWR is now part of the Dojo Foundation. I thought it would be good to quickly summarize where we are, and what I’m working on, and to give everyone a chance to comment.

DWR 2.0 has been out for 6 months or so. At the time, I swore that the next release would be a small one, called 2.1. However it appears that I’m not good at swearing because there is lots in the next release - I think we’re going to have to call it 3.0.

The next release of DWR looks feature rich adding enhanced JSON support and Gears integration among other things.

All of the upcoming updates to DWR v3.0 are detailed by Joe in his post.

With all of the press surrounding Adobe AIR, I’m sure many of you have been chomping at the bit to give it a go. Jonathan Snook shows you how in his tutorial, Christmas Is In The AIR. AIR is Adobe’s answer to leveraging existing web technologies for building desktop applications and it’s a cool bit of technology. Jonathan walks you through all of the basic steps of setting up your development environment for the AIR SDK, explaining the file dependencies and discussing AIR’s Sandbox Security model. One of the coolest parts of the tutorial, though, is when he shows how to store data via the AIR API:

You’ve essentially got 4 different ways that you can store data:

• Using the local database. AIR comes with SQLLite built in. That means you can create tables and insert, update and select data from that database just like on a web server.
• Using the file system. You can also create files on the local machine. You have access to a few folders on the local system such as the documents folder and the desktop.
• Using EcryptedLocalStore. I like using the EcryptedLocalStore because it allows you to easily save key/value pairs and have that information encrypted. All this within just a couple lines of code.
• Sending the data to a remote API. Our to-do list could sync up with Remember the Milk, for example.

To demonstrate some persistence, we’ll use the file system to store our files. In addition, we’ll let the user specify where the file should be saved. This way, we can create multiple to-do lists, keeping them separate and organized.

The application is now broken down into 4 basic tasks:

1. Load data from the file system.
2. Perform any interface bindings.
3. Manage creating and deleting items from the list.
4. Save any changes to the list back to the file system.

This tutorial is really a good read and would highly recommend it to anyone who wants to get a headstart with Adobe AIR.

Reposted from my personal blog entry on ChartMaker.

I had an 11 hour flight from London to SFO. What was I going to do? I had a couple of books with me. The in-flight movies were average, and even in business class they didn’t have the on-demand system, so if you missed the start you had to wait for the next go around. I poked around in a DVD store and couldn’t find anything to interest me, so I ended up grabbing ‘Heroes’ since I had never seen it. I was put off by the “Save the cheerleader, save the world” commercials, but figured if it was half decent then there was a lot of material (e.g. time) to cover.

So, I popped in the DVD, and whilst I watched, I opened up Firefox and Textmate.

I have been wanting to play around with the new Ext 2.0 release, and also with the GWT-Ext package. Unfortunately, that module isn’t using Ext 2.0 quite yet (almost!), so I decided to do a first rev of the tool with straight Ext 2.

I found the new Google Chart API to be a little addicting, and some people have asked if there was a tool for people to create charts, instead of having to munge with URLs.

A common use case is to dynamically generate the charts on the fly, and then it makes sense to just build the URls and you are done. But, what if you wanted to sit back and just throw out a chart or two?

This is where ChartMaker (code) comes in.

The tool has you fill out core information about the graph or chart that you want to create (e.g. size and title), you then choose the type of chart in the tabs, and you fill out the data needed for that type of chart. You can click on the “seed data” button to see sample data, and when you are done tweaking it, you click on “GET CHART”. That action causes a preview to be loaded below, and you get given the URL in a text box that you can copy and paste.

It is a little rough around the edges in that I wanted to let you tab though fields and have an easy way to add rows of data (instead of just using a crude textarea). I also need to make it so that all of the data can be expressed through the UI (e.g. marker types, colors, fills, etc) which isn’t the case now.

I really enjoyed Ext 2. They did a great job, and with more documentation and such to come, I think it is a great library for building these desktop-like environments.

The UI was basically defined via:

Then each section used the “region” metadata to tell the system where to place it. You are also able to do things like tell the system you can be moved around, collapsible, and more.

So, the result of a few hours with Ext 2 with no access to the online docs and you get this:

We blogged about the Gmail helper API in November, and the good folks at Remember The Milk have used the API to add tasks to the Gmail interface in a nice mashup:

Yup, that’s RTM in there! Remember The Milk for Gmail is a Firefox extension that lets you do all kinds of crazy cool things with your tasks (and interacts with your mail, contacts, and calendar too).

It goes beyond letting you manage your tasks, as you can connect tasks with your mail, google calendar, and contacts.

Watch the screencast to see it in action.

Christian Effenberger has doubled up to release Mapper.js 1.0, a library that allows you to add automatic area highlighting to image maps
on webpages. It uses unobtrusive javascript to keep the code clean.

It works in all the major browsers - Mozilla Firefox 1.5+, Opera 9+,
Safari and IE6+. On older browsers, it can use “jsgraphics” from
Walter Zorn (if installed), else it’ll degrade and visitors won’t
notice a thing.

You are able to create an image map, and then define the colors through the simple CSS class microformat:

Dean Hachamovitch, General Manager of the IE team, has posted that IE 8 now renders the Acid 2 face:

I’m delighted to tell you that on Wednesday, December 12, Internet Explorer correctly rendered the Acid2 page in IE8 standards mode. While supporting the features tested in Acid2 is important for many reasons, it is just one of several milestones for the interoperability, standards compliance, and backwards compatibility that we’re committed to for this release. We will blog more on these topics. Here’s a relevant video.

For IE8, we want to communicate facts, not aspirations. We’re posting this information now because we have real working code checked in and we’re confident about delivering it in the final product. We’re listening to the feedback about IE, and at the same time, we are committed to responsible disclosure and setting expectations properly. Now that we’ve run the test on multiple machines and seen it work, we’re excited to be able to share definitive information.

While blog posts and links to videos are a good start, publicly available code is even better. We will have a lot more information available at sessions at MIX08 and will release a beta of IE8 in the first half of calendar 2008.

Mary Jo Foley got on the phone with Dean where she found out:

Hachamovitch also said that Microsoft will release a public beta build of IE 8 some time in the first half of 2008.

Internal Microsoft IE 8 build passes the Acid standards testHachamovitch denied that Microsoft’s decision to disclose this week IE 8’s planned standards compliance was related to Opera’s antitrust suit launched last week. Hachamovitch said Microsoft has been working on making IE 8 Acid2-compliant since IE 8 planning began.

With all of the press surrounding Adobe AIR, I’m sure many of you have been chomping at the bit to give it a go. Jonathan Snook shows you how in his tutorial, Christmas Is In The AIR. AIR is Adobe’s answer to leveraging existing web technologies for building desktop applications and it’s a cool bit of technology. Jonathan walks you through all of the basic steps of setting up your development environment for the AIR SDK, explaining the file dependencies and discussing AIR’s Sandbox Security model. One of the coolest parts of the tutorial, though, is when he shows how to store data via the AIR API:

You’ve essentially got 4 different ways that you can store data:

• Using the local database. AIR comes with SQLLite built in. That means you can create tables and insert, update and select data from that database just like on a web server.
• Using the file system. You can also create files on the local machine. You have access to a few folders on the local system such as the documents folder and the desktop.
• Using EcryptedLocalStore. I like using the EcryptedLocalStore because it allows you to easily save key/value pairs and have that information encrypted. All this within just a couple lines of code.
• Sending the data to a remote API. Our to-do list could sync up with Remember the Milk, for example.

To demonstrate some persistence, we’ll use the file system to store our files. In addition, we’ll let the user specify where the file should be saved. This way, we can create multiple to-do lists, keeping them separate and organized.

The application is now broken down into 4 basic tasks:

1. Load data from the file system.
2. Perform any interface bindings.
3. Manage creating and deleting items from the list.
4. Save any changes to the list back to the file system.

This tutorial is really a good read and would highly recommend it to anyone who wants to get a headstart with Adobe AIR.

Dimitri Glazkov has made a prediction that we will see CSS Grid Positioning in IE 8. This would make a lot of sense due to the fact that:

• Alex Mogilevsky, and Markus Mielke, of Microsoft wrote the spec
• If Microsoft comes out with a browser that goes above and beyond, they will be able to get rid of the monkey on their back
• CSS grids are painful right now!

This module allows you to create a layout like this:

with:

It can be seen as a grid with 6 vertical lines and 2 horizontal lines.

We can use the grid lines to position the floating image

The statement “float:page top right” here positions the image at the top right corner of the page (as defined in [CSS3GCPM])

“width:3gr” makes image 3 “grid units” wide, where a “grid unit” is the distance between two adjacent grid lines. Each boundary between a column and a gap automatically produces a grid line, therefore to specify “two columns, including the gap between columns, but not including any gaps outside the columns” we can just say “3gr”.

You will see more detailed examples, with lots of gr’s (grid units).

Gino Cochuyt spent some hours to find the cause of memory leaks in IE when using instanceof.

He found at least 3 Objects that cause the memory leaks:

• window
• document
• element

Just using - if (window instanceof Object) - for example causes a memory leak! that grows by 50 KB per refresh; the reason for this is because these 3 Objects are not really objects in IE (they don’t have a constructor); the same reason why they don’t have the Native Object methods:

• hasOwnProperty
• valueOf

where in other Browsers like FF, Opera and Safari … (the ones that i tested!)
a div elemement for example is an instanceof HTMLDivElement - HTMLElement - Node etc..

To prevent these memory leaks: