Info

Argument arrays vs. arguments object.

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
 
<script>
  Benchmark.prototype.setup = function() {
    var updateUrl = 'UPDATE_URL',
        issuesUrl = 'ISSUES_URL',
        version = '1.2';
    
    function makeTags(tagNames, helper) {
        for (tag in tagNames) {
            window[tagNames[tag]] = helper(tag);
        }
    }
    
    function ns(string) {
        return 'NAMESPACE' + string;
    }
    
    function argumentsTagHelper(name) {
        return function(properties) {
            var children = Array.prototype.slice.call(arguments, 1),
                self = $('<' + name + '/>', properties);
    
            $.each(children, function(_, child) {
                if (child.jquery) {
                    self.append(child);
                }
                else {
                    self.html(child);
                }
            });
    
            return self;
        }
    }
    
    function arrayTagHelper(name) {
        return function(properties, children) {
            var self = $('<' + name + '/>', properties);
    
            if (typeof children === 'string') {
                self.html(children);
            }
            else if (children) {
                $.each(children, function(_, child) {
                    self.append(child);
                });
            }
    
            return self;
        }
    }
    
    makeTags({a: 'a', br: 'br', div: 'div', input: 'input'}, argumentsTagHelper);
    makeTags({a: 'a2', br: 'br2', div: 'div2', input: 'input2'}, arrayTagHelper);
  };
</script>

Preparation code output

Test runner

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

Java applet disabled.

div({'class': 'hover_menu'},
    div({id: 'arrowNub', 'class': 'hover_menu_nub'}),
    div({id: 'prompt', 'class': 'hover_menu_contents'},
        input({id: 'inputField', type: 'text'}),
        div({id: 'controls'},
            a({id: 'okButton', href: '#', 'class': 'submit_button'}, 'Save'),
            a({id: 'cancelButton', href: '#', title: 'Undo changes and close'},
                'Cancel'
            ),
            a({id: 'helpToggle', href: '#', 'class': ns('%ns%hidden')}, '+')
        ),
        div({id: 'help'},
            a({href: updateUrl, title: 'You have version ' + version, target: ns('_%ns%_update')},
                'Check for updates'
            ),
            br(),
            a({href: issuesUrl, target: ns('_%ns_issues')}, 'Report bug')
        )
    )
)

div2({'class': 'hover_menu'}, [
    div2({id: 'arrowNub', 'class': 'hover_menu_nub'}),
    div2({id: 'prompt', 'class': 'hover_menu_contents'}, [
        input2({id: 'inputField', type: 'text'}),
        div2({id: 'controls'}, [
            a2({id: 'okButton', href: '#', 'class': 'submit_button'}, 'Save'),
            a2({id: 'cancelButton', href: '#', title: 'Undo changes and close'},
                'Cancel'
            ),
            a2({id: 'helpToggle', href: '#', 'class': ns('%ns%hidden')}, '+')
        ]),
        div2({id: 'help'}, [
            a2({href: updateUrl, title: 'You have version ' + version, target: ns('_%ns%_update')},
                'Check for updates'
            ),
            br2(),
            a2({href: issuesUrl, target: ns('_%ns_issues')}, 'Report bug')
        ])
    ])
]);

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:

• Revision 1: published by Bulat on 3rd March 2013
• Revision 2: published by Bulat on 3rd March 2013

0 comments