Opera Releases Firebug Competitor - Dragonfly

opera_dragonfly

For web developers, the Firefox extension Firebug is a killer app and major time saver. It lets you deconstruct the page currently loaded into Firefox to get a better idea of how HTML, CSS, and JavaScript needs to be modified to work properly (even allowing live changes to CSS/HTML on the fly).

Opera has just released an alternative set of developer tools called Dragonfly. They will be automatically included in Opera 9.5 beta 2 and newer versions of the browser, and you will be able to enable them by going to "Tools > Advanced > Developer Tools".

The Norwegian software producer is highlighting several innovative features of Dragonfly that could give it an advantage over Firebug, all depending on how well they work.

Dragonfly will make it possible to debug web pages whether they’re on your desktop computer or any remote device, like a mobile phone, that runs the Opera browser. This has the potential to make development for mobile devices much easier.

To JavaScript developers’ delight, Dragonfly will display the most up-to-date document object model (DOM) of a page, not just its initial construction. This means the effects of dynamic changes to a page, whether Ajax-driven or not, will now be much more transparent and traceable.

Dragonfly is also said to have a sophisticated JavaScript debugger that lets you diagnose errors on a line-by-line basis. JavaScript notoriously lacks any real debugging capabilities so this feature holds a lot of promise for developers tired of inserting alert functions throughout their code to see where it breaks.

A couple downsides: it will only be available for Opera, certainly not one of the most widespread browsers, and it won’t initially support in-browser edits to CSS styles. This latter shortcoming is a big one since CSS editing constitutes perhaps the most useful feature of Firebug.

Dragonfly will be released as open source under the BSD license. Microsoft announced at MIX that it has also worked on a set of developer tools for Internet Explorer 8, still in early beta.

Tags: , , , , ,

HTML5 Media Support

WebKit keeps on trucking and has added support for the HTML 5 media tags such as <video> and <audio>.

You can add a video to a page as easily as:

That is a lot nicer than the mess of embed/object/javascript wrappers that we have today. Also, there is nice scripting support so you can play/pause a video:

You can also tie into events:

and programatically do your thing:

One key issue has always been the codec game and royalties to mpeg.

Tags: , ,

OpenSocial: Social Javascript

This is a site about technology for developers, so I won’t get into any politics on OpenSocial and Facebook. There is already more coverage on that than you could want to read.

How is a social API interesting to Ajax developers? The main interface to the social data is through JavaScript. You can also use REST to hit the endpoints themselves, but the JavaScript API is very much the first class citizen.

If you are used to the Google Gadgets API you will probably be most familiar. Social components just have to include a one liner to their ModulePrefs:

This tells the container that you will be doing social tasks. There are three main APIs that you now have access too:

You will probably want to grab some social data which requires you to setup a request and grab data:

When you want to work with user data such as preferences, you will use the storage api. Here is an example from WoShamBo:

Read the rest of this entry »

Tags: , , , , , ,

Creative Commons Attribution-NonCommercial-ShareAlike 2.0 UK: England & Wales
Creative Commons Attribution-NonCommercial-ShareAlike 2.0 UK: England & Wales