Explaining reopen and enhance

[Yehuda Katz]

If you guys have been watching master, you may have noticed that I added a couple of core constructs to the SproutCore object model to facilitate modularizing some of the largest files in the codebase (like view.js).

Class#reopen

Example:

SC.View.reopen({

  prop: val

});

This makes it possible to add new properties to an existing class, and have them be processed the same way they are during #extend. For instance, this will detect bindings, observers, calculated properties and more. The main purpose is to make it possible to define huge classes like SC.View in several files. It also makes it possible for frameworks to properly extend classes defined in other frameworks.

Function#enhance

Example:

SC.View.reopen({

  render: function(original, context) {

    original(context);

    // more stuff

  }.enhance()

})

This makes it possible to define cross-cutting concerns entirely in their own files. Specifically, I added it to make it possible to move theming-specific concerns into theming.js. In this case, theming.js extends applyAttributesToContext to add the renderDelegate's class to the context:

  applyAttributesToContext: function(original, context) {

    original(context);

    var renderDelegate = this.get('renderDelegate');

    if (renderDelegate && renderDelegate.name) {

      context.addClass(renderDelegate.name);

    }

  }.enhance()

The names are of course up for discussion, and my initial implementation of enhance is quite a bit slower than my ultimate plan for the feature. Just wanted to keep everyone in the loop as I work on bringing some sanity to the codebase.

Yehuda Katz
Architect | Strobe
(ph) 718.877.1325