Problem Statement:

Loading JavaScript onto a page poses several performance issues. With a regular 
<script> tag, the UA waits for download and then waits for execution. The defer 
attribute helps by not blocking on download and deferring execution until later 
but preserves execution order; the async attribute helps by not blocking on 
download but does block on execution (the timing of which cannot be controlled) 
and does not preserve order.

Each of the existing solutions shifts around when download and execution 
happens by giving developers control over when the download occurs but only 
minimally when execution happens. As a result, developers have created ever 
more ingenius/fragile solutions to allow the separation of script downloads and 
execution. Examples:

1. Preloading JS without execution 
(http://www.phpied.com/preload-cssjavascript-without-execution/) by Stoyan 
Stefanov, which describes how to download JavaScript without execution it, as a 
cache-warming technique.
2. ControlJS (http://stevesouders.com/controljs/) by Steve Souders, which 
extends Stoyan's model to allow on-demand execution of scripts.
3. Gmail putting JavaScript in comments and then parsing later 
(http://googlecode.blogspot.com/2009/09/gmail-for-mobile-html5-series-reducing.html)
 to enable download without execution and then execution on-demand.

The ability to separate download and execution is a trend that has not only 
emerged, but continues to be explored. There are problems with the previous 
solutions, the biggest of which (in the case of #1 and #2) is the reliance on 
the browser caching behavior which may, in some instances, lead to a double 
download of the same script. It would be preferable for a standardized approach 
to achieve these goals.

Overview of Proposal:

Add a new attribute to the <script> called noexecute (for lack of a better 
term) that instructs the browser to download the script but do not execute it. 
Developers must manually execute the code by calling an execute() method on the 
script node. Simple example:

var script = document.createElement("script");
script.noexecute = true;
script.src = "foo.js";
document.head.appendChild(script);

//later
script.execute();

Proposal Details:
Because there are a lot of nuanced changes to <script> as a result of this 
proposal, I've written up a full description here:
https://docs.google.com/document/d/1s8_iRr1TcwcDtShgfuGThapwZtVXItymw5zc16D0Pz8/edit?hl=en&authkey=CNbDlo8J

I'd love some feedback on whether or not this a) makes sense and b) is feasible.

-Nicholas

______________________________________________
Commander Lock: "Dammit Morpheus, not everyone believes what you believe!"
Morpheus: "My beliefs do not require them to."

Reply via email to