5

With the new version of chrome something strange began to happen, it started throwing events $(window).load(...) before the event $(document).ready(...) or $(function (){...}).

This did not happen in previous versions of "chrome", and began to happen with version 31.

My environment:

jQuery 1.7.2
Chrome 31
IIS 7.5
ASP.NET MVC 4

I do not understand, but it happens so, if we first entered without cache works perfectly, but then with cache files css, js, img, start producirce this problem.

My current solution is to overwrite the function load of jquery, but I think that is the right solution.

Thank.

Edit

we can only play if the site on the server, we can not reproduce it locally (localhost)

Edit for more info This is a HTTP header of server:

HTTP/1.1 200 OK
Cache-Control: private, s-maxage=0
Content-Type: text/html; charset=utf-8
Server: Microsoft-IIS/7.5
X-AspNetMvc-Version: 3.0
X-AspNet-Version: 4.0.30319
X-Powered-By: ASP.NET
Date: Thu, 21 Nov 2013 23:02:37 GMT
Content-Length: 176350

Edit II

I tested this code to know if it is a problem with jQuery 1.7.1, but the same problem happened:

(function() {

    if(!window.addEventListener || !document.addEventListener) {
        console.log('not supported window.addEventListener');
    }

    var timeDCL;

    function addListener(obj, eventName, listener) {
        obj.addEventListener(eventName, listener, false);
    }

    function finishedDCL() {
        timeDCL = new Date();
        console.log('DONE document load/ready');
    }

    function finishedLoad() {
        if(timeDCL) {
            var delta = new Date() - timeDCL;
            console.log(delta + 'ms', 'DONE window load');
        }
        else {
            console.log('Ups DONE first window load');
        }
    }

    addListener(document, "DOMContentLoaded", finishedDCL);
    addListener(window, "load", finishedLoad);
}());

Result:

Ups DONE first window load
DONE document load/ready
andres descalzo
  • 14,887
  • 13
  • 64
  • 115
  • 1
    I don't see anything in the [`ready` documentation](http://api.jquery.com/ready/) promising that it occurs before `window.load`. And in fact, the last fallback it uses to make sure it fires *is* `window.load`. – T.J. Crowder Nov 21 '13 at 22:25
  • what is use case for needing both ? – charlietfl Nov 21 '13 at 22:26
  • Increasingly I'm convinced that `ready` is [the anti-pattern the Google Closure engineers claimed it is](https://groups.google.com/forum/#!msg/closure-library-discuss/G-7Ltdavy0E/RjllWWJTXAcJ). Just put your scripts at the end of the `body`, just before the closing `

    ` tag. That will run them when all elements above them exist, and almost certainly before `load`. Only vary from that if you have a really good reason (like, you don't control where the script tags go).

    – T.J. Crowder Nov 21 '13 at 22:27
  • I'm using 31.0.1650.57m and can't reproduce the issue, one fires when the DOM is ready, the other when the window has loaded, as it should be ? – adeneo Nov 21 '13 at 22:27
  • @charlietfl we also use "Kendo UI" an old version, and we need some features in load – andres descalzo Nov 21 '13 at 22:32
  • @adeneo I know it's a strange error, I tried another site like this http://goo.gl/MDpbj and does not happen, it only happens in the production server with chrome 31 – andres descalzo Nov 22 '13 at 16:02
  • 1
    I think [this](http://stackoverflow.com/a/11436111/2324685) is the answer to this question. – John29 Nov 13 '14 at 12:24

1 Answers1

1

TL;DR
Don't rely on load to always follow DOMContentLoaded.


I know I'm late in the game, but others might end up here, so I'm posting this. I bumped into this behavior when a unit test on a "DOM ready" implementation randomly failed. I found out that the reason was that it assumed that the window load event always came after DOMContentLoaded.

At least in Chrome - currently at version 52 - some stress conditions (possibly related to not-so-small javascript library, such as jQuery, but I can't say for sure) can occur so that a long time is spent parsing the DOM, which delays the DOMContentLoaded event.

Note that in every single failure the load event was fired just 1ms earlier.

It really looks like the browser is available to fire the two events at the same time, and chooses to go with the DOM first. For whatever reason.

jQuery.ready in fact fallbacks on window load.

A screenshot of DevTool in one such occasions

mjsarfatti
  • 1,725
  • 1
  • 15
  • 22