Will have to update intervalFun so that it will have the last timeoutValue for clearing

[nautiyalshubham002]

Will have to update intervalFun so that it will have the last timeoutValue for clearing otherwise it will be getting called recursively

[2611shubham]

@rajanlagah please check once

[rajanlagah]

@nautiyalshubham002
Thank you so much for pointing this out.
I have 1 doubt here.

intervalFun is not dependency of useEffect so will it clear timeout that is on line 53 on unmount?
( May be bcoz of JS closure it will work but I don't feel its pure react thing. )

This code is old and not I am thinking all the functions should come inside useEffect ( MeasureConnectionSpeed, startCalculating ) and that will fix clearing timeout issue.

Pls let me know if you going to pick this up.

[nautiyalshubham002]

@rajanlagah
Thansk for considering

lets take an example at line 31 when component is mount we are
assigning setTimeout value in intervalFun (supoose it is 121)
but again in line 53 we are calling startCalculating which is returning timeoutValue (suppose 122)

but in unmounting we are clearing 121 (the interval already executed)

so we have to assign latest timeout value in intervalFun
so we can clear it out at the time of unmount

[rajanlagah]

@nautiyalshubham002
I got what you are doing here and why its required.
But my question is
how are we sure latest value intervalFun is being used on unmount in useEffect?
Given it's not in useEffect dependency.

[nautiyalshubham002]

@rajanlagah
as intervalFun is a global/outer-scope variable
so changed varible will be picked at the time of cleanup

I have also checked this by running this

[rajanlagah]

@nautiyalshubham002
pls check https://react.dev/reference/react/useEffect#specifying-reactive-dependencies link. You will see [serverUrl, roomId] that is passed in the dependency.

[nautiyalshubham002]

@rajanlagah

I don't think we have to do that much just by updating intervalFun we can resolve it
and we can't pass it in dependencyArray as this is not a stateVariable or prop

https://codesandbox.io/p/sandbox/3vyv3r

visit this once