santihbc

Interaction tracing with React

React recently introduced an experimental profiler API. After discussing this API with several teams at Facebook, one common piece of feedback was that the performance information would be more useful if it could be associated with the events that caused the application to render (e.g. button click, XHR response). Tracing these events (or "interactions") would enable more powerful tooling to be built around the timing information, capable of answering questions like "What caused this really slow commit?" or "How long does it typically take for this interaction to update the DOM?".

With version 16.4.3, React added experimental support for this tracing by way of a new NPM package, scheduler. However the public API for this package is not yet finalized and will likely change with upcoming minor releases, so it should be used with caution.

This Gist provides some high-level docum

santihbc

#!/usr/bin/env bash
set -e

# usage:
#   $ ./encode.sh [INPUT_FILE]
#
# NOTE: The output directory is defined in the script (below) because I use this script with Hazel

# START CONFIGURATION ==================

santihbc

context_title: "$Context.title",
com_instructure_post_message_token: "$com.instructure.PostMessageToken",
com_instructure_assignment_lti_id: "$com.instructure.Assignment.lti.id",
com_instructure_originality_report_id: "$com.instructure.OriginalityReport.id",
com_instructure_submission_id: "$com.instructure.Submission.id",
com_instructure_file_id: "$com.instructure.File.id",
course_offering_sourced_id: "$CourseOffering.sourcedId",
context_id: "$Context.id",
context_sourced_id: "$Context.sourcedId",
message_document_target: "$Message.documentTarget",

santihbc

/**
 * server/dataSources/Auth.js
 * Auth implementation, it's not really a dataSource so it doesn't need to be here
 */
const { authenticate, createJwt } = require('../lib/passport');
const { ON_HTTPS } = require('../configs');

const ONE_MINUTE = 1000 * 60;
const ONE_DAY = ONE_MINUTE * 60 * 24;
const ONE_MONTH = ONE_DAY * 30;

santihbc

Here's how you could create custom error classes in Node.js using latest ES6 / ES2015 syntax.

I've tried to make it as lean and unobtrusive as possible.

Defining our own base class for errors

errors/AppError.js

santihbc

Encoding Video

Installing

Install FFmpeg with homebrew. You'll need to install it with a couple flags for webm and the AAC audio codec.

brew install ffmpeg --with-libvpx --with-libvorbis --with-fdk-aacc --with-opus

santihbc

atom-text-editor {
  -webkit-font-smoothing: antialiased;
}

atom-text-editor::shadow{
  .storage.type.function.arrow, .operator {
    font-family: 'FiraCode-Retina';
    text-rendering: optimizeLegibility;
    vertical-align: baseline;
  }

santihbc

'use strict'

const MongoClient = require('mongodb')

class Database {

  constructor (uri) {
    this.uri = uri
    this.db = {}
    return this

santihbc

var Backbone = require('backbone');

// Flash ///////////////////////////////////////////////////////////////////////////////////////////

// The flash is a way for one controller to pass a small amount of information to the next
// controller, through a navigation event.
//
// The flash holds arbitrary parameters, and is cleared by the router after each navigation event.
var flash = exports.flash = {
  params: {},

santihbc

'use strict';

module.exports = function CustomError(message, extra) {
  Error.captureStackTrace(this, this.constructor);
  this.name = this.constructor.name;
  this.message = message;
  this.extra = extra;
};

require('util').inherits(module.exports, Error);