ipfs-webui

ipfs-webui copied to clipboard

Improvement idea

Current peers screen does not show the location of MY node:

If we show it on the map, then we could also show the net of connections – perhaps even indicate which connections were used for data transfer, or at least show the direction (which side initiated connection).

Inspiration

https://radar.cloudflare.com has a nice visualization where connections are indicated on the map:

cc @juliaxbow – not a priority, but could be cool to play with different ideas for visualization in spare time :-)

Hi! I kept it super simple to start. Let me know if this is what you had in mind and I can tweak based on feedback.

I'm including two versions below. In both, the user can now see where their node is located via pulsating "blue dot." Clicking on a connection would show details about the direction or transfer. As for where they differ,

• In the first, the user clicks on their node in this view and is then able to see their net of connections.
• In the second, there's added text below the map to view/hide the connections.

1. Click on node produces view of connections

https://user-images.githubusercontent.com/58958327/194495461-e6b143cb-9004-4eb2-bab3-d609bda0267f.mov

2. View / Hide

https://user-images.githubusercontent.com/58958327/194495514-d18ce87b-fc43-4ce2-a1db-8fb9c80f6793.mov

Follow up questions:

• Is there a general range of connections you'd expect? This would impact whether a view/hide of the connections is even necessary as well as how the connections should look

Other notes:

• From your perspective, is there any value in including other info about the user's node on this page? I think there's opportunity to include it to the left of the map but only if it would be helpful for users
• Suggestion to display the map differently (ie not euro-centric) based on where the user is located
• Newb question but would a vpn affect where my node would show up on the map?

@juliaxbow thanks! I like the second one better for sure.. the first one may be difficult to expose to users as an option without them being in the know. We could potentially support both with a "click to select a node" and then "hide/view connections" functionality. It may also be hard to know which node is yours in the above map, so visually indicating which dot is your own (color, border, etc), or giving users the ability to "click to select your own node" could be useful.

Is there a general range of connections you'd expect?

you mean range of connection counts? That's a great question that I am not sure about. I know that I have over 900 peers usually, but as far as connections within that I would need to dive deeper. @lidel ?

From your perspective, is there any value in including other info about the user's node on this page? I think there's opportunity to include it to the left of the map but only if it would be helpful for users

deferring to lidel

Suggestion to display the map differently (ie not euro-centric) based on where the user is located

#1955 seems relevant here. I think adding the ability to zoom in/out, especially when a node is clicked, could be very useful

Newb question but would a vpn affect where my node would show up on the map?

Yep! It will change your public IP, which will change your location on the map.

correction: peers can vary for me between 100 and 900

Really cool! I like the curved connection lines.

Is there a general range of connections you'd expect? This would impact whether a view/hide of the connections is even necessary as well as how the connections should look

Yes!

If we are able to tell where our node is (based on IPs from ipfs id | jq .Addresses), then I think we want to show connections all the time, and show different types of connections in different color or line weight to indicate which connections matter more than others.

We can use values from "open streams" column to decide which connections could/should be displayed:

• connection was used only for DHT ("kad") – lower importance, only DHT gossip, could even be dotted
• actual CID block data was transferred ("bitswap") – should be more prominent (actual data was sent)

Note we can also tell the direction fo each connection (incoming/outgoing), so the lines could end with arrows (if we want, just an option).

is there any value in including other info about the user's node on this page?

Not much? We already show our node info on Status screen. On Peers screen, we want to show user's location I think, and when clicked maybe display a popup with ability to jump to Status screen for more details – open to suggestions, but we can also keep a very simple "My Node" label too :)

Suggestion to display the map differently (ie not euro-centric) based on where the user is located

:+1: (if possible – sometimes none of user's IPs will be in geoip database, in such case we don't show anything and have current state – default map, without connections)