setInterval freezes react app after some time (couple days)

I have a react app (nextjs) and show a QR code that refreshes itself every 5 seconds and a clock which updates every 1 second. Further, I have added service-worker to enable PWA and offline support.

After running it for a couple hours, or even days, out of nowhere the app freezes and does not update anymore.

If relevant, it happens on mobile devices (Android), maybe there is something up with energy saver mode or so? Even if I pull down to refresh, the react app does not change! The only thing is exiting Chrome and then opening again.

I really have no clue what could be the cause of the issue.

RAM usage seems to be the same for all the time:

There are no network calls, everything is local, this is the example of the clock function that I use:

useEffect(() => {
    const interval = setInterval(() => {
      setTime(new Date());
    }, 1000);
    return () => {
      clearInterval(interval);
    };
  }, []);

The interval function that I use for the QR code is:

useEffect(() => {
    const interval = setInterval(() => {
      setOptions((prev) => ({
        ...prev,
        data: generateQrCodeString(),
      }));
    }, 5000);

    return () => {
      clearInterval(interval);
    };
    // eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

I use this qrcode lib: https://www.npmjs.com/package/qr-code-styling

Does anyone have any suggestions? Appreciate any help!

Edit:

I tried the useInterval hook from here https://usehooks-ts.com/react-hook/use-interval and it seems to be working smoother, but after a couple hours/days, it still freezes.

Updated code:

useInterval(() => {
    setTime(new Date());
  }, 1000);

useInterval(() => {
    setOptions((prev) => ({
      ...prev,
      data: generateQrCodeString(),
    }));
  }, 5000);

from setInterval freezes react app after some time (couple days)