Sunday, May 15, 2011

List of ways HTML can download a resource

Recently two different projects required compiling a list of ways to trigger a download through HTML: Resource Timing and Preload Scanner optimization.

There's no centralized list in the WebKit source nor did a web search turn one up. So in hopes it may be useful to others, here's what I was able to come up with. Please let me know what I forgot (note that ways to download through CSS, JS, SVG and plugins are intentionally omitted).

  • <applet archive>
  • <audio src>
  • <body background>
  • <embed src>
  • <frame src>
  • <html manifest>
  • <iframe src>
  • <img src>
  • <input type=image src>
  • <link href>
  • <object data>
  • <script src>
  • <source src>
  • <track src>
  • <video poster>
  • <video src>

It might be interesting to compare the performance characteristics of downloads by resource type across browsers. For instance download priority, memory cacheability, parsing blocking and preload scan detection will vary.

6 comments:

Arturo said...

Does old stuff like count?

Arturo said...

Old stuff like "bgsound"... blogger stripped away the brackets.

Craig said...

Any element which takes a style tag can do it, e.g.:

<div style="background-image:url('some.gif')">Hi!</div>

Zoompf said...

the TABLE, TR, TH, and TD tags can also have a "background" attribute to an image which all modern browers will automatically download. This is also a useful XSS vector when coupled with a javascript: URI.

NicJ said...

This is great Tony. We may want to consider adding one or two of these to the RT spec - BODY and INPUT tags maybe? I don't think we need to be complete, as we have _OTHER, but those two download initiators are relatively commmon.

Perth web design said...

This is exactly what I needed, thank you for sharing these resources.