AngularJS + RequireJS Browser Test

JavaScript performance comparison

Revision 7 of this test case created

Preparation code

<style>
    [ng-cloak] {
        display: none
    }

    ul {
        overflow: auto;
        list-style: none;
        margin: 0;
        padding: 0;
        height: 200px;
    }

    li {
        float: left;
    }

    .section {
        float: none;
    }
</style>

<div id="angular_todoapp" id="ng-app" ng-controller="TodoController">
    <div id="angular_header" class="section">
        <h1>AngularJS + RequireJS TODOs</h1>
    </div>
    <div id="angular_main" class="section" ng-show="todos.length" ng-cloak>
        <ul id="angular_todo-list">
            <li ng-repeat="todo in todos | filter:statusFilter" ng-class="{completed: todo.completed, editing: todo == editedTodo}">
                <div class="view">
                    <label ng-dblclick="editTodo(todo)">{{todo.title}}</label>
                </div>
            </li>
        </ul>
    </div>
</div>

<script data-main="http://works.harolee.com/red-badger/performance-test/js/main.js" src="http://requirejs.org/docs/release/2.1.3/minified/require.js"></script>

Preparation code output

AngularJS + RequireJS TODOs

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
AngularJS + RequireJS x10
// async test
angular_clear();
for(var i = 0 ; i < 10 ; ++i) {
   angular_push();
}
pending…
AngularJS + RequireJS x20
// async test
angular_clear();
for(var i = 0 ; i < 20 ; ++i) {
   angular_push();
}
pending…
AngularJS + RequireJS x30
// async test
angular_clear();
for(var i = 0 ; i < 30 ; ++i) {
   angular_push();
}
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment