Menu ⇓

  5. Javascript has no real Set or Dictionary implementation, which for someone spoiled by python’s set and dicts is rather frustrating. However, in leiu of the poorly supported js Set type, plain old objects can be massaged into acting as both sets and dicts:

    
// Python: d = dict()
var d = {};

// d['key'] = 'value'
d['key'] = 'value';

// d.get('nonexistent', 'fallback')
d.hasOwnProperty('nonexistent') ? d['nonexistent'] : 'fallback';

// d.keys()
Object.keys(d);

// s = set()
var s = {};

// s.add(1)
s[1] = true;

// 1 in s
s.hasOwnProperty(1);

// Accessing all values in set:
Object.keys(s);

    Notes: the in operator can be used to test membership, but will incorrectly return true for __proto__, as well as all properties up the prototype chain, i.e. all properties and methods of Object. hasOwnProperty is much safer to use.

    Similarly, the use of the ternary operator for get-item-with-fallback could in theory be replaced with d['item'] || 'fallback', unless of course the value stored was falsey, in which case the or will incorrectly return a truthier fallback.

  6. Just implemented notifications in ! I get a native, first-class notification when I’m mentioned. Really easy to do with the notification API: developer.mozilla.org/en-US/docs/Web/API/notification

    Update: demo video!

    1. Navigating to my homepage and granting notification permissions
    2. Native notification from iTunes for comparison
    3. Notification of a new comment from KartikPrabhu (thanks for helping demo!)
    4. The notification is a proper, first-class notification in notification centre

    Not shown: clicking on the notification navigates to the source of the mention.

  9. Had many basic software development lessons hammered in by personal experience over the last couple of years: hierarchy bad. side effects bad. many moving parts bad. undue complexity bad. inconsistency bad. SQL databases fragile. always be reducing.

    It’s amazing just how seductive complex, unproductive tools can be. Successfully overcome+abandoned:

    • Codeigniter
    • Doctrine ORM
    • Bootstrap
    • Backbone, Ember, Angular
    • Symfony Security component

    PHP remains productive and speedy (with composer, delightful dependency management), python nice with some irritations. jQuery useful when absolutely necessary, plain with small libraries loaded via requirejs handle most progressive enhancement concisely. node.js nice for some things, preferring go’s approach to async programming but still not much everyday need for it.

    Avoiding middlemen: LESS, SASS, Coffeescript. Unnecessary for most of my work, and more moving parts is bad.

    Now bothering me is the frameworky nonsense accumulating in . Need to cleanse.

  10. jQuery and jQuery UI are amazing tools. They shouldn’t be used everywhere by default, but they do allow some complex stuff to be made extremely fast.

  11. This evening: documented Yahoo! Pipes UI in case of sudden shutdown, built first mockup of web dataflow UI using jsplumbtoolkit.com — really excellent library, exactly the right balance between functionality and framework. It gives you a lot but doesn’t dictate how to use it.

  12. Facebook use shady javascript to replace legit-looking link URLs with their own tracking endpoint.

    I made a browser extension which removes this: facebook-anticlickjack.

    It uses javascript to remove javascript from what should just be HTML. I call it “aggressive degredation”.

  14. And the lesson of the day is: bean.fire(el, 'click') doesn’t work in Firefox Nightly, but turns out it’s unnecessary, because HTMLElement.click() does exactly the same thing and already works cross-browser. Always use the browser-native APIs if you can.

  15. In reply to a post on gist.github.com

    My take on generic prev/next controls on keyup, using only bean for events, based on previous work by Aaron Parecki and Tantek Çelik:

    
// Generic prev/next navigation on arrow key press
bean.on(document.body, 'keyup', function (e) {
  var prevEl, nextEl;
  
  if (document.activeElement !== document.body) return;
  if (e.metaKey || e.ctrlKey || e.altKey || e.shiftKey) return;
  
  if (e.keyCode === 37) {
    prevEl = document.querySelector('[rel~=previous]');
    if (prevEl) bean.fire(prevEl, 'click');
  } else if (e.keyCode === 39) {
    nextEl = document.querySelector('[rel~=next]');
    if (nextEl) bean.fire(nextEl, 'click');
  }
});