project-2501.net » javascript

javascript; sending me insane

Matthew — Tue, 19 Jan 2010 03:55:38 +0000

>>> []

[]

>>> [] == true

false

>>> [] == false

true

>>> [] == []

false

>>> false == false

true

array_unique javascript snippet

Matthew — Mon, 23 Feb 2009 06:07:34 +0000

function array_unique(a)

{

    return a.reduce(function(u, e)

    {

        if(!(e in u))

            u.push(e);

        return u;

    }, []);

}

Javascript map-sort

Matthew — Tue, 20 Jan 2009 08:30:05 +0000

I’m sure sorting method has a real name, but I’ve had no luck searching for it.

function mapSort(array, mapFunction, sortFunction)

{

    // Store both original value, and transformed value

    var mapData = array.map(function(e)

    {

        return [e, mapFunction(e)];

    });

    // Sort the data using the second element of each array item (the mapped one)

    var sortedData = mapData.sort(function(a, b)

    {

        return sortFunction(a[1], b[1]);

    });

    // Remove the extra transformed value from the sorted array

    return sortedData.map(function(e)

    {

        return e[0];

    });

}

// Example

var data = ["a", "b", "A", "B", "C", "c"];

var cmp  = function(a, b) { return a > b; };

var map  = function(ch) { return ch.toLowerCase(); };

print("Normal:   " + data.sort(cmp));

print("Map Sort: " + mapSort(data, map, cmp));

// Normal:   A,B,C,a,b,c

// Map Sort: a,A,B,b,c,C

Javascript…

Matthew — Sat, 22 Mar 2008 13:40:13 +0000

Javascript is both infuriating and awesome at the same time. I don’t think I’ve ever speant so much time tracking down annoying bugs (even compared to PHP), yet at the same time it makes functions like the one below very simple to write.

For reference, the below code returns a `getter` method that we use to instantiate objects via a cache system.

var buildSimpleObjectGetter = function(cacheRef, objectRef)

{

   var f = "buildSimpleObjectGetter()";

   UTILS.checkArgs(f, arguments, [ObjectCache, Function]);

   return function(idRecord, idArg)

   {

      return cacheRef.get('' + idArg, function()

      {

         return new objectRef(idRecord, idArg);

      });

   }

}

Update 20080327:

On the topic of stupid Javascript bugs, who thought auto terminating lines was a good default!

function getWords()

{

    return

    [

        'Hello',

        'World!'

    ];

}

console.info(getWords());

// Ouput

// >>> undefined

Very simple captcha decoding using the Canvas tag

Matthew — Sun, 11 Feb 2007 09:28:15 +0000

Ever since learning about the canvas tag, I’ve been wanting to try this…. Yes, the captcha I used is amazingly simple to break, but, I doubt I'm smart enough to tackle anything more complicated. Though I feel it still serves a good proof of concept (espcially when combined with Greasemonkey)

Canvas Captcha Results.png (57 KB)

Digg: Javascript overload?

Matthew — Sat, 28 Jan 2006 10:38:25 +0000

The Digg front page (28KB) requires 2 (3?) CSS files and 17 Javascript files to be downloaded before it can be displayed. This shouldn’t be a problem as the files should be cached on the first visit. But I wouldn’t be here writing this if that was the case. It appears that max-age is set to 60 minutes on almost everything, even the images.

I used the Live HTTP Headers extension for Firefox to examine all the HTTP responses sent when doing a full refresh, to see just how much data was being transfered.

File sizes are the actual number of bytes sent by the server (minus HTTP protocol overhead). Most files have been compressed using gzip.

Front page: 6,928 bytes in 1 file

http://digg.com/ (6928)

CSS: 9,550 bytes in 3 files

http://digg.com/css/digg2.css (8221)
http://digg.com/css/digg2-compact.css (656)
http://digg.com/css/toolbar.css (673)

Javascript: 238,830 bytes in 17 files

http://digg.com/js/spellChecker.js (13061)
http://digg.com/js/utils.js (2074)
http://digg.com/js/xmlhttp.js (12429)
http://digg.com/js/wz_dragdrop.js (37711)
http://digg.com/js/hover.js (2511)
http://digg.com/js/label.js (6518)
http://digg.com/js/switcher.js (1362)
http://digg.com/js/prototype.js (47932)
http://digg.com/js/scriptaculous.js (2152)
http://digg.com/js/builder.js (3361)
http://digg.com/js/effects.js (32808)
http://digg.com/js/dragdrop.js (18776)
http://digg.com/js/controls.js (26195)
http://digg.com/js/slider.js (10752)
http://digg.com/js/aboutdigg.js (215)
http://www.google-analytics.com/urchin.js (5104)
http://digg.com/js/tooltip.js (15869)

Images: 32,030 bytes in 25 files

Not interesting

Time Comparison

Minimum data to download (HTML + CSS + JS): 255,308 bytes
Everything (HTML + CSS + JS + Images): 287,338 bytes
Speed in bytes = (speed in bits / * 0.85 (overhead)
This doesn’t take in consideration latency or HTTP overhead

Minimum (no images)

56k: 46.2 seconds
256: 9.4 seconds
512: 4.7 seconds
1500: 1.6 seconds

Everything

56k: 52.0 seconds
256: 10.6 seconds
512: 5.3 seconds
1500: 1.8 seconds

Is this really acceptable for a website? Or more importantly, a simple front page?

Just how many features are being used on the front page?

Why should (almost) everything expire in 60 minutes?