jquery context vs find

JavaScript performance comparison

Test case created

Preparation code

<body class="
        create customer
">

        <header>
                <div class="container">
                        <h1>Συστημα Διαχειρησης Συνταξεων</h1>
                        <p>logged in as ...</p>
                </div>
        </header>

        <section id="main">
               
        <h2><span>Προσθηκη Πελατη</span></h2>

        <form action=".">
                <fieldset>
                        <legend>Στοιχεια Πελατη</legend>
                        <div class="fields">
                                <div class="column">
                                        <div class="field   first_name">
        <label for="id_first_name">Ονομα</label> <input id="id_first_name" type="text" name="first_name" maxlength="255" />
</div>
                                        <div class="field   last_name">
        <label for="id_last_name">Επωνυμο</label> <input id="id_last_name" type="text" name="last_name" maxlength="255" />
</div>
                                        <div class="field   fathers_name">
        <label for="id_fathers_name">Ονομα Πατρος</label> <input id="id_fathers_name" type="text" name="fathers_name" maxlength="255" />
</div>
                                        <div class="field   mothers_name">
        <label for="id_mothers_name">Ονομα Μητρος</label> <input id="id_mothers_name" type="text" name="mothers_name" maxlength="255" />
</div>
                                        <div class="field   birthdate">
        <label for="id_birthdate_0">Ημ. γεννησης</label> <div class="split-date-field"><input id="id_birthdate_0" type="text" name="birthdate_0" maxlength="2" /><select name="birthdate_1" id="id_birthdate_1">
<option value="1">Ιανουάριος</option>
<option value="2">Φεβρουάριος</option>
<option value="3">Μάρτιος</option>
<option value="4">Απρίλιος</option>
<option value="5">Μάιος</option>
<option value="6">Ιούνιος</option>
<option value="7">Ιούλιος</option>
<option value="8">Αύγουστος</option>
<option value="9">Σεπτεμβρης</option>
<option value="10">Οκτώβρης</option>
<option value="11">Νοέμβρης</option>
<option value="12">Δεκέμβρης</option>
</select><input id="id_birthdate_2" type="text" name="birthdate_2" maxlength="4" /></div>
</div>

                                        <div class="label">Επικοινωνια</div>
                                        <div id="contactmethod_set" class="formset">
                                                <input type="hidden" name="contactmethod_set-TOTAL_FORMS" value="1" id="id_contactmethod_set-TOTAL_FORMS" /><input type="hidden" name="contactmethod_set-INITIAL_FORMS" value="0" id="id_contactmethod_set-INITIAL_FORMS" /><input type="hidden" name="contactmethod_set-MAX_NUM_FORMS" id="id_contactmethod_set-MAX_NUM_FORMS" />
                                               
                                                        <div class="form">
                                                                <input type="hidden" name="contactmethod_set-0-id" id="id_contactmethod_set-0-id" />
                                                                <div class="field  contactmethod_set-0 method">
         <select name="contactmethod_set-0-method" id="id_contactmethod_set-0-method">
<option value="" selected="selected">---------</option>
<option value="0">Κινητό</option>
<option value="1">Σταθερό</option>
</select>
</div>
                                                                <div class="field  contactmethod_set-0 value">
         <input id="id_contactmethod_set-0-value" type="text" placeholder="Αριθμός..." name="contactmethod_set-0-value" maxlength="255" />
</div>
                                                                <div class="field  contactmethod_set-0 comment">
         <textarea id="id_contactmethod_set-0-comment" rows="10" placeholder="Σχόλιο..." cols="40" name="contactmethod_set-0-comment"></textarea>
</div>
                                                                <input type="checkbox" name="contactmethod_set-0-DELETE" id="id_contactmethod_set-0-DELETE" />
                                                                <span class="delete">διαγραφη</span>
                                                        </div>
                                               
                                                <span class="add">Προσθηκη</span>
                                        </div>
                                </div>
                                <div class="column">
                                        <div class="field   trn">
        <label for="id_trn">ΑΦΜ</label> <input id="id_trn" type="text" name="trn" maxlength="9" />
</div>
                                        <div class="field   tax_office">
        <label for="id_tax_office">ΔΟΥ</label> <input id="id_tax_office" type="text" name="tax_office" maxlength="255" />
</div>
                                        <div class="field   address">
        <label for="id_address">Διευθυνση</label> <textarea id="id_address" rows="10" cols="40" name="address"></textarea>
</div>
                                        <div class="field   postal_code">
        <label for="id_postal_code">Ταχ. Κωδικας</label> <input id="id_postal_code" type="text" name="postal_code" maxlength="5" />
</div>
                                </div>
                        </div>
                </fieldset>
        </form>

        </section>

        <footer>
                Copyright 2012 InDev
        </footer>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

</body>

 
<script>
Benchmark.prototype.setup = function() {
    var $el = $('#contactmethod_set');
    var el = $el[0];
};
</script>

Preparation code output

Συστημα Διαχειρησης Συνταξεων

logged in as ...

Προσθηκη Πελατη

Στοιχεια Πελατη
Επικοινωνια
διαγραφη
Προσθηκη
Copyright 2012 InDev

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
context element
$('.delete', el);
pending…
context jquery object
$('.delete', $el);
pending…
.find
$el.find('.delete');
pending…

You can edit these tests or add even more tests to this page by appending /edit to the URL.

Compare results of other browsers

0 comments

Add a comment