摘要:在文本輸入框中過濾的字段中輸入在列表中查找總時間超過毫秒的定時器函數(shù)。當(dāng)瀏覽器在處理用戶的手勢的情景下,定時器函數(shù)執(zhí)行超過毫秒也會觸發(fā)該消息英文原文如果閱讀中文后還無法理解可以參考英文截圖
原文地址:http://stackoverflow.com/questions/37367200/what-is-the-deferred-long-running-timer-tasks-warning-in-the-chrome-devtools
在開發(fā)過程中遇到了題目描述的問題,使用 Google 搜索,中文答案很少,而且沒有令人滿意的。就在segmentfault上提了一個問題,而且很快我就發(fā)現(xiàn)被很多人收藏了該問題(SF網(wǎng)站問題被收藏時,會收到消息提醒)。也有一些網(wǎng)友回答該問題,但是一直沒有優(yōu)質(zhì)的答案。
后來在 Stack overflow 找到比較好的答案,這個回答也是點“贊”數(shù)想當(dāng)高的。英文好的同學(xué)建議直接閱讀英文,英文不好的同學(xué)可以閱讀下面我的翻譯(英文水平有限,沒有按照字句翻譯,只是根據(jù)我對他們的理解來翻譯)。
瀏覽器中報錯的信息如下: 答案描述:這個問題主要發(fā)生在當(dāng)Blink(Chrome的渲染引擎)決定延時執(zhí)行一個定時器函數(shù)的時候。比如:通過requestAnimationFrame,setTimeout,setInterval這些對象執(zhí)行的函數(shù)。因為這些對象在執(zhí)行函數(shù)時至少要花費 50ms的時間,如果在這個時候剛好有用戶在網(wǎng)頁上輸入操作,Blink會優(yōu)先執(zhí)行用戶的輸入操作(比如:scrolls事件,tap事件)。
如果你的JavaScript代碼在運行時也出現(xiàn)了這樣的問題,可能是使用者觸發(fā)了同樣的“行為”(指在執(zhí)行定時器函數(shù)時,剛好有用戶在操作)。下面有幾種方式來復(fù)現(xiàn)這個問題:
通過timer(定時器函數(shù))觸發(fā)了一段執(zhí)行時間比較長的JavaScript代碼;
在移動端(或者是在開發(fā)者工具中模擬移動設(shè)備的模式下);
當(dāng)手指與屏幕發(fā)生了真實的接觸,并且發(fā)生了輸入或者是滾動的行為。觸摸頁面或是快速的滾動頁面也會觸發(fā)這個問題,但是非常少見的而且不容易復(fù)現(xiàn)的。
使用開發(fā)者工具中的“CPU throttling”模式延長JavaScript代碼執(zhí)行時間,可以讓你有更好的時機去復(fù)現(xiàn)該問題;
在console(控制臺)中打印的消息指向的問題(chromium平臺bug列表),可以從第40條評論中直接找到解決該問題的方法:
在導(dǎo)致“deferral”的頁面打開開發(fā)者工具記錄時間線;
選擇整個時間線,然后在窗口底部打開“Event Log” 面板。
在文本輸入框中(Filter過濾的字段)中輸入“Timer Fired”
在列表中查找“總時間”超過50毫秒的定時器函數(shù)。這就是問題的所在。(當(dāng)瀏覽器在處理用戶的手勢的情景下,定時器函數(shù)執(zhí)行超過10毫秒也會觸發(fā)該消息)
英文原文如果閱讀中文后還無法理解可以參考英文截圖
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/86415.html
摘要:之前很少使用這個標(biāo)簽,因為感覺到父子頁面之間傳遞數(shù)據(jù)不太方便。最近同事做的一組頁面中大量的使用了用來嵌入其他頁面,由于懶所以只好看看如何在的標(biāo)簽下傳遞數(shù)據(jù)。在父頁面中使用函數(shù)來向子頁面發(fā)送消息而在子頁面中添加這個來接受消息。 之前很少使用IFRAME這個標(biāo)簽,因為感覺到父子頁面之間傳遞數(shù)據(jù)不太方便。最近同事做的一組頁面中大量的使用了IFRAME用來嵌入其他頁面,由于懶,所以只好看看如何...
摘要:但是,項目中的一些公共封裝,比如公共的組件公用的功能模塊等是可以使用單元測試的。因此特為組件庫引入單元測試,目的在于能減少組件的,避免重復(fù)的發(fā)布不必要的包。 項目github地址:https://github.com/yuanalina/installAsRequired這里必須要提前說明,前端項目的單元測試不是必須的,特別是業(yè)務(wù)型項目,增加單元測試反而會成為累贅,增加開發(fā)成本且無意義...
摘要:中,實例化一個對象,會用到關(guān)鍵字。這里再解釋一下構(gòu)造函數(shù)我們一般把后面的函數(shù)稱為構(gòu)造函數(shù),如,其中就為構(gòu)造函數(shù)第四點的,可能比較難理解。有點需要注意如果構(gòu)造函數(shù)內(nèi)沒有返回值,則默認(rèn)是返回當(dāng)前上下文,要不然就返回任意非原始類型值。 Javascript中,實例化一個對象,會用到new關(guān)鍵字。 經(jīng)常有人會問對于一個函數(shù),什么時候該使用new關(guān)鍵字。 在回答這個問題之前,需要先了解清楚new...
摘要:提示插件可以重寫默認(rèn)的比如打開新時。這是在插件中定義的,因此不能后面做更改。把你的插件提交到的子版塊中。從圖中藍(lán)色點開始到后面的兩天曲線變化。曲線中間的那個小凸起,是二月份在發(fā)布的時候產(chǎn)生的。關(guān)于在插件中如何使用的教程在這里。 showImg(https://segmentfault.com/img/remote/1460000008971998?w=1920&h=1080); 本文...
摘要:在此期間我的文章會同步更新在以下地方歡迎大家在自己長逛的網(wǎng)站中關(guān)注或者我的來了解我的最新消息推薦大家收藏關(guān)注我的博客網(wǎng)站,因為我的最新更改與文章只會在這里更新,其他地方的文章可能會存在更新不及時或者忘記更新等問題。 之前一直在找一款現(xiàn)成的已經(jīng)實現(xiàn)了如標(biāo)題所說的chrome擴展, 但卻一直沒有找到, 于是最近花了私底下的一些空閑時間去按照自己所想要的功能去打造了這么一款chrome擴展,...
閱讀 3050·2021-09-08 10:43
閱讀 1038·2019-08-30 15:53
閱讀 987·2019-08-30 13:51
閱讀 847·2019-08-29 14:03
閱讀 810·2019-08-26 18:35
閱讀 1241·2019-08-26 13:38
閱讀 1590·2019-08-26 10:34
閱讀 3505·2019-08-26 10:21