Javascript

I have been taking a bit of a break from Python in order to experiment with Javascript and user interfaces for work. My idea was to implement a basic WSGI-ish framework or pattern for building Javascript applications. The two things I learned were:

1. I am not very knowledgeable in Javascript
2. The functional pattern of WSGI is extremely powerful

My first discovery is pretty typical as I have never had the opportunity to work with Javascript long enough to really understand the subtleties. This time around I made a point to avoid any library that wasn't exceptionally obvious to me everything it was doing. I settled on the DOMAss (as in DOM Assistant) library since it was extremely small, modular and really didn't give much except for a few functions. There is still a good bit of misunderstanding on my part, but overall, it has been good for me to learn things myself.

The second discovery I made was actually clear after I got sick of complicating my toy design and just hardcoded everything. This was partly because I really didn't understand how to "use" my objects correctly with the somewhat confusing "prototype" attribute. Once I got rid of my desire to figure out the syntax, things fell into place. I should mention there is a little gnawing at the back of my head for giving up on the understanding the Javascript prototypes, but I am sure I will tackle it sooner or later.

The very simple pattern I used was attaching a click event to anchors that had a 'rel' of 'jsurl', which triggered a make_request function. The make_request was essentially my entry point for a WSGI-ish stack. In this case, the idea was to create a page that had links that without Javascript would just go to the resources but with Javascript, could offer a dynamic interface. I didn't get very far in my ideal goals, but I made a decent example of my design so that was enough for me.

When a 'jsurl' link was clicked, the event would be contained in an 'environ' variable along with the link itself. I then created some middleware that worked very simply like Routes. WSGI uses the environ for passing around headers and details associated with the request, but in this case it is simply passing along a context for the next function to act within. I sort of used tail recursion in that I simply iterated over a list. The make_request middleware looked something like this:

var make_request = function(evt) {
    // the context 'this' is the url that was clicked
    var environ = { 'event' : evt, 'this' : this }
    for (var i=0; i < wsgi.stack.length; i++} {
        environ = eval(wsgi.stack[i] + "(environ)");
    }
}

Ok, so the tail recursion aspect really isn't there, but I had considered passing along a callable (or at least something like a callable) to the middleware functions. I decided just iterating the list made more sense because I didn't need the downstream/upstream aspect seen in WSGI.

Overall, the technique was very simple and worked well. I realized that it would be beneficial to consider making stacks for different types of operations. For example, there could be animation stacks that are called at intervals with event based stacks setting keys for those animation stacks, so something like an AJAX request would be called and do the slick animation when stuff happens. I realize that a lot of this sort of thing is already implemented using the traditional event model, but I always would get confused with event based programming. It isn't the model, but keeping track of everything in the network of events that makes it difficult. This way, I have one event that goes through everything possible. Even if there were hundreds of middleware, I think as long as I am punting doing something as quickly as possible, things should be quick and I will be able to write more concise code.