Żądanie naruszenia "requestIdleCallbackHandler" trwało ms

Question

Piszę aplikację wygenerowaną przy użyciu create-react-app z redux, react-redux i react-router. Ilekroć kliknij Link takiego:

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 

widzę następujące ostrzeżenia w mojej konsoli. Nie mam pojęcia, skąd pochodzą i co mają na myśli. Wyszukiwarka Google nie przyniosła żadnych przydatnych wyników. Czy te ostrzeżenia mogą być bezpiecznie ignorowane, jeśli nie, jak mogę dowiedzieć się więcej na ich temat? Wierzę, że ten problem uniemożliwia stronie nadrzędnej renderowanie jej dzieci.

Mam wyłączone wszystkie żądania sieciowe.

EDYCJA: ten błąd pojawia się tylko w przeglądarce Chrome Canary, a nie Google Chrome. Jednak Google Chrome nie renderuje poprawnie dzieci (potencjalnie z powodu tego problemu).

Answer 1

Można go bezpiecznie zignorować. Oto good explanation dlaczego to widzisz. Powód, dla którego widzisz requestIdleCallback tutaj jest najprawdopodobniej dlatego, że używasz React 16+, który ma całkowicie nową architekturę Fiber You can read more about it

TL; DR; Po prostu informuje cię, że część twojego kodu trwała dłużej niż 16 ms, więc nie zawsze możesz uzyskać 60fp.