Look at integrating with greenhouse, to provide traceroutes of each domain userd when loading a page

[mrchrisadams]

We have this set up in greenhouse now, and we should be able to run lighthouse in a headless fashion, then results the list of domains in use, for putting on map

[mrchrisadams]

Some recent work on sitespeed.io to integrate checks for green infrastructure allows us to represent all the requests made when visiting a page, in a handy json format using a piece of technology called Page-Xray, listing the domains we're connecting to, as well as how much data we went to each domain.

Where we are now:

We already have a (shockingly slow) way of building traceroutes and representing them on a map, but it currently looks a bit naff. You can see an example below of an early map, showing the hops along the geolocated IP addresses here.

In a later version, I've already learned some things, here's an example when I saw when I connecting to a polish website - the hops bounced to central England, then what looks like London, then to Ireland (maybe AWS?) before bouncing to the actual address in Poland.

(From memory, the other white line was a connection to West Coast US)

This shows me that we can at least plot the points on maps.

What we'd like to have.

Just like how we can get a list of domains domains and the carbon impact of sending the data now, it would be really cool to be able to show this in more detail, so people can see the infrastructure we're sending data along. Maybe something like these screenshots.

The ideal would be to represent these hops using something more visually arresting like these ArcMaps, like these examples of Deck.gl, as implemented by the lovely folk at Flourish

Or this code example with D3

But first through we need a UI, so we can in the very least show let people use it and trace the route for a single domain, like this issue here:

https://github.com/thegreenwebfoundation/greentrace/issues/2