Rob Christian

Concise: Experimental FE Framework

Prior to learning React, I started this experiment to test out some ideas I had around data binding and view rendering. I first created connected.js, a library that creates bindable JS Objects and Arrays, and triggers updates using events. This seemed successful, and next I wanted to use it in view rendering. I contemplated using Handlebars, but I had become frustrated at work after an external team had mangled our Handlebars templates and created unnecessary cleanup work. I came up with the idea of representing markup using JS objects. This approach means valid markup is always enforced.

{
    body: {
        h1: 'Page Title',
        div: {
            p1: 'Lorem ipsum',
            p2: 'delor sit amet'
        },
        button: function(self) {
            self.onClick(function() {
                alert('Click event!')
            })
        }
    }
}

The result was concise.js.

When minified, it's ~17 KB. After gzip, it's only ~6.8 KB.

Although it's only experimental, with such small size, it may show promise as a lightweight React alternative.

This is a to-do app using concise.js.

Encore: A Node MVC

Back when I was getting interested in node.js, I was frustrated by a seeming lack of structure in express projects. I preferred MVC at the time, so I started toying with ways to make a node app structured more like my favorite MVC's.

First I made a router (I didn't care for the routers I found on github). Express will test all routes in order, which isn't optimal. Runway.js instead tests each segment in order, and supports arbitrary RegEx patterns. Internally, runway uses standard tools from lodash to build a tree by creating each branch and then merging it into the tree.