The JavaScript blog.


webkit node modules unix url

Node Roundup: 0.6.16, Node WebKit Agent, URLify, crud-bones, frontail

Posted on .

You can send in your Node projects for review through our contact form or @dailyjs.

Node 0.6.16

The latest stable release of Node is out: 0.6.16. V8 has been upgraded to, and there are improvements for each platform.

Dave Pacheco also posted about profiling Node with DTrace, but be forewarned that this is probably only useful if you're able to run code on OpenSolaris-derived illumos systems. I actually use DTrace in Mac OS for debugging things that aren't related to Node, but Dave notes that this won't work due to the lack of ustack helpers, and invites readers to contact Apple about this:

OS X supports DTrace, but not ustack helpers. The way to get this changed is to contact your Apple developer liason (if you're lucky enough to have one) or file a bug report at bugreport.apple.com. I'd suggest referencing existing bugs 5273057 and 11206497. More bugs filed (even if closed as dups) show more interest and make it more likely Apple will choose to fix this.

Node WebKit Agent

Node WebKit Agent (npm: webkit-devtools-agent) by Camilo Aguilar is an implementation of the Chrome developer tools protocol. This allows WebKit browsers to debug Node applications, which includes profiling, a console, and network monitoring.

A related project that I've used a few times is Node Inspector.


URLify (License: MIT, npm: urlify) by Enno Boland helps convert UTF-8 strings to ASCII that's safe to use as a readable URL segment. For example:

var urlify = require('urlify').create({  
  spaces: '_'
, nonPrintable: '_'
, trim: true

urlify('竹取物語 Taketori Monogatari');  
// Taketori_Monogatari


crud-bones (GitHub: alexeypro / crud-bones) by Alexey Prohorenko is a boilerplate for Express-based apps that use MySQL, Mongo, or Redis. He's also dotCloud and Heroku deployment instructions.



frontail (License: MIT, npm: frontail) by Maciej Winnicki is a WebSocket-based tail-inspired utility for watching logs. Imagine a version of tail that runs a little web server instead of writing to standard IO. It has some command-line options as well -- for example, -n <number> will control how many lines are printed when it starts up.


libraries JSON webkit webgl

Sprite3D, Fayer, STD-Rest

Posted on .


Sprite3D (GitHub: boblemarin / Sprite3D.js, License: MIT)
by Emeric Florence is a JavaScript API that wraps around CSS 3D
transforms to make creating 3D animations and sprite handling a lot
easier. The site has a lot of examples (I like Sprite
and Canvas

Sprite3D's API allows chaining:

new Sprite3D(element)
  .setPosition(x, y, z)
  .setRotation(x, y, z)

In this example, update() will apply the position and
rotation values to the element passed to the constructor. The Sprite3D

shows all of the other transforms and methods.

According to the author:

As you manipulate "real" HTML elements, you don't need a Canvas object (and its performance problems), nor a WebGL-enabled browser. And, as 3D transforms are hardware-accelerated, you can get a very decent framerate, even on (Apple's) mobile devices.

This is an interesting point, because a lot of people have been
frustrated at Canvas performance on iOS. Given the author's background
in AS3, perhaps this library will appeal to Flash developers looking to
build interactive content for mobile WebKit browsers?


Fayer (License: dual MIT/GPLv2) is a library that helps selectively execute functions based
on the current "page". The current page is determined based on a body

// Given 

fayer.on('page-home', function() {
  // code for homepage goes here

This doesn't require jQuery and is a very lightweight library. Fayer
would come in handy when working on a project with monolithic
client-side JavaScript, although I find myself using libraries like
LABjs these days.

STD Rest

STD Rest (or API Kit) by Richard Lyon is an attempt to provide a standard API format using JSON
that can be accessed using the same API in multiple languages. The
author has written prototype implementations in CoffeeScript and PHP.

Richard hopes to make a universally readable format that can be applied
to any JSON REST API. To see if this is realistic, he's testing it with
Last.fm, Twitter, LinkedIn, and Qwerly. Although he notes that:

[I need to] figure out flexible authentication scheme (OAuth is easy if everyone would just implement it please?)

Chance would be a fine thing!

lastfm.json file illustrates how the project works. The service is described in
JSON, and this includes API methods, authentication, validation, and
error handling. This sounds suspiciously like WSDL, and the author
addresses this comparison in the project's README.


libraries webkit design templating forms

Jade Browser, iScroll, VM Form Validator

Posted on .

Jade Browser

Jade Browser by Jonah Fox is an attempt to get Jade templates to work in
browsers. The same author wrote
brequire which helps load CommonJS modules in browsers, so it seems like Jade Browser wraps around the
standard Jade library rather than reimplementing it.


Hugh Fraser sent us a link to iScroll by
Matteo Spinelli, which is a WebKit library for creating iOS native
styled tables with correct scrolling behaviour. It has quite a lot of
features, including pinch to zoom gesture support, custom scrollbars,
pull to refresh, and a paginated carousel.

It doesn't depend on jQuery, so you could use it with your favourite
mobile framework.

Given a few divs and an unordered list, it can be used like this:

myScroll = new iScroll('wrapper');

VM Form Validator

VM Form Validator
by Benjamin Kuker is a new form validation library for MooTools 1.3. All
of the VM Form Validator

are created with jsFiddle, so it's easy to see how it works.

Basic usage is like many form libraries out there:

var form1 = new VMFormValidator('register');
form1.required('username', 'You must enter a username');
form1.minLength('username', 5);
form1.noMatches('password', 'username');
form1.matches('confirmPassword', 'password');        

We don't usually feature many non-jQuery libraries here, but I am
interested in them so please share your stuff!


webkit server dependencies loading games

PhantomJS, load.js, Phantom Limb, OpenOdyssey

Posted on .


PhantomJS by Ariya Hidayat is a WebKit-based JavaScript tool for exploiting the power of WebKit. Let's
say you want to generate a PNG from an SVG file:

if (phantom.state.length === 0) {
  if (phantom.args.length !== 2) {
    console.log('Usage: rasterize.js URL filename');
  } else {
    var address = phantom.args[0];
    phantom.state = 'rasterize';
    phantom.viewportSize = { width: 600, height: 600 };
} else {
  var output = phantom.args[1];

This will produce a PNG when run through phantomjs on the
command line:

phantomjs rasterize.js http://ariya.github.com/svg/tiger.svg tiger.png

This example is from the PhantomJS

What really interests me about this project is generating nice PDFs from
HTML. WebKit has been ported to quite a few platforms, and PhantomJS
should run on Linux, Windows, and Mac OS X, so it could be a great tool
to have on your server.


load.js by Chris O'Hara is a small lazy-loading and dependency management library:

load('jquery.js').then('jquery-ui.js', 'jquery-ui-theme.js')
  .thenRun(function () {


I like the chained API, which just so happens to be created with
chain.js by the same author.

Phantom Limb

Phantom Limb by Brian Carstensen makes desktop browsers to simulate touchscreen device events:

A mousedown fires a touchstart. A mousemove fires a touchmove if the mouse is down, and a mouseup fires a touchend. These custom events are also assigned a touches array containing a reference to the event, just like a real touch event in a mobile browser.

Brian pointed out that this makes debugging mobile apps easier, because
you're not limited to Mobile Safari's limited debugging tools. There's
also a bookmarklet for activating Phantom Limb, which means you could
use it on any page.

WebGL Model Viewer

Christopher Chedeau sent us a link to
jDataView, a library for reading binary files in browsers. His blog post, Javascript - jDataView: Read

includes some background on the project and a great demo: a World of
Warcraft Model
You'll need a WebGL-enabled browser to view this demo.

Dealing with binary data is inherent to games development, so it's worth
taking a look at jDataView if you're working in that area.


OpenOdyssey by Michal Budzynski for the Mozilla GameOn
is a simple browser-based
game that uses the Mibbu game framework. The basic
gameplay mechanics are fairly solid, so it'll be interesting to see what
Mibbu is like when Michal releases it.


webkit inspector

Webkit Inspector Updates

Posted on .

The Inspector for WebKit has recently been
updated and it looks like they're really committed to making it a useful tool for
developers. They've even added their own event

utility akin to that offered by Eventbug.

Of course, you'll have to install the latest nightly
of WebKit if you want to play around
with it today.

Webkit event listeners