Web Info & Tutorials

September 18th, 2007

FACEBOOK RELEASED FBJS

Marcel Laverdet of Facebook blogged about the release of FBJS 1.0:

If you are already used to Javascript, you will find that most of the syntax and functionality that you have come to know and love (or hate) is available in FBJS. Additionally, we’ve created hooks into our higher-level AJAX and dialog implementations which allow you to easily create dynamic experiences while maintaining the look and feel of Facebook.

We hope that FBJS enables you to build deeply integrated Facebook Platform applications in new and interesting ways.

FBJS does munging on the JavaScript that you provide, as it tries to stop naughty things.

With respect to Ajax, they give you an object to work with that sits on top of XHR, and is proxied by Facebook servers:

FBJS supplies a very powerful AJAX object for developers. Facebook will proxy all AJAX requests and optionally run useful post-processing on the data returned, such as JSON, or FBML parsing. To use it, just instantiate a new Ajax class. It supports the following properties:

ondone(data) 
An event handler which fires when an AJAX call returns. Depending on .responseType, data will either be an object, a raw string, or an FBML string.
onerror 
An event handler which fires when an error occurs during an AJAX call
requireLogin 
If you set this to true the AJAX call will require the user to be logged into your application before the AJAX call will go through. The AJAX call will then be made with the regular fb_sig parameters containing the user’s identity. If they refuse to login, the AJAX call will fail.
responseType 
This can be one of Ajax.RAW, Ajax.JSON, or Ajax.FBML.

Ajax.RAW 
The response from your server will be returned to your callback in its original form.
Ajax.JSON 
The response from your server will be parsed as a JSON object and returned to your callback in the form of an object. Properties of your JSON object which are prefixed with “fbml_” will be parsed as individual FBML strings and returned as FBML blocks. These blocks can used on a DOM object with the setInnerFBML method.
Ajax.FBML 
The response from your server will be parsed as FBML and returned as an FBML block. This block can used on a DOM object with the setInnerFBML method.

And one method:

post(url, query) 
Start an AJAX post. url must be a remote address, and query can be either a string or an object which will be automatically converted to a string.

Here’s an example showing most of the functionality of Ajax:
Ajax Example

It is interesting to see more and more platforms wanting to open up and give users more abilities, but keeping the balance wrt security, privacy, and general abuse.

There are also rumors of new functionality to come, such as a data storage API.

September 18th, 2007

JPU: JAVASCRIPT CPU MONITOR

Andrea Giammarchi has built a little experiment. His JPU is a JavaScript CPU monitor based on single threading JavaScript behaviour.

You can go to a site that uses a lot of Ajax and paste in (or bookmark) javascript:(function(s){s.type='text/javascript';s.src='http://www.3site.eu/JPU/IJPU.js';document.getElementsByTagName('head')[0].appendChild(s)})(document.createElement('script'));

Then you can see the bars go high when you do something Ajax-y (e.g. drag and drop).

I wonder how things change when you use the WorkerPool. I put up a little example comparing running CPU intensive code inside the main browser UI thread, versus kicking it out to a WorkerPool piece of work.


September 18th, 2007

CURL.JS: CURL YOUR IMAGES

Christian Effenberger has a new effect for you to use. With Curl.js you can add a page curl effect (including backside mask) to images on your web pages.

It uses unobtrusive javascript to keep your code clean, and it works in all the major browsers - Mozilla Firefox 1.5+, Opera 9+,
IE6+ and Safari.

On older browsers, it’ll degrade and your visitors won’t notice a thing.

Includes also the scripting lib “cvi_curl_lib.js” for more advanced users.

All you have to do is include the JavaScript, and then add the right CSS classes to your images:

  • Initialisation class “curl
  • vary the size of the curl by adding isize followed by the desired size in percent:
    Curl size class “isize” - min=0 max=MinImageDimension default=33
  • vary the paperback color of the curl by adding icolor followed by the color:
    Curl color class “icolor” - min=000000 max=ffffff default=0
  • vary the shadow by adding ishadow followed by the opacity in percent:
    Curl shadow class “ishadow” - min=0 max=100 default=66

Curl

September 18th, 2007

ACTIVEGRID TRYING TO BECOME THE REDHAT OF AJAX?

Chris Keene of ActiveGrid has meet acquired TurboAjax, the Dojo agency bourgeois that has been featured on Ajaxian some nowadays for its calibre widgets.

Chris discusses the acquisition, and ground “the Ajax concern needs a RedHat to create a ordinary organisation and wage advertizement hold and upbringing behindhand an enterprise-ready toolkit.”

He outlines his issues with the unstoppered maker Ajax community:

  • Lack of advertizement support: without the availability of advertizement support, AJAX module not attain project adoption. With this acquisition, ActiveGrid module today defence behindhand both the TurboAjax products and the Dojo Toolkit.
  • Missing features: ordinary complaints around the Dojo toolkit allow demand of rank substantiation and burly samples. If AJAX toolkits are to be adopted, they requirement the aforementioned radiance as copyrighted solutions aforementioned Flex.
  • Inconsistent standards: as the locution goes, the pleasant abstract most AJAX standards is that there are so some to opt from. There is an ABC soup of Javascript libraries discover there, including JQuery, Prototype, Rico, Scriptaculous, Ext and YUI. Each of these takes a rattling assorted move to finding the aforementioned problem.
  • Security: don’t modify intend me started on the section challenges in an surround flooded of widgets, gadgets and 3rd band scheme services. Suffice it to feature that when this sway gets overturned over, lots of grotesque clog creepy-crawly things module move out.

Yet added warning of advertizement interests effort participating in attractive the modify school of the web, and disagreeable to attain a endeavor in the enterprise.

September 18th, 2007

IE’S MEMORY LEAK FIX GREATLY EXAGGERATED

We were all hoping that IE's memory leaks were fixed, but Joel Webber of the GWT team dug deeper . At first he was excited of course:

When I saw this article, I nearly spilled tea all over the keyboard. They really fixed this issue? You mean I can untangle all the painful code in GWT that works around this issue, diligently cleaning up all its circular DOM references under all sorts of circumstances?

And then he had a gut check:

Before I got too excited, I had to do a little gut-check. Did they really go back and make it possible for their garbage collector to chase references through COM objects? That would be wonderful, but I'm not holding my breath.

And it's a good thing, because there's basically no way in hell they did that. In fact, it turns out that all they did was write a little code to sweep the DOM on unload and clean up all the extant circular references on those elements. This means that *all elements not still attached on unload are still leaked, along with the transitive closure over all references Javascript objects*. In even marginally complex applications, that means you're still going to leak like a bloody sieve!

And finally he tested it with a script to prove that IE still throws out memory all over the shop. Some things are too good to be true.

Come on IE team. For awhile you were out in the open talking to the community, and then you went back into the black hole!

September 18th, 2007

AZA RASKIN’S CASE FOR UNDO

Aza Raskin, whose company created the Enso "Quicksilver-ish" PC launcher and the perpetual scrolling blog, wrote "Never Use a Warning When You Mean Undo" for A List Apart a few months ago, echoing the advice given by his father Jef Raskin in The Human Interface.

I don't think anyone refutes the wisdom of this suggestion, but many folks responded to Aza's article with the complaint that the implementation of undo is too hard to be generally feasible. Aza has now come back with his thoughts on a simple client-side implementation of undo for Ajax (part 1).

I admit I personally cut corners all the time in this matter, violating my own beliefs and issuing warnings. :-) Has anyone in the community had experience implementing a robust undo?