Is jquery ajax affected by document ready

JavaScript performance comparison

Test case created by BumbleB2na

Info

Testing whether jquery "DOM ready" handler has any effect on the triggering or handling of the response of asynchronous jquery ajax. To make the tests fair, a javascript timeout is used to simulate each jquery ajax trigger and response. Sample html markup has been included to better demonstrate loading of the DOM.

Preparation code

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

            <div id="page">
           
                <div id="header">
                    <h1>Sample markup</h1>
                </div>
               
                <div id="search">
                    <form action="" method="get">
                          <label>Search</label>
                          <input type="text" name="searchterm"></input>
                    </form>
                </div>
               
                <div id="main">
                    <div class="content yycphoto">
                        <img src="../img/photo.jpg" class="background" />
                       
                <div class="body overlay">
                    <h2>Photo Title</h2>
                </div>
           
                <div class="context overlay">
                    <h3>yycphoto</h3>
                    <a class="icon pin">Pin to dashboard</a>
                </div>
                    </div>

        <div>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas viverra luctus nulla eu consequat. Ut vehicula fringilla purus ut elementum. Vivamus erat elit, venenatis eu euismod a, hendrerit sed lacus. Donec mattis justo vitae leo eleifend a rhoncus ante semper. Aenean ultrices auctor posuere. Nulla facilisi. Vivamus laoreet, magna quis fringilla consectetur, metus eros eleifend justo, et condimentum arcu nibh pulvinar felis. Ut et ante turpis. Quisque luctus enim sit amet neque porta ullamcorper. Morbi vehicula purus et nisi consequat pharetra. Donec tincidunt dictum lorem vitae ullamcorper. Sed malesuada laoreet quam vel volutpat. Vestibulum eu nunc orci. Nulla in odio nec lorem facilisis lacinia.

Integer tincidunt vulputate massa, ultrices tincidunt justo lacinia id. Curabitur vitae consequat magna. Phasellus tristique, lacus sed sollicitudin bibendum, tortor neque molestie diam, vel fermentum leo dui at ligula. Nullam nunc erat, mattis ut molestie vitae, malesuada ac nunc. Nullam adipiscing lectus ac dolor condimentum rhoncus. Donec convallis viverra orci at laoreet. Aenean quis felis augue. Nulla gravida orci vitae ligula iaculis mollis. Nulla adipiscing, tellus vel bibendum suscipit, dolor massa consequat ipsum, at pellentesque leo ligula in sapien. Suspendisse potenti.

Morbi ut lacus eget augue vehicula tincidunt in ac ligula. Fusce sed aliquam nisl. Morbi cursus tristique augue, quis commodo nulla dignissim nec. Sed tristique congue pretium. Nam ac tellus pharetra lectus blandit euismod eget a tortor. Fusce felis orci, feugiat semper tristique elementum, imperdiet nec sapien. Nam gravida venenatis nisi egestas tincidunt. Nam quis porttitor eros. Curabitur id elit lorem. Vestibulum non nisi lorem, a sollicitudin ipsum. In a enim ut felis molestie ultricies quis et dolor. Suspendisse gravida bibendum mi non accumsan. Donec egestas sem sed ipsum sollicitudin imperdiet.

Sed quis nisi et tellus commodo vestibulum. Curabitur ipsum lacus, consectetur at pharetra eu, vulputate sed neque. Phasellus egestas ultricies ullamcorper. Cras interdum accumsan urna et viverra. Vestibulum risus lorem, dictum bibendum congue in, laoreet id ipsum. Fusce elementum risus sollicitudin tortor molestie at mattis lacus sodales. Nam et accumsan purus. Vestibulum consectetur volutpat bibendum. In et ullamcorper purus. Duis tempor lobortis dapibus. Sed porttitor sem tempus nulla semper dapibus.

Integer viverra varius sapien sed dapibus. Morbi nunc elit, imperdiet ac vestibulum sit amet, congue eu enim. Cras leo lacus, placerat non posuere in, congue hendrerit ante. Proin vel nisl in nulla ultrices mattis. Aenean feugiat dignissim sapien vel ullamcorper. Donec dictum condimentum tortor, accumsan bibendum ante scelerisque eget. Vestibulum interdum facilisis mauris, sed luctus arcu tristique sollicitudin. Nam quis ligula risus. Quisque vel urna vel orci faucibus tristique et quis sapien. Aliquam rutrum elementum eros in mattis. Praesent ultrices auctor auctor.

        </div>
                </div>
               
                <ul id="footer">
                    <li><a href="#">Privacy<span class='gt-tiny'> Policy</span></a></li>
                    <li><a href="#">Terms<span class='gt-tiny'> and Conditions</span></a></li>
                    <li><a href="#">Contact<span class='gt-tiny'> Us</span></a></li>
                </ul>
               
                </div>
