rellampec/quick-ng-repeat

A much more quicker replacement for AngularJS ng-repeat directive

AngularJS directive for much more quicker lists rendering

Features

• Shallow list watch (ngRepeat uses deep watch)
• Animations support
• Special service to cause list render outside of digest cycle
• Smooth scrolling even on heavy compited lists (check example)
• About 200% performance boost
• Still hesitating? Try to scroll page with ng-repeat list and a page with quick-ng-repeat

Usage example:

Require quick-ng-repeat.js to your project and use this syntax in your templates:

<ul>
  <li quick-ng-repeat="item in list" quick-repeat-list="items">
    {{ item.name }}
  </li>
</ul>

Installation

Using bower package manager:

bower i quick-ngrepeat --save

Note the single hyphen in the package name

Using the browser:

<script src="quick-ng-repeat.js"></script>

Why we need the 'quick-repeat-list' attribute?

In quick-ng-repeat directive everything is done to make is really fast. So we store a special callback with name of this attribute. This is a full answer

Compared to usual ngRepeat

• Compare example/index.html (uses quickNgRepeat) and example/index_classic.html (uses classic NgRepeat)

Example

Directive live example in ./example

Try out the demo (try to scroll): page with ng-repeat list and page with quick-ng-repeat

To run example

cd example && python -m SimpleHTTPServer