diff options
| author | Igor Minar | 2011-01-09 00:57:24 -0800 |
|---|---|---|
| committer | Igor Minar | 2011-01-10 10:24:12 -0800 |
| commit | c79aba92f6b058742c9ae20a9382f6abc68afcea (patch) | |
| tree | 4aece29942b7cde621c2a31284e3723314f30d74 | |
| parent | 84dedb81e79a56b4c81fe413a41e7247d8fa0572 (diff) | |
| download | angular.js-c79aba92f6b058742c9ae20a9382f6abc68afcea.tar.bz2 | |
bootstrap angular on "document ready" instead of window.onload
- use jqLite api to bootstrap angular
- when jQuery is present DOMContentLoaded or hacks for IE are used
- when jqLite is present DOMContentLoaded is used for modern browsers
and IE9 and window.onload is used for other browsers.
- test html for comparing DOMContentLoaded with window.onload
Closes #224
| -rw-r--r-- | perf/DCLvsWindowOnLoad.html | 37 | ||||
| -rw-r--r-- | src/angular.prefix | 2 | ||||
| -rw-r--r-- | src/angular.suffix | 9 | ||||
| -rw-r--r-- | src/jqLite.js | 13 | ||||
| -rw-r--r-- | src/scenario/angular.prefix | 2 | ||||
| -rw-r--r-- | src/scenario/angular.suffix | 9 |
6 files changed, 58 insertions, 14 deletions
diff --git a/perf/DCLvsWindowOnLoad.html b/perf/DCLvsWindowOnLoad.html new file mode 100644 index 00000000..b44b9114 --- /dev/null +++ b/perf/DCLvsWindowOnLoad.html @@ -0,0 +1,37 @@ +<!doctype html> +<!-- + +This test demonstrates the time difference between document's DOMContentLoaded and window's load events. + +--> +<html> + <head> + <script> + startTS = new Date().getTime(); + onDOMContentLoadedTS = 0; // default for browsers where DOMCL is not supported + </script> + <title>DOMContentLoaded test</title> + <script src="../build/angular.min.js" ng:autobind></script> + <script> + angular.element(document).bind('DOMContentLoaded', function(e) {onDOMContentLoadedTS = new Date().getTime()}); + angular.element(window).bind('load', function(e) { + onloadTS = new Date().getTime(); + log.innerHTML = 'start: ' + new Date(startTS) + '<br/>DOMContentLoaded: +' + (onDOMContentLoadedTS - startTS) + 'ms<br/> load: +' + (onloadTS - startTS) + 'ms'; + }); + </script> + </head> + <body> + <h1>DOMContentLoaded test</h1> + <p>{{ 'yay!' || 'angular starting...' }}</p> + + <img width="100px" src="http://lh5.ggpht.com/_BLyMhylclm0/TST_bbGH0zI/AAAAAAAAATY/oNUn9kivKN8/s912/1020047.jpg" /> + <img width="100px" src="http://lh5.ggpht.com/_MqEybfAuUFk/TSOOiegUlPI/AAAAAAAADHY/AEwEWc64_-M/s800/IMG_7294.JPG" /> + <img width="100px" src="http://lh3.ggpht.com/_LdjD3ua8rpE/TSOW99rwjZI/AAAAAAAAFC0/0qJRhhN45RM/s912/Saison%2010%20%2834%29.JPG" /> + <img width="100px" src="http://lh6.ggpht.com/_oy_-am3CVUw/TSOQBddZpwI/AAAAAAAACaw/ogFgoD79bVE/s912/P1100886.JPG" /> + <img width="100px" src="http://lh4.ggpht.com/_srSaA7ZN7oc/TDdxXbA_i1I/AAAAAAAAQ2w/ii3vgrnfCrM/s800/Urlaub10%20157.jpg" /> + <img width="100px" src="http://lh5.ggpht.com/_y6vXu6iRrfM/SIaYhRQBYNI/AAAAAAAAAmE/lV2NYwxtsQM/s912/North%20Dakota%20Trip%20014.JPG" /> + <img width="100px" src="http://lh5.ggpht.com/_Jjv9cIn9cS8/RuwZCgfOl6I/AAAAAAAAAOc/QrrMe8vpawg/s800/Shark%20Trip%20-%20day%202%20513.JPG" /> + + <p id="log"></p> + </body> +</html>
\ No newline at end of file diff --git a/src/angular.prefix b/src/angular.prefix index a1b4e151..be874795 100644 --- a/src/angular.prefix +++ b/src/angular.prefix @@ -21,4 +21,4 @@ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. */ -(function(window, document, previousOnLoad){ +(function(window, document){ diff --git a/src/angular.suffix b/src/angular.suffix index 7e86c5d5..3da27dc0 100644 --- a/src/angular.suffix +++ b/src/angular.suffix @@ -1,9 +1,6 @@ - window.onload = function(){ - try { - if (previousOnLoad) previousOnLoad(); - } catch(e) {} + jqLite(document).ready(function(){ angularInit(angularJsConfig(document)); - }; + }); -})(window, document, window.onload); +})(window, document); diff --git a/src/jqLite.js b/src/jqLite.js index cbba69ad..cbb2c7b8 100644 --- a/src/jqLite.js +++ b/src/jqLite.js @@ -87,6 +87,19 @@ JQLite.prototype = { })(this[0]); }, + ready: function(fn) { + var fired = false; + + function trigger() { + if (fired) return; + fired = true; + fn(); + } + + this.bind('DOMContentLoaded', trigger); // works for modern browsers and IE9 + jqLite(window).bind('load', trigger); // fallback to window.onload for others + }, + bind: function(type, fn){ var self = this, element = self[0], diff --git a/src/scenario/angular.prefix b/src/scenario/angular.prefix index fb9ae147..03ab29cb 100644 --- a/src/scenario/angular.prefix +++ b/src/scenario/angular.prefix @@ -21,5 +21,5 @@ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. */ -(function(window, document, previousOnLoad){ +(function(window, document){ var _jQuery = window.jQuery.noConflict(true); diff --git a/src/scenario/angular.suffix b/src/scenario/angular.suffix index 66843013..f3ef9f0d 100644 --- a/src/scenario/angular.suffix +++ b/src/scenario/angular.suffix @@ -1,10 +1,7 @@ var $scenario = new angular.scenario.Runner(window); - window.onload = function() { - try { - if (previousOnLoad) previousOnLoad(); - } catch(e) {} + jqLite(document).ready(function() { angularScenarioInit($scenario, angularJsConfig(document)); - }; + }); -})(window, document, window.onload); +})(window, document); |