Michael Scott Hertzberg moimikey

Parens And Performance

Years ago, some smart folks that worked on JS engines realized that not all JS that's loaded into a page/app initially is needed right away. They implemented JIT to optimize this situation.

JIT means Just-In-Time, which means essentially that the engine can defer processing (parsing, compiling) certain parts of a JS program until a later time, for example when the function in question is actually needed. This deferral means the engine is freer to spend the important cycles right now on the code that's going to run right now. This is a really good thing for JS performance.

Some time later, some JS engine devs realized that they needed to get some hints from the code as to which functions would run right away, and which ones wouldn't. In technical speak, these hints are called heuristics.

So they realized that one very common pattern for knowing that a function was going to run right away is if the first character before the function keyword was a (, because that usually m

Promises as EventEmitters

I was trying to understand JavaScript Promises by using various libraries (bluebird, when, Q) and other async approaches.

I read the spec, some blog posts, and looked through some code. I learned how to

Building a Maintainable, Agile Architecture for Realtime, Transactional Apps

A maintainable application architecture requires that the UI only contain the rendering logic and execute queries and mutations against the underlying data model on the server. A maintainable architecture must not contain any logic for composing "app state" on the client as that would necessarily embed business logic in the client. App state should be persisted to the database and the client projection of it should be composed in the mid tier, and refreshed as mutations occur on the server (and after network interruption) for a highly interactive, realtime UX.

With GraphQL we are able to define an easy-to-change application-level data schema on the server that captures the types and relationships in our data, and wiring it to data sources via resolvers that leverage our db's own query language (or data-oriented, uniform service APIs) to resolve client-specified "queries" and "mutations" against the schema.

We use GraphQL to dyn

	// getComponent is a function that returns a promise for a component
	// It will not be called until the first mount
	function asyncComponent(getComponent) {
	return class AsyncComponent extends React.Component {
	static Component = null;
	state = { Component: AsyncComponent.Component };

	componentWillMount() {
	if (!this.state.Component) {
	getComponent().then(Component => {

	/* eslint-disable no-var */
	var path = require('path');
	var autoprefixer = require('autoprefixer');

	const MATCH_ALL_NON_RELATIVE_IMPORTS = /^\w.*$/i;

	module.exports = [{
	output: {
	filename: '[name].js',
	library: 'atrium-react-plugin-beta',

	'use strict';

	/*
	* Binary search tree with in-order iteration.
	* http://greim.github.io/gen/dist/00-intro.html
	*/

	class Tree {
	add(value) {
	if (this.root) this.root.add(value);


	// ES6 leftPad by Guillermo Rauch
	// https://twitter.com/rauchg/status/712799807073419264
	export default (v, n, c = '0') => String(v).length >= n ? '' + v : (String(c).repeat(n) + v).slice(-n);

	// for ES6 less
	function leftPad(v, n, c){
	c = c ? '0' : c;
	return String(v).length >= n ? '' + v : (String(c).repeat(n) + v).slice(-n);
	}

	<html>
	<body>
	<h1>Minimal WebWorker example</h1>
	<p>Look in the console!</p>
	<script src="main.js"></script>
	</body>
	</html>


	// from the brilliant mind of sb
	var _catch = Promise.prototype.catch;
	Promise.prototype.catch = function () {
	return _catch.call(this, function (err) { setTimeout(function () { throw(err); }, 0); });
	}

	class Nav extends React.Component {
	constructor() {
	super();
	this.onNav = this.onNav.bind(this);
	}
	onNav(idx) {
	// do something with `this` and `idx`
	}
	render() {
	return (