Archive for the 'JavaScript' Category

Sputnik gets more tests; How compliant are the browsers?

The Chromium folk have posted about JavaScript conformance as they release a test runner for Sputnik, that allows you to easily run the complete test suite from within your browser:

Sputnik touches all aspects of the JavaScript language defined in the 3rd edition of the ECMA-262 spec. In many ways it can be seen as a [...]

A deep dive and analysis of the JavaScript Module pattern

Ben Cherry has a really nice detailed analysis of the module pattern.
He starts with the simple pattern that Crock-y documented back in the day….. and then goes on to discuss augmentation (loose and strict) and then deeper into some cool patterns:

Cloning and Inheritance
PLAIN TEXT
JAVASCRIPT:

 

var MODULE_TWO = (function (old) {

    var my = {}, [...]

YQL Geo library – all your geo needs in pure JavaScript

I just finished doing some talks on geo hacking (slides are available here) and how to use some of the Geo technologies Yahoo and Google provide as part of a University gig in Atlanta.
As a lot of the students liked the idea of APIs like GeoPlanet and Placemaker but had a hard time getting [...]

modulr: a CommonJS module implementation in Ruby for client-side JavaScript

modulr is a CommonJS module implementation in Ruby for client-side JavaScript

Ruby? what does that have anything to do with it? Ah, its from one of those Prototype guys isn’t it…. Yup, Tobie is at it again, this time with modulr:

modulr accepts a singular file as input (the program) on which is does static analysis to [...]

Mozilla JägerMonkey: Method based JIT + Trace based JIT = speed

David Anderson: “TraceMonkey has rocket boosters, so it runs really fast when the boosters are on, but the boosters can’t always be turned on.”

Opera’s new JIT compiler Carakan is doing well as we just posted. What is Mozilla doing with TraceMonkey? A lot.
Mozilla JägerMonkey adds method based JIT (of V8 and Nitro fame) to keep [...]

EnhanceJS: A library to progressively enhance

EnhanceJS is a new library from the Filament Group, who are serious about progressive enhancement and accessibility.
What is EnhanceJS?

EnhanceJS is a new JavaScript framework (a single 2.5kb JavaScript file once minified/gzipped) that that automates a series of browser tests to ensure that advanced CSS and JavaScript features will render properly before they’re loaded to the [...]

jsFiddle: a Web playground

Piotr Zalewa has created a really great playground, jsFiddle, for testing sample code and playing with the Web. With an area for the holy trinity of the Web (HTML, CSS, JS) and an output region, you can get right to hacking.
It goes beyond this though. You can also add resources, an Ajax echo backend, and [...]

jQuery 1.4.2: performance and a few APIs

jQuery 1.4.2 has been released today and it comes with some performance bumps (aggressive ones according to Taskspeed). Benchmarks are challenging, and John even calls that out:

For example, we saw significant overall performance speed-ups in Taskspeed simply by optimizing the $(”body”) selector because it’s called hundreds of times within the tests. Additionally we saw large [...]

TeX line breaking algorithm in JavaScript

Bram Stein has done some really fun work. He has taken the Knuth and Plass line breaking algorithm and implemented it using Canvas:

The goal of this implementation is to optimally set justified text in the new HTML5 canvas element, and ultimately provide a library for various line breaking algorithms in JavaScript.

You can see the subtleties [...]

Quicksand: transition and filtering effect

Jacek Galanciak has created a nice visual transition library, Quicksand, that filters and shows a set of data in an interesting way.
The jQuery plugin has you quickly calling quicksand like this:
PLAIN TEXT
JAVASCRIPT:

 

$(’#source’).quicksand( $(’#destination li’) );

 

and you have the data to transition between:
PLAIN TEXT
HTML:

 

<ul id=”source”>

    <li data-id=”iphone”>iPhone OS</li>

    <li data-id=”android”>Android</li>

    <li data-id=”winmo”>Windows Mobile</li>

</ul>

 

<ul [...]