js文件的裝載和執行


1.瀏覽器對script引用的js文件分兩步,下載,下載完畢后馬上執行;這兩步都會阻塞瀏覽器繼續解析。

2.加入defer屬性,<script defer type="text/javascript" src="some.js" ></script>,瀏覽器會異步加載js,待DOMContentLoaded后順序執行js。

3.預加載js,自定義執行時機。

<script language="javascript" type="text/javascript">
    function cachejs(script_filename){
        var cache = document.createElement('object');
        cache.data = script_filename;
        cache.id = "coolshell_script_cache_id";
        cache.width = 0;
        cache.height = 0;
        document.body.appendChild(cache);
    }
 
    function loadjs(script_filename) {
        var script = document.createElement('script');
        script.setAttribute('type', 'text/javascript');
        script.setAttribute('src', script_filename);
        script.setAttribute('id', 'coolshell_script_id');
 
        script_id = document.getElementById('coolshell_script_id');
        if(script_id){
            document.getElementsByTagName('head')[0].removeChild(script_id);
        }
        document.getElementsByTagName('head')[0].appendChild(script);
    }
 
    function LoadJS(){
        var script = './alert.js';
        loadjs(script);
    }
 
</script>
 
 
...
 
<p style="cursor: pointer" onclick="LoadJS()">Click to load alert.js </p>
 
...
...
<script>
    cachejs('./alert.js');
</script>

4.seajs和requirejs

seajs是執行到引用文件代碼,再去引用下載,慢。

requirejs也是如此。

希望有什么選項能給個選擇,指定哪些文件要預加載,哪些文件是需要時才去加載。

 

參考鏈接:

http://coolshell.cn/articles/9749.html

http://www.cnblogs.com/coco1s/p/4010310.html

http://www.cnblogs.com/tiwlin/archive/2011/12/26/2302554.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM