Kevin Isom's avatar

Composing your web apps

I’ve been busy lately building Single Page Apps using the YUI App Framework and one thing I found is that when an app hits a certain size the actual Application container gets messy pretty quick. You spend all this time separating out the pieces of your app into views and models, but then the “glue” of the routes and event handling you end up with a massive “mess” of code. Even well structured code becomes difficult to maintain when it starts to creep up past a few hundred lines of well formatted code. So what can you do?

My first pass was just trying to mix in multiple apps.

This did not work. I realized that since each module has a views property they are getting overwritten, not merged, and the same was happening with the routes attribute as well. So that’s no good. So I considered extending App with something like .addSubApp() but that had it’s own problems.

What’s a dev todo? I really wanted the create syntax because that expressed what I wanted. Plus, I love mixing in modules, it allows for a lot of creation with little code. So I had a browse of what the YUI team are doing and decided that I would have to do something with that.

What I did

I took the core of the build method in base-built and added specific checks for views and routes and merged them together. This module is at my YUI App Extensions repository on github and I am happy to take comments or pull requests. I also have several other modules at that repo that are useful for App Development as well.