脚本标记中的Javascript下载进度

有没有什么方便的方法来观看我写在里面的巨大javascript库文件的下载进度

标签

---

显然，

$.ajax（）

进度条没有用。在headjs项目中，我可以找到设置进度设置，jsut

ready（）

您可以使用XMLHttpRequest发出GET，使其缓存在浏览器中，然后使用JavaScript将标记添加到文档中，使其几乎立即加载

var req = new XMLHttpRequest(); 
req.onprogress=myUpdateProgressFunction; // whatever you want to do!
req.open('GET', '/js/hugelib.js', true);  
req.onreadystatechange = function (aEvt) {  
    if (req.readyState == 4) 
    {  
        var hugeScript = document.createElement('script');
        hugeScript.setAttribute('src','/js/hugelib.js');
        document.head.appendChild(hugeScript);
    }  
};  
req.send(); 

你也可以考虑用Ajax get的结果设置HugScript。文本，但我相当肯定它会表现不佳。

作为进一步的改进，您可以首先发出HEAD请求以查看该项是否已经缓存，如果已经缓存，则不要尝试AJAX GET。同样，您必须分析性能，看看这是否真的提高了性能，或者总体上没有

---

注意：我还没有测试这种模式的行为，我真诚地认为浏览器缓存将以绅士的方式运行。

我想到的选项：

• 使用一个小js代码创建一个进度条，然后动态加载代码（通过XHR）。我在这里看到两个问题：您需要做一些技巧来了解进度，并且您正在添加更多要加载的代码，但是第一个可以，第二个。。。嗯，再多说几句话不会有多大影响。一个已经创建的代码是CreateJS的一个模块
• 使用minify或任何类似工具来最小化代码的大小。使用这些工具可以节省惊人的字节数

---

如果它太大以至于你需要可视化它的进度，那么它足够大，你可以拆分它。@Amit，我使用的是Emscirpen移植库。将其解析为小型库并不困难。是否有任何库包含此解决方案？遗憾的是，requirejs没有进度条（据我所知）。对于emscripten库来说，缩小是不够的。无论如何，谢谢你的回答。