Search code examples
reactjsperformancereact-nativepagespeed

Can I measure my users' internet speed in my react web app?


I built a small react web app and I'm noticing that some users are dropping off constantly.

I know that fast.com appears to measure web speed by having the client download a file and then upload it.

Would if be feasible to do something like that for my react web app?


Solution

  • Yes. You can certainly do that. but instead of downloading and uploading a file which will require some sort of prompt.

    What you can do is load an image <Image source={someURL}/> with a known size perhaps from a url, and display to the user. Your application logo can work. it will not be 100% accurate but it will get you what you want and start a timer before loading and finish the timer after it has been loaded you can use react hooks or didComponentMount depending on a functional component or a class with measuring the time.

    const CalculateTime = (time) => {
     const mins = Math.floor(time/60);
     const secs = time-mins*60;
     //you can calculate milliseconds etc...
     return (mins, secs);
    }
    

    using react-hooks in your main function

    export default function App(){
    
     [isActive, startActiviating] = useState(false);
    

    ofcourse call your function from your return () and calculate the time.