违规'requestIdleCallbackHandler'花了ms

Question

我正在写与生成的应用程序create-react-app有redux,react-redux和react-router.每当我点击Link这样的话:

import React from 'react'
import { Link } from 'react-router'
import ThingCard from '../../components/ThingCard'


const ThingsList = ({things}) => {
    return (
        <ul>
            {things.map(thing => 
                <Link to={"/things/"+thing.id} key={thing.id}><ThingCard thing={thing}/></Link>
            )}
        </ul>
    )
}

export default ThingsList

我在控制台中看到以下警告.我不知道他们来自哪里或者他们的意思.谷歌搜索没有产生任何有用的结果.是否可以安全地忽略这些警告,如果不能,我怎样才能更多地了解它们？我相信这个问题阻止了父页面呈现它的孩子.

我已禁用所有网络请求.

编辑:此错误仅显示在Chrome Canary而不是Google Chrome中.但是,Google Chrome无法正确呈现孩子(可能是由于此问题)

Answer 1

可以安全地忽略它。这是很好的解释，为什么你会看到这个。您在此处看到 requestIdleCallback 的原因很可能是因为您使用的是 React 16+，它具有全新的架构 Fiber您可以阅读更多相关信息

TL; 博士; 它只是通知您您/他们的某些代码花费的时间超过 16 毫秒，因此您可能并不总是获得 60fp。