Modernizr.load -> MIME mismatch errors.

• Component: WebCore Misc.
• Status: RESOLVED WONTFIX

[Mike West]

Report from a user: "When using Modernizr.load for loading javascript you get the following warning for every loaded javascript: `Resource interpreted as Image but transferred with MIME type application/x-javascript: ....`".

I'm not sure this is something we want to fix, but it looks like Firefox has a workaround that avoids the console spam (uses an `object` element with a type set). Would be worth researching here.

[Mike West]

CCing Inspector folks. :)

In short, "Modernizr.load" and other libraries do some mildly hacky prefetching by loading JavaScript via an Image element (or Object element in Firefox).

Given that it's a fairly widely-used technique, would you be ok with providing some sort of workaround for this message? The simplest solution would be to allow script MIME types to be loaded as images without a warning by adding a check to _mimeTypeIsConsistentWithType.

WDYT?

[Mike West]

http://yepnopejs.com/ is a live example of the console spam I'd like to avoid. :)

[Ralph Holzmann]

This is not a bug in webkit. We preload scripts in webkit by using images. Something similar to:

var img = document.createElement("img");
img.onload = function() {
  // jQuery preloaded
}
img.src = "jquery.js";

This allows us to preload a handful of scripts in parallel while controlling their execution. It's a hack -- but it works. We use different techniques for different browsers. The mime warnings are just that: warnings. They don't affect your page performance, they simply throw out those annoying warnings. An easy fix in the Chrome tools is to command click just "logs" and "errors" in the console. This way you'll see all logs and errors, but no warnings.

http://grabs.ralphholzmann.com/rlt.png

I don't think it should be fixed on the browser level. If it annoys you that much, and you're serious about your page, use and AMD loader.


Ralph Holzmann - yepnope.js coauthor

[Mike West]

(In reply to comment #3)
> This is not a bug in webkit. 

No, it isn't. The MIME type doesn't match, and warning about it is perfectly reasonable.

That said, when a developer has a good reason for doing something that we warn about, I think it's equally reasonable to consider whether we should allow them to bypass the warning. You're apparently able to do that in Firefox by preloading with an object tag where you've set the type explicitly. Perhaps we could do something similar in the Inspector.

> I don't think it should be fixed on the browser level. If it annoys you that much, and you're serious about your page, use and AMD loader.

In a quick survey[1], I got two reports from your users who disagree with you. :)

This isn't a huge problem, it's an annoyance. I'd like to make it less annoying. *shrug*

[1]: https://plus.sandbox.google.com/104437754419996754779/posts/SdCRqEVjUjs

[Pavel Feldman]

So you are suggesting to suppress certain warnings so that the frameworks could use hacky techniques? I don't think this is a good idea. It will also lead to the false negatives.

I think what inspector is missing is a more powerful console filtering solution that would mute these messages.

[Mike West]

(In reply to comment #5)
> So you are suggesting to suppress certain warnings so that the frameworks could use hacky techniques? I don't think this is a good idea. It will also lead to the false negatives.

That's not exactly how I'd have phrased it. :)

> I think what inspector is missing is a more powerful console filtering solution that would mute these messages.

Makes sense. Do you have a feel for how something like that might work, or is there already a bug filed?

[Pavel Feldman]

> Makes sense. Do you have a feel for how something like that might work, or is there already a bug filed?

I am sure there was a bug on a better console filtering: either upstream or downstream. Don't have a pointer to it though.