kirbysayshi

require('tap-browser-color')();
var test = require('tape');

test('it flattens!', function(t) {
  var input = {
    users: [
      { name: 'name1', id: 1, image: { '64x64': 'http://1' } },
      { name: 'name2', id: 2, image: { '64x64': 'http://2' } }
    ],
    errors: [ new Error('err1') ],

kirbysayshi

require('tap-browser-color')();
var test = require('tape');

test('it flattens!', function(t) {
  var input = {
    users: [
      { name: 'name1', id: 1, image: { '64x64': 'http://1' } },
      { name: 'name2', id: 2, image: { '64x64': 'http://2' } }
    ],
    errors: [ new Error('err1') ],

kirbysayshi

var debug = require('debug')
var lg = debug('vash:TS');
var Parser = require('vash/lib/parser');
var Lexer = require('vash/lib/lexer');
var codegen = require('vash/lib/codegen');

var TypeScript = require('typescript');
console.log('type?', TypeScript)

function compileTS(markup, options) {

kirbysayshi

var cvs = document.querySelector('#cvs');
var ctx = cvs.getContext('2d');
window.addEventListener('resize', resize, false)

function resize(e) {
  cvs.width = window.innerWidth;
  cvs.height = window.innerHeight;
}

resize();

kirbysayshi

var td = require('transducers-js');
var csp = require('csp-ksh');
var chan = csp.chan;
var put = csp.put;
var take = csp.take;

// Create a channel with a buffer of size 2 using a sliding window strategy,
// with a transducer that groups as tuples.
var ch = chan([csp.SLIDING, 2], td.partitionAll(2));

kirbysayshi

localStorage.debug = '';
var debug = require('debug')('csp-ksh');

function kick(ch) {
  debug('ch:'+ch.id, 'kick');
  if (
    !ch.kicked
    && (ch.consumers.length|| ch.producers.length)
  ) {
    debug('ch:'+ch.id, 'kick:run-queued',

kirbysayshi

function TaskQueue(concurrency) {
  var _queue = [];
  var _concurrents = 0;
  var ctr = {
    queue: function(fn) {
      _queue.push(fn)
    },
    next: function() {
      while (_concurrents < concurrency) {
        _concurrents += 1;

kirbysayshi

I'm experimenting with the most efficient way (in terms of CPU / battery usage) to make a small equalizer animation that will appear multiple times on a page.

I've tried CSS animations, CSS transitions, canvas drawing, and a plain GIF (and more not listed here!). I'd expect the CSS animations and transitions to be completely GPU powered, but Chrome 39.0.2171.99 on my Macbook Air 10.10 uses large amounts of CPU (shown in both the Chrome Task Manager as well as Activity Monitor). I've set layout boundaries via overflow: hidden, checked paint rects, etc.

Here are the different tests:

• JS-triggered Transitions (40% CPU chrome): http://s.codepen.io/kirbysayshi/debug/YPZgbY (code)
• scale3d animation (20% CPU chrome): http://s.codepen.io/kirbysayshi/debug/myWQyW (code)
• translate3d animation (40% CPU chrome): http://s.codepen.io/kirbysayshi/debug/gbmBym (code)
• canvas (12%

kirbysayshi

Keybase proof

I hereby claim:

• I am kirbysayshi on github.
• I am kirbysayshi (https://keybase.io/kirbysayshi) on keybase.
• I have a public key whose fingerprint is 950B 3198 7DB5 59AE 881F 5A0D E5A1 98CF 0A3D 8B01

To claim this, I am signing this object:

kirbysayshi

// just because requirebin needs something to require...?
var vash = require('vash');

var play = document.createElement('input');
play.type = "button";
play.value = "play/pause";
document.body.appendChild(play);
play.onclick = function(e) {
  evolve(null, state)