Tag Archives: javascript

“Just turn it into a node module”, and other mantras Edna taught me

Here are the screencast and the write up on the talk I gave today at One-Shot London NodeConf. As usual I diverge a bit from the initial narrative and I forgot to mention a couple of topics I wanted to highlight, but I have had a horrible week and considering that, this has turned out pretty well!

It was great to meet so many interesting people at the conference and seeing old friends again! Also now I’m quite excited to hack with a few things. Damn (or yay!).

Continue reading

Binding to an specific host with express.js

The documentation on the listen method is really vague, but the way you can make your server listen to an specific address only is this:

var server = app.listen(3000, '127.0.0.1', 511, onServerListening);

In this case I want the server to respond only to connections using the 127.0.0.1 host name. Not 0.0.0.0, and not localhost. Only 127.0.0.1.

The reason for this is that I am playing with Twitter’s OAuth and I was stumbling upon this issue because express insisted in binding to 0.0.0.0 by default (i.e. any address), but it wouldn’t work well when Twitter redirected back after authenticating.

For reference, another thing I tried and didn’t work:

var server = app.listen(3000, '127.0.0.1', onServerListening);

Notice that the 511 parameter is missing. So effectively it would take onServerListening as if it was the 511 parameter, which according to the documentation is “the maximum length of the queue of pending connections” and it wouldn’t call the callback. Booo.

Speaking at OneShotLondon NodeConf

“Just turn it into a node module,” and other mantras Edna taught me

The story of leaving behind a random mix of Python + php + bash + makefile + Scons scripts to totally embrace using Node, modules, standard callbacks, browserify, and friends to build toys that bleep and bloop with MIDI, WebGL and Web Audio.

As you can maybe deduct, this might not be your average super expert node.js talk, but a story of learning with a non-appointed mentor and an spontaneous community, and improving and making the most out of node.js—and how it informed and shaped the rest of my coding philosophy, both inside and outside of Mozilla.

I must confess that I’m really humbled and flattered to be amongst this amazing line up of true node experts.

UUUUUUUHHH THE EXPECTATIONS!—feeling a bit like an impostor now.

Next next Saturday 19th of July. See you there? :-)

WAC – the Web Audio Conference

There is going to be a Web Audio Conference for the first time and it’s going to happen in Paris, next January 2015.

This is co-organised by IRCAM and Mozilla, and I’m excited to be involved as part of the technical committee.

Call for papers is open until October the 10th.

*** GO GO GO AND SUBMIT AWESOME STUFF ***

DO IT.

window.devicePixelRatio

If you want to write code that looks nice and crispy in high density displays, you have to take the device pixel density into account. This is exposed to us in JavaScript as the window.devicePixelRatio property, which returns a number that describes how many physical pixels does it take to represent a device independent pixel. The more pixels it takes, the finer the display will look, and the harder it is to actually “see” individual pixels (as in, individual, physical light dots) in the screen. This is famously known now as the “Retina” effect, but not only Mac products exhibit this behaviour-most relatively high end phones with “touch screen” usually have a display density higher than 1.

The interesting bit here is that you can’t assume that once a document is opened in your browser, the devicePixelRatio will stay constant. If you drag the window to a screen with a different density, this value will change–as seen in this video where I am dragging my test page window between the Retina display of the laptop, with ratio = 2, and the external monitor whose ratio is 1. For comparison, devicePixelRatio is 3 on my Nexus 5, 1.5 on a Firefox OS Flame, and 1 on a Geeksphone Keon.

Try it out, and maybe leave a comment with what you got!

There isn’t any event triggered when this value changes, so that’s why in this test case I set a periodic interval to keep updating the value:

setInterval(updateDPR, 50);

function updateDPR() {
    p.textContent = window.devicePixelRatio;
}

Perhaps not the most efficient piece of code, but this is also a bit of a corner case maybe, and a test page, so just don’t copy it literally :-)

Sources.