定位JS死循環位置

上週寫代碼寫了個死循環,當時不知道是死循環,整個代碼重構了一遍,還是跑不起來,Chrome一直在加載,控制檯JS代碼都顯示不出來,當時懷疑是死循環,但是代碼量那麼多,無從查起,而且沒有做版本管理,只能重寫代碼,難受

嘗試過重裝Chrome還是沒用,於是換了Microsoft EDGE,結果是代碼能加載出來,但是頁面表現不符合預期,整個頁面什麼都沒顯示出來。最後嘗試用Firefox,結果如下,出現了提示某個網頁讓您的瀏覽器變慢了。您想如何處理?

當然是選擇右邊的停止了,這時候JS代碼就加載出來了,發現控制檯有個打印timeout,死循環實錘了,並且給出了死循環的代碼行數,點進去,打斷點,刷新頁面

發現有個方法在執行死循環,上圖控制檯的打印也顯示出來了死循環的方法名setScreenSize,_changeCanvasSize,檢查代碼,查_changeCanvasSize的調用邏輯,發現只要設置了寬高,_changeCanvasSize就會被調用,而size方法會重設寬高,所以就形成了"_changeCanvasSize-size重設寬高-調用_changeCanvasSize"的死循環,註釋掉_changeCanvasSize裏的size,完美解決死循環問題。

以上是發現死循環到解決死循環的全過程,實際要查JS死循環,用Firefox執行JS代碼就能定位問題了。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章