文章轉至：http://ucren.com/blog/archives/17
以下這兩種情況：
- 網頁不間斷地下載並逐步把已下載完成的部分呈現出來；
- 網頁先顯示出一個框架後，等待一切資源準備完成再一起呈現出來。
假設這兩種情況所使用的時間一樣，用戶仍然會覺得後者比較慢或者卡，因爲後者在準備資源的過程中，網頁是靜止不動的，給用戶有了一段明顯等待時間的感覺，而前者雖然也會有等待時間，但相對比較短。
很多中大規模的網頁難以採取第一種方式，特別是現在富交互的網頁，都需要準備很多資源和數據，爲了緩和用戶焦躁的心理，於是我們在等待過程中加入了 loading，顯式的告知用戶網頁需要等待。最常見的 loading 形式是一張轉圈圈的 gif 圖。
但是轉圈圈是不斷反覆的，用戶並不能直觀地知道他還需要等多久，對於資源或數據比較大的網頁來說，轉不了幾圈，用戶也仍然會有慢的感覺，容易被放棄，於是我們採用了加載百分比，顯式地告訴他現在的進度，使用戶更加有耐心。
網頁加載百分比，這個 JS 是不能直接獲取的，網上有灰常多投機取巧的辦法，但最多也只能做到接近，而不是絕對準確，其實，加載百分比的這個數值，對於用戶來說是毫無意義的，用戶只要看到進度條有在動，就認爲網頁不卡，於是，我就有了下面的想法：
做一個進度條，它永遠在前進，卻永遠走不到 100%，只能無限接近於 100%，等到資源或數據加載完成了，再突然地使進度條走滿。具體思路：進條度分已加載和未加載兩部分，已加載一直在增加，未加載一直在減少，已加載每次增加的量剛好等於未加載部分的 n%（n < 100），於是，效果就會是加載不斷地接近 100% 卻走不到 100%，而且還能看到進度條一直是動的，用戶越是等待就越捨不得放棄，因爲進度條沒有停滯，用戶會認爲網頁加載一直在進行。
我寫了一個簡單的 Demo，進條度每次增加剩餘部分的 20%，爲了演示加載完成，在 10s 後強制結束進度條，請點擊這裏查看。