<script>
Benchmark.prototype.setup = function() {
    var TIMEOUT_VALUE = 1500;
};
</script>

Preparation code output

Photo Title

yycphoto

Pin to dashboard
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas viverra luctus nulla eu consequat. Ut vehicula fringilla purus ut elementum. Vivamus erat elit, venenatis eu euismod a, hendrerit sed lacus. Donec mattis justo vitae leo eleifend a rhoncus ante semper. Aenean ultrices auctor posuere. Nulla facilisi. Vivamus laoreet, magna quis fringilla consectetur, metus eros eleifend justo, et condimentum arcu nibh pulvinar felis. Ut et ante turpis. Quisque luctus enim sit amet neque porta ullamcorper. Morbi vehicula purus et nisi consequat pharetra. Donec tincidunt dictum lorem vitae ullamcorper. Sed malesuada laoreet quam vel volutpat. Vestibulum eu nunc orci. Nulla in odio nec lorem facilisis lacinia. Integer tincidunt vulputate massa, ultrices tincidunt justo lacinia id. Curabitur vitae consequat magna. Phasellus tristique, lacus sed sollicitudin bibendum, tortor neque molestie diam, vel fermentum leo dui at ligula. Nullam nunc erat, mattis ut molestie vitae, malesuada ac nunc. Nullam adipiscing lectus ac dolor condimentum rhoncus. Donec convallis viverra orci at laoreet. Aenean quis felis augue. Nulla gravida orci vitae ligula iaculis mollis. Nulla adipiscing, tellus vel bibendum suscipit, dolor massa consequat ipsum, at pellentesque leo ligula in sapien. Suspendisse potenti. Morbi ut lacus eget augue vehicula tincidunt in ac ligula. Fusce sed aliquam nisl. Morbi cursus tristique augue, quis commodo nulla dignissim nec. Sed tristique congue pretium. Nam ac tellus pharetra lectus blandit euismod eget a tortor. Fusce felis orci, feugiat semper tristique elementum, imperdiet nec sapien. Nam gravida venenatis nisi egestas tincidunt. Nam quis porttitor eros. Curabitur id elit lorem. Vestibulum non nisi lorem, a sollicitudin ipsum. In a enim ut felis molestie ultricies quis et dolor. Suspendisse gravida bibendum mi non accumsan. Donec egestas sem sed ipsum sollicitudin imperdiet. Sed quis nisi et tellus commodo vestibulum. Curabitur ipsum lacus, consectetur at pharetra eu, vulputate sed neque. Phasellus egestas ultricies ullamcorper. Cras interdum accumsan urna et viverra. Vestibulum risus lorem, dictum bibendum congue in, laoreet id ipsum. Fusce elementum risus sollicitudin tortor molestie at mattis lacus sodales. Nam et accumsan purus. Vestibulum consectetur volutpat bibendum. In et ullamcorper purus. Duis tempor lobortis dapibus. Sed porttitor sem tempus nulla semper dapibus. Integer viverra varius sapien sed dapibus. Morbi nunc elit, imperdiet ac vestibulum sit amet, congue eu enim. Cras leo lacus, placerat non posuere in, congue hendrerit ante. Proin vel nisl in nulla ultrices mattis. Aenean feugiat dignissim sapien vel ullamcorper. Donec dictum condimentum tortor, accumsan bibendum ante scelerisque eget. Vestibulum interdum facilisis mauris, sed luctus arcu tristique sollicitudin. Nam quis ligula risus. Quisque vel urna vel orci faucibus tristique et quis sapien. Aliquam rutrum elementum eros in mattis. Praesent ultrices auctor auctor.

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
wrap all in doc ready
// wait until DOM is ready
$(document).ready(function() {
    // mock jquery ajax request
    setTimeout(function(){
        // do something with data
        alert("Hello")
    },TIMEOUT_VALUE);
});
pending…
doc ready as needed
setTimeout(function(){
    $(document).ready(function() {
        alert("Hello");
    });
},TIMEOUT_VALUE);
pending…
x2 doc ready as needed
setTimeout(function(){
    $(document).ready(function() {
        alert("Hello");
    });
},TIMEOUT_VALUE);

setTimeout(function(){
    $(document).ready(function() {
        alert("Hello again");
    });
},TIMEOUT_VALUE);
pending…
wrap all in x2 doc ready
$(document).ready(function() {
    setTimeout(function(){
        // 2nd doc ready should fire instantly since already "ready"
        $(document).ready(function() {
            alert("Hello");
        });
    },TIMEOUT_VALUE);
});
pending…
wrap x2 in doc ready
$(document).ready(function() {
    setTimeout(function(){
        alert("Hello");
    },TIMEOUT_VALUE);
});

$(document).ready(function() {
    setTimeout(function(){
        alert("Hello again");
    },TIMEOUT_VALUE);
});
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