瀏覽器假死,瀏覽器堵塞,瀏覽器卡的原因

在Web開發的時候經常會遇到瀏覽器不響應事件進入假死狀態，甚至彈出“腳本運行時間過長“的提示框，如果出現這種情況說明你的腳本已經失控了。 一個瀏覽器至少存在三個線程：js引擎線程(處理js)、GUI渲染線程(渲染頁面)、瀏覽器事件觸發線程(控制交互)。 1：JavaScript引擎是基於事件驅動單線程執行的，JS引擎一直等待着任務隊列中任務的到來然后加以處理，瀏覽器無論再什么時候都只有一個JS線程在運行JS程序。 2：GUI 渲染線程負責渲染瀏覽器界面，當界面需要重繪(Repaint)或由於某種操作引發回流(reflow)時,該線程就會執行。但需要注意 GUI渲染線程與JS引擎是互斥的，當JS引擎執行時GUI線程會被掛起，GUI更新會被保存在一個隊列中等到JS引擎空閑時立即被執行。 3：事件觸發線程，當一個事件被觸發時該線程會把事件添加到待處理隊列的隊尾，等待JS引擎的處理。這些事件可來自JavaScript引擎當前執行的代碼塊如setTimeOut、也可來自瀏覽器內核的其他線程如鼠標點擊、AJAX異步請求等，但由於JS的單線程關系所有這些事件都得排隊等待JS引擎處理。 了解了瀏覽器的內核處理方式就不難理解瀏覽器為什么會進入假死狀態了，當一段JS腳本長時間占用着處理機就會掛起瀏覽器的GUI更新，而后面的事件響應也被排在隊列中得不到處理，從而造成了瀏覽器被鎖定進入假死狀態。另外JS腳本中進行了DOM操作，一旦JS調用結束就會馬上進行一次GUI渲染，然后才開始執行下一個任務，所以JS中大量的DOM操作也會導致事件響應緩慢甚至真正卡死瀏覽器，如在IE6下一次插入大量的HTML。而如果真的彈出了“腳本運行時間過長“的提示框則說明你的JS腳本肯定有死循環或者進行過深的遞歸操作了。 現在如果遇到了這種情況，我們可以做的不僅僅是優化代碼，html5的webWorkers提供了js的后台處理線程的API，它允許將復雜耗時的單純js邏輯處理放在瀏覽器后台線程中進行處理，讓js線程不阻塞UI線程的渲染。這個線程不能和頁面進行交互，如獲取元素、alert等。多個線程間也是可以通過相同的方法進行數據傳遞。