While writing apps with angular.js (which I love) I've come across performance issues when rendering big lists. Like in searchbrew.com.

For example if I do this with 2500 docs. It takes a while to render and slows the page down.
<tr ng-repeat="doc in allDocs">
    <td><a ng-href="{{ "{{" }}doc.url}}">{{ "{{" }}doc.title}}</a></td>
    <td>{{ "{{" }}doc.description}}</td>
We can see and measure this performance using chromes flame chart in the javascript cpu profiler.

There are a bunch of angular.js digest cycles and stuff happening. One of the things thats slow is that angular is internally creating a watcher for each of the data bindings in the template.

The data binding and watching is whats great about angular.js but I dont need that here. Alternatively we can use a Mustache template and insert the elements manually with javascript. This performs alot better.

var template = document.getElementById('results-template').text;
var rendered = Mustache.render(template, docs);

<script id="results-template" type="text/html">
    {{ "{{" }}#docs}}
        <td><a href="{{ "{{" }}fields.url}}">{{ "{{" }}fields.title}}</a></td>
        <td>{{ "{{" }}fields.description}}</td>
    {{ "{{" }}/docs}}