project-2501.net » javascript http://project-2501.net The net is vast and infinite. Tue, 08 Nov 2011 10:38:06 +0000 en hourly 1 http://wordpress.org/?v=3.2.1 Code Smell http://project-2501.net/index.php/2011/07/code-smell/ http://project-2501.net/index.php/2011/07/code-smell/#comments Mon, 04 Jul 2011 03:26:06 +0000 Matthew http://project-2501.net/?p=319

“In computer programming, code smell is any symptom in the source code of a program that possibly indicates a deeper problem.” — Wikipedia

I found this piece of code this morning, I think it counts as something gone terribly, terribly wrong:

return displayItemDetails(this.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode, 14059111);

(The code was in-line JavaScript, inserted into a onclick handler, generated in PHP)

]]> http://project-2501.net/index.php/2011/07/code-smell/feed/ 0 javascript; sending me insane http://project-2501.net/index.php/2010/01/javascript-sending-me-insane/ http://project-2501.net/index.php/2010/01/javascript-sending-me-insane/#comments Tue, 19 Jan 2010 03:55:38 +0000 Matthew http://project-2501.net/?p=228
>>> []
[]
>>> [] == true
false
>>> [] == false
true
>>> [] == []
false
>>> false == false
true
]]> http://project-2501.net/index.php/2010/01/javascript-sending-me-insane/feed/ 1 array_unique javascript snippet http://project-2501.net/index.php/2009/02/array_unique-javascript-snippet/ http://project-2501.net/index.php/2009/02/array_unique-javascript-snippet/#comments Mon, 23 Feb 2009 06:07:34 +0000 Matthew http://project-2501.net/?p=139
function array_unique(a)
{
    return a.reduce(function(u, e)
    {
        if(!(e in u))
            u.push(e);

        return u;
    }, []);
}
]]> http://project-2501.net/index.php/2009/02/array_unique-javascript-snippet/feed/ 0 Javascript map-sort http://project-2501.net/index.php/2009/01/javascript-map-sort/ http://project-2501.net/index.php/2009/01/javascript-map-sort/#comments Tue, 20 Jan 2009 08:30:05 +0000 Matthew http://project-2501.net/?p=92 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
]]> http://project-2501.net/index.php/2009/01/javascript-map-sort/feed/ 0 Javascript… http://project-2501.net/index.php/2008/03/javascript/ http://project-2501.net/index.php/2008/03/javascript/#comments Sat, 22 Mar 2008 13:40:13 +0000 Matthew http://project-2501.net/?p=75 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
]]> http://project-2501.net/index.php/2008/03/javascript/feed/ 0 Very simple captcha decoding using the Canvas tag http://project-2501.net/index.php/2007/02/very-simple-captcha-decoding-using-the-canvas-tag/ http://project-2501.net/index.php/2007/02/very-simple-captcha-decoding-using-the-canvas-tag/#comments Sun, 11 Feb 2007 09:28:15 +0000 Matthew http://project-2501.net/?p=4 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
Canvas Captcha Results.png (57 KB)

]]> http://project-2501.net/index.php/2007/02/very-simple-captcha-decoding-using-the-canvas-tag/feed/ 0 Digg: Javascript overload? http://project-2501.net/index.php/2006/01/digg-javascript-overload/ http://project-2501.net/index.php/2006/01/digg-javascript-overload/#comments Sat, 28 Jan 2006 10:38:25 +0000 Matthew http://project-2501.net/?p=6 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 / 8) * 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?

]]> http://project-2501.net/index.php/2006/01/digg-javascript-overload/feed/ 0