prop·er - of the required type; suitable or appropriate. "an artist needs the proper tools". dev tools aren't any different.


A tale as old as time—ProperJS is more of a philosophy than anything else. Don’t get me wrong, its full of useful Javascript libraries that I use on a daily basis in my web development practice, but the motivation behind creating this space for myself to learn and grow within comes from a very personal place. A rather opionionated place you might say. I want less. I want it clean and readable. I want to start with a blank canvas and paint on it with only the code that establishes the art of the thing. I’m a developer that doesn’t like cruft and rather enjoys iterating ideas and code until the output makes me smile from ear to ear. Pride? Maybe. Feels more like attunement to me.


With ProperJS you’ll notice a varietal arrangement of Javascript libraries and utility models. Most of them are relatively small, performing simply one key function or a key set of related functions. Some ProperJS modules are a systematic construction of other, smaller or more targeted modules. This is what I think of as the quintessential Kit of Parts methodology. I’ve always carried this lens with development and it definitely translates seemlessly into the design landscape. Within the ProperJS Kit of Parts are all kinds of modules ranging from purely utilitarian necessity all the way to a constant need to tinker and play with the code.


scrolling resizing staggering debouncing throttling slacking routing matching searching loading querying controlling parsing logging tweening easing…


Along with all the useful things for developing client-side web applications are some self-interested concepts, mostly 2D gaming related. Stuff like konami-code—Listen and handle the input: up, up, down, down, left, right, left, right, b, a. Game on! Or Blit, a simple gamecycle engine ( 60fps ). Also Hobo.js, a die-hard minimalist jQuery alternative in just 7–11k minified. There’s a lot going on in ProperJS and its all lightweight.


Aside from the individual modules in ProperJS, I use the ecosystem as a whole to create my own web application micro framework if you will. I really set to work revising this app structure when I was in heavier development for my Clutch scaffold. At that point I abstracted out the app source as its own container within ProperJS. I have issues with doing this, however. I work in many different environments with Javascript. Obviously ProperJS focuses on client-side, so web apps. But it has a handful of good, pure node.js modules as well. Trying to create one unified app source that works across certain environments is a little tough. Mostly because one of the environments I use is Squarespace and that has some very specific code you need and ONLY need in the Squarespace template environment. ProperJS/app works well for a more client-side-js-agnostic system like Clutch—what works for Clutch would work for anything, even a static site. Alas, when I set out to create what you see before you now, Boxen, I pulled the app source directly into the SDK repository and called it good. No nonsense, just core code :)


With its roots in modern web development, 2D gaming with Javascript and rapid prototyping for the web—ProperJS has kept me going for a long time. It’s not a famous framework or library. It’s not used by many, mostly just myself. It was used on my dev team at an agency I worked at where I first started working on ProperJS. It was called Funpack at the time, don’t ask. I don’t know if any of the ProperJS modules still get use around there, probably not. Although ImageLoader is a godsend if you ask me. I continue to tinker and maintain what IS there and use it to its fullest. I’ve always loved working with custom crafted code. Knowing very well how eveything is interconnected and working together. No surprises, just progress. ProperJS has served me well and it will continue to do so. I can ship complex yet shockingly slim web apps with this Kit of Parts. This site is under 80k for it’s JS and that’s only because I’m being aggregious and loading Greensock. Don’t do that and you’re down to 40k or so. Not bad. Used to average between 30–40k. The growth is slow because with ProperJS we only use what we absolutely need and only when we really need it.


More works…