Monday, June 02, 2014

Leaky Abstractions

Continuing with the idea of abstractions, while they're the basis for so many great accomplishments in Computer Science, these abstractions come at a cost. One of Joel Spolsky's great essays is The Law of Leaky Abstractions. In essence, he says that even when you have simplified something by abstracting it out, if the abstraction is non-trivial then sooner or later you'll have to look under the hood and deal with something at a lower level than the abstraction. Thus, the abstraction has "leaked" -- it's not as powerful as it claimed to be.

I'm currently developing a web application. I hadn't done any web development for about 8 years, which is of course an eternity in the web development world. The last time I touched JavaScript I was writing XMLHTTP requests by hand -- now I'm learning jQuery and Bootstrap and HTML5 and Groovy and (my new favorite) d3.js.

When developing for the web, if you ever think "there should be a module that does this," well there is. In my case I combined vanilla JavaScript with jQuery and Bootstrap and d3.js. Everything worked pretty well. Thanks to these libraries it's very easy to quickly create a site that looks pretty and does some cool things. d3 allows you to create graphs that are interactive and in general very visually appealing. I wanted users to be able to choose the graphs' start and end dates in a way that was equally appealing. So instead of having two dropdowns for start and end date, I found a library called jQRangeSlider that, well, uses jQuery to create a Range that's controlled with a Slider.

The promise of today's web development paradigm, while not explicit, is that you can mix & match these libraries to create something really neat. But here's where the abstraction leaked for me. Somehow adding the slider is interfering with d3's animations of the graphs, so when d3 does it's initial fade in, sometimes it stops prematurely and looks bad. And the slider sometimes doesn't choose the dates that I want it to. When I test these features of my webapp individually, they work fine, but combining them caused a leak somewhere and I haven't figured out where it is yet.  To be continued. . .