Javascript Typed Arrays: Method Support

Al MacDonald recently posted http://stage1.bocoup.com/blog/javascript-typed-arrays – which is an interesting look at the benchmarkable speed differences between FireFox 4’s Float32Array constructor and the traditional Array constructor.

---

As expected, the Typed Arrays are definitively faster due entirely to native optimization: they only allow integer or floating point numbers (respectively to their Int or Float prefix); additionally length is required and immutable.

---

What about the nitty gritty? I whipped up a basic test suite to check support for methods of the traditional Array object – take a look:

---

• + supported
• – unsupported

---

results.txt

Array
  + concat
  + every
  + filter
  + forEach
  + indexOf
  + join
  + lastIndexOf
  + length
  + map
  + pop
  + push
  + reduce
  + reduceRight
  + reverse
  + shift
  + slice
  + some
  + sort
  + splice
  + toLocaleString
  + toString
  + unshift

Int8Array
  - concat
  - every
  - filter
  - forEach
  - indexOf
  - join
  - lastIndexOf
  + length
  - map
  - pop
  - push
  - reduce
  - reduceRight
  - reverse
  - shift
  + slice
  - some
  - sort
  - splice
  + toLocaleString
  + toString
  - unshift

Int16Array
  - concat
  - every
  - filter
  - forEach
  - indexOf
  - join
  - lastIndexOf
  + length
  - map
  - pop
  - push
  - reduce
  - reduceRight
  - reverse
  - shift
  + slice
  - some
  - sort
  - splice
  + toLocaleString
  + toString
  - unshift

Int32Array
  - concat
  - every
  - filter
  - forEach
  - indexOf
  - join
  - lastIndexOf
  + length
  - map
  - pop
  - push
  - reduce
  - reduceRight
  - reverse
  - shift
  + slice
  - some
  - sort
  - splice
  + toLocaleString
  + toString
  - unshift

Float32Array
  - concat
  - every
  - filter
  - forEach
  - indexOf
  - join
  - lastIndexOf
  + length
  - map
  - pop
  - push
  - reduce
  - reduceRight
  - reverse
  - shift
  + slice
  - some
  - sort
  - splice
  + toLocaleString
  + toString
  - unshift

Float64Array
  - concat
  - every
  - filter
  - forEach
  - indexOf
  - join
  - lastIndexOf
  + length
  - map
  - pop
  - push
  - reduce
  - reduceRight
  - reverse
  - shift
  + slice
  - some
  - sort
  - splice
  + toLocaleString
  + toString
  - unshift

---

Understandably, the following methods don’t fit the paradigm of an array with a required, immutable length:

• concat
• push
• pop
• shift
• unshift

But I fail to see why “slice” gets preferential treatment (by name in the spec) while other useful methods such as “indexOf”, “reverse”, “sort”, “filter”, “forEach”, etc are not included in the spec. Note that Firefox 4 supports all of these methods for traditional arrays.

---

Want to try these at home? You’ll need FireFox 4 Beta 1 and these:

typedarrayssupports.js

(function () {

  var arrayMethods  = ['concat', 'every', 'filter', 'forEach',
                       'indexOf', 'join', 'lastIndexOf',
                       'length', 'map', 'pop', 'push',
                       'reduce', 'reduceRight', 'reverse',
                       'shift', 'slice', 'some', 'sort',
                       'splice', 'toLocaleString',
                       'toString', 'unshift'],

      arrayNames    = [ 'Array',
                        'Int8Array',  'Int16Array',  'Int32Array',
                        'Float32Array',  'Float64Array' ],

      arrayTypes    = [ new Array(10),
                        new Int8Array(10),
                        new Int16Array(10),
                        new Int32Array(10),
                        new Float32Array(10),
                        new Float64Array(10) ];

  for ( var i = 0; i < arrayTypes.length; i++ ) {


    var temp  = arrayTypes[i];

    for ( var x = 0; x < temp.length; x++ ) {
      temp[x] = arrayNames[i].indexOf('Int') > -1 ? x : 0.123456789 ;
    }

    console.group( arrayNames[i] );
    console.log(temp);

    for ( var m = 0; m < arrayMethods.length; m++ ) {

      if ( arrayMethods[m] in temp ) {
        console.log(' + ' + arrayMethods[m]);
      } else {
        console.log(' - ' + arrayMethods[m]);
      }

    }
    console.groupEnd(arrayNames[i]);


  }
})();

typedarrayssupports.html

<script src="https://getfirebug.com/firebug-lite-beta.js">
{
  startOpened: true,
  enableTrace: true
}
</script>
<script src="typedarrayssupports.js"></script>

---

Get the entire gist here