branneman

Better local require() paths for Node.js

Problem

When the directory structure of your Node.js application (not library!) has some depth, you end up with a lot of annoying relative paths in your require calls like:

const Article = require('../../../../app/models/article');

Those suck for maintenance and they're ugly.

Possible solutions

karlwestin

describe("test suite that you wanna perf", function() {
  beforeEach(function() {
    this.start = performance.now();
  });

  afterEach(function() {
    console.log(jasmine.getEnv().currentSpec.description, performance.now() - this.start);
  });
});

ryanflorence

// Because people can't seem to find the gist description, here is the source
// of this code, a post found in last weeks JS Weekly, it is not my code
// http://www.angularails.com/articles/creating_simple_directive_in_angular

angular.module('ui-multi-gravatar', [])
  .directive('multiAvatar', ['md5', function (md5) {
    return {
      restrict: 'E',
      link:function(scope, element, attrs) {

millermedeiros

Setup Mac OS X

I've done the same process every couple years since 2013 (Mountain Lion, Mavericks, High Sierra, Catalina) and I updated the Gist each time I've done it.

I kinda regret for not using something like Boxen (or anything similar) to automate the process, but TBH I only actually needed to these steps once every couple years...

jordwalke

/**
 * ReactJS: JavaScript like you've always done it.
 * 
 * This example renders your top ten most followed friends/followers, `filter`ing
 * only your favorites, and putting a star on all verified accounts.
 * 
 * With ReactJS, any time your data changes, the UI is always brought up to date
 * automatically. If friends length changes, or followCount - it always shows what
 * `render` describes.
 */

ebidel

Web Components Resources

Specs / standardization

W3C Introduction to Web Components - explainer/overview of the technologies

• Custom Elements
• HTML Imports
• Shadow DOM
• CSS Scoping Module

Integralist

(function (window, document) {

    'use strict';

    var $, Imager;

    window.requestAnimationFrame = 
    window.requestAnimationFrame || 
    window.mozRequestAnimationFrame || 
    window.webkitRequestAnimationFrame || 

Integralist

The BBC has a server-side image service which provides developers with multiple sized versions of any image they request. It works in a similar fashion to http://placehold.it/ but it also handles the image ratios returned (where as placehold.it doesn't).

The original BBC News process (and my re-working of the script) follows roughly these steps...

• Create new instance of ImageEnhancer
• Change any divs within the page (which have a class of delayed-image-load) into a transparent GIF using a Base64 encoded string.
  • We set the width & height HTML attributes of the image to the required size
  • We know what size the image needs to be because each div has custom data-attr set server-side to the size of the image
  • We then set a class of image-replace onto each newly created transparent image
• We use a 250ms setTimeout to unblock the UI thread and which calls a function resizeImages which enhances the image-replace images so their source is now set to a URL whe

phamann

Lesson's learnt building the Guardian

Below is a collection of my favourite responses I gathered from Guardian engineers when asked the question: What have you learnt starting from scratch and building a mobile-first next generation web platform for the Guardian?

Daithi O Crualaoich

• Work with great people.
• Deploy like crazy. This means the team has to control the infrastructure as well as code.
• Design is not a service. Designers have to sit in the team.
• Infrastructure is intrinsically unreliable. Discard and replace is the robust strategy.
• Use your CDN for HTML too.
• Don't always do as you are told.

ragingwind

Backend Architectures

Twitter

ror, scala, jetty, erlang, thrift, mongrel, comet server, my-sql, memchached, varnish, kestrel(mq), starling, gizzard, cassandra, hadoop, vertica, munin, nagios, awstats

• Introduce Gizzard of Twitter - 트위터의 새로운 분산 관리 라이브러리 Gizzard를 소개합니다.
• The Architecture Twitter Uses to Deal with 150M Active Users, 300K QPS, a 22 MB/S Firehose, and Send Tweets in Under 5 Seconds
• Scaling Twitter: Making Twitter 10000 Percent Faster