I am using react lazy load component npm library, How can I know whether its working or not? I have used onContentVisible which is available in react lazy load component library docs. Even Without scrolling, In developer tools, Network tab says 84 requests are sent which is the maximum requests for my web page. How can I figure it out?
Asked
Active
Viewed 3,857 times
4
Harish Kulkarni
- 1,481
- 11
- 18
-
Are you using any node module to achieve React Lazy load component or React.lazy? – Varit J Patel Nov 21 '18 at 12:58
-
Yes I am using - React lazy load component – Harish Kulkarni Nov 21 '18 at 13:00
-
In order to figure out if the lazy component, you need to invoke that component. – Varit J Patel Nov 21 '18 at 13:06
-
Invoke?How? I have read docs and used as per docs. onContentVisible is working. Couldn't exactly know whether is working or not? – Harish Kulkarni Nov 21 '18 at 13:20
-
1It seems that you are not using official React.lazy https://reactjs.org/docs/code-splitting.html#reactlazy. I think that you are using `react-lazy-load` npm module because it supports `onContentVisible`. Kindly add more information about what you are using and add [mcve] – Abdul Rauf Nov 21 '18 at 16:14
-
Thank you for providing resources, I changed my code and implemented according to official React.lazy. But what I want is whenever I try to scroll, Components should load accordingly.. I have added code – Harish Kulkarni Nov 22 '18 at 07:38
-
and yes I had used react lazy load component before. – Harish Kulkarni Nov 22 '18 at 09:39
1 Answers
7
In Chrome dev tools, press command-shift-p (Mac) or control-shift-p (Windows) to open the command menu. Select Show Coverage and click the Reload button and reload your home page, and Chrome will show you what has loaded.
VikR
- 4,818
- 8
- 51
- 96