Ian Obermiller

Part time hacker, full time dad.

Flux Panel at ReactJS Conf 2015

Last week in Menlo Park was the first ReactJS conference, hosted by Facebook. I had the honor of being on the Flux Panel with some amazing developers. Bill Fisher did an excellent job preparing us for the panel and moderating, and it is chock full of nuggets of wisdom from those of us building some of the largest React+Flux apps. Topics include Relay vs Flux, isomorphic apps, maintainability, and approaches to data fetching.

(That’s me in the coveted React t-shirt, by the way)

For more Fluxxy goodness, check out my Flux interview with Andrew Cholakian and Trenton Strong.

Side-by-side diffs for Mercurial (hg)

Ever wish for hg diff in side-by-side view? I find it much easier to scan, assuming you have the horizontal real-estate in your terminal. Here is a simple guide to setting up side-by-side diffs in Mercurial on Linux/OSX: (more…)

React and Flux Interview

Andrew Cholakian and Trenton Strong, avid users of React, asked me a few insightful questions about using Flux with React in a large app. The full transcription follows.


Pretty printing text with even line lengths

The following demo pretty prints the entered text to the desired line width by making the lines as even as possible. The demo uses a dynamic programming algorithm to choose line breaks in such a way that the sum of the squares of the slack is minimized.


jQuery Performance: :not() vs .not()

While doing some profiling on Socl, I noticed a particular jQuery selector that was taking an inordinate amount of time to run:

var toTranslate = this.$element.find('.translatable').not('.translated');

The purpose of the code is to find elements that can be translated, but haven’t been already. My suspicion was on the .not() addition, and lo and behold, inlining the clause into the first selector dramatically increased performance:

var toTranslate = this.$element.find('.translatable:not(.translated)');


Highlight search terms in C#, Javascript and TypeScript

Following is a function that given a string and a search query will wrap bold tags around search terms that were found in the query:


text = “The theory of the big bang was proposed in…”
query = “Big Bang Theory”
result = “The <b>theory</b> of the <b>big</b> <b>bang</b> was proposed in…”
result as html = The theory of the big bang was proposed in….

TypeScript Syntax Highlighting for WordPress

For my first post on TypeScript, I included many code samples, and found the Javascript highlighting to be lacking since TypeScript introduces a number of new keywords. To remedy, I’ve put together a simple plugin that adds a TypeScript brush to the SyntaxHighlighter Evolved plugin, using this excellent tutorial. Once installed, you can use the new tags to highlight your TypeScript code, either [ts][/ts] or [typescript][/typescript].

Download the "SyntaxHighlighter Evolved: TypeScript Brush" plugin


TypeScript Highlights

Microsoft recently released a new, open source language called TypeScript. It is a strict superset of Javascript, and compiles directly to Javascript. The compiler is open source, and written in TypeScript itself. My team at Microsoft has been dogfooding TypeScript for several months now, and I thought I’d share a few of my favorite parts of the language.


LINQ for Javascript

While evaluating the different options for bringing LINQ-like operators to JavaScript, I compiled the following list of existing libraries:

I’d love to hear about any others!

MVC error: “Cannot create an abstract class”

While debugging an MVC4 app, I ran into the following error: System.MissingMethodException: Cannot create an abstract class. It was only happening for a single Action, and I wasn’t able to set a breakpoint in that action. After some trial and error, I was able to find the issue in the code:

public virtual ActionResult Login(ActionResult redirectAction = null)

The goal was to have an T4MVC style helper for passing in an ActionResult instead of an untyped path. This was a bad idea, as ActionResult is an abstract class. When I hit http://localhost:2995/Account/Login, the MVC framework tried to instantiate ActionResult to fill in the default value for redirectAction. I simply reverted the parameter back to a string, and all was well.

public virtual ActionResult Login(string redirectPath = null)
    redirectPath = redirectPath ?? Url.Action(MVC.Home.Index());
Older Posts »