H1D/ember-cloaking

Support for not rendering offscreen views in an Ember app for performance

ember-cloaking

Support for not rendering offscreen views in an Ember app for performance and lowered memory usage.

Extracted from Discourse's infinite scrolling.

Usage

1. Include ember-cloaking.js in your project.
2. To display a collection of cloaked items, use {{cloaked-collection}} in your handlebars templates like this:

  {{cloaked-collection cloakView="post" content=postStream.posts}}

cloakView is the name of the view to render in the collection. post would render PostView.

itemController is the name of the controller for items in collection; if not set will be resolved using cloakView name

defaultHeight is the height of the cloaked views by default. You should pick a value that is in the ballpark of your average view height. Note: Your views don't have to be the same height.

content is the collection of items to display.

loadingHTML is the HTML you want to render while the cloaking is loading. If omitted it will default to "Loading..."

iScroll or other scrollers

Demo

  {{cloaked-collection cloakView="item" content=model wrapperTopBinding="view.scrollTop" wrapperHeightBinding="view.height"}}

wrapperTop is the current scroll position like native element.scrollTop

wrapperHeight is the height of the "window" in which content scrolling

License

MIT