首先要弄清楚瀏覽器loading效果是由什麼引起的：
document.readyState ！= complete
一個文檔的 readyState 可以是以下之一：
loading / 加載
document 仍在加載。
interactive / 互動
文檔已經完成加載，文檔已被解析，但是諸如圖像，樣式表和框架之類的子資源仍在加載。
complete / 完成
文檔和所有子資源已完成加載。狀態表示 load 事件即將被觸發。
我們可以先嚐試下面的例子，當頁面js還在執行的時候，瀏覽器標籤顯示loading效果，直到10秒後結束。
<!doctype html>
<html>
<head>
</head>
<body>
<script>
function sleep(delay) {
var start = (new Date()).getTime();
while ((new Date()).getTime() - start < delay) {
continue;
}
}
sleep(10000)
</script>
</body>
</html>
而採用異步調用的方式，頁面在等待執行sleep（）方法，而document.readyState 此時已經等於complete ，loading效果早已消失。
<!doctype html>
<html>
<head>
</head>
<body>
<script>
function sleep(delay) {
var start = (new Date()).getTime();
while ((new Date()).getTime() - start < delay) {
continue;
}
}
setTimeout(function(){
console.log("b");
sleep(1000)
}，5000)
</script>
</body>
</html>
所以，要解決這些問題讓人覺得頁面加載速度快，文檔就儘可能輕裝上陣，能異步的則異步。