Visualize network hiccups inline

toomim commented 7 years ago

The chrome notifications were a quick way to show us network issues, but we don't need to demand the user's attention for this information. It would be better to have an ambient visualization of the network strength.

For instance, we could set some state for each notification:

slowness = fetch('slowness')
slowness.all ||= []
slowness.all.push(
  when: new Date()
  what: "local"
)

And render these with icons:

  # Maybe this goes in top bar?
  for slowdown in fetch('slowness').all
    fade = (new Date() - s.when) / fade_time
    IMG
      src: 'hourglass.png'  # or something
      style: opacity: fade

And clean them up periodically with:

fade_time = 5 * 60 * 1000  # 5 seconds
clean_slowness = ->
  slowness = fetch('slowness')
  slowness.all = (s for s in slowness.all when new Date() - s.when < fade_time)
  save(slowness)      
setInterval(clean_slowness, 1000)

karth295 commented 7 years ago

Yeah, it's really annoying. Since we know which connection is slow, we could just put the hourglass on the bottom-right of that video stream

toomim commented 7 years ago

Oh really? Yeah, that would be the best.

Or maybe a [X]

toomim commented 7 years ago

Ok, @karth295 where are the lines of code that derive the network slowness? (I'm guessing it's derived from janus, or from the client's webrtc data connection?) I might try taking that data, putting it in statebus state, and visualizing it in the client.

karth295 commented 7 years ago

Yeah, they come from Janus. I really dislike their API -- you get an "onMessage" callback invoked and it can be one of several messages. The "slow_link" message that we use indicates the other party sent a bunch of NACKs in a row.

https://github.com/invisible-college/tawk.space/blob/master/index.html#L582 https://github.com/invisible-college/tawk.space/blob/master/index.html#L668

One of those refers to you uploading your stream to the server, and other is downloading another person's stream.

toomim commented 7 years ago

So you get these callbacks only on the client? Do we get them on the server?

Oh, wait, do we currently have clients sharing their streams p2p? I thought streams were multiplexed through the server.

invisible-college / tawk.space

Visualize network hiccups inline #8