关于Javascript加载执行优化的研究报告

lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"gt;
lt;html xmlns="http://www.w3.org/1999/xhtml"gt;
lt;head id="head"gt;
nbsp;nbsp;nbsp; lt;titlegt;lt;/titlegt;
nbsp;nbsp;nbsp; lt;link href="Styles/Site.css" rel="stylesheet" type="text/css" /gt;
lt;/headgt;
lt;bodygt;
nbsp;nbsp;nbsp; lt;img src="1.jpg" width="200" height="300" /gt;
nbsp;nbsp;nbsp; lt;script type="text/javascript"gt;
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; function loadScript(url, callback) {
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; var script = document.createElement("script");
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; script.type = "text/javascript";

nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; //IE
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; if (script.readyState) {
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; script.onreadystatechange = function () {
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; if (script.readyState == "loaded" || script.readyState == "complete") {
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; script.onreadystatechange = null;
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; callback();
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; }
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; }
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; } else {
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; //非IE
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; script.onload = function () {
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; callback();
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; }
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; }
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; script.src = url;
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; document.getElementById("head").appendChild(script);
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; }
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; //第一步加载jquery类库
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; loadScript("jquery/jquery-1.4.1.js", function () {
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; //第二步加载hello.js
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; loadScript("js/hello.js", function () {
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; //第三步加载world.js
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; loadScript("js/world.js", function () {

nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; });
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; });
nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp; });
nbsp;nbsp;nbsp; lt;/scriptgt;
lt;/bodygt;
lt;/htmlgt;

大家也能看到，页面完全Load的时间其实也就310ms左右，大大提高了网页的下载呈现和友好型。

同样也可以看看腾讯网，他也是这么干的。

是不是非常的有用呢，本人这里也是花了些时日来做这些研究测试，希望小伙伴们能看到心里去，毕竟这也是“麻花藤”公司的解决方案，大家参考下吧

（编辑：PHP编程网 - 黄冈站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!