Visit time
Last updated
Last updated
This examples renders a stopwatch counting the time a user spends on a page while being online.
Two sources observed:
The visibility status of the page (See page visibility API)
The online status of the navigator (See online and offline events)
Every time the page becomes visible and online, the stopwatch resumes. If the page becomes either offline or hidden, the stopwatch pauses.
The Refract handler handles pause, resume and tick effects to track the total time spent on the page and set it in state. It handles Date.now() impure calls.
The end result is a stopwatch counting the number of milliseconds spent on the page when visible and online. To play with it you can:
switch between tabs, and you'll notice the counter hasn't moved while the example tab was hidden
toggle your navigator online status (can be done via devtools)
callbag
most
RxJS
xstream