H-1982: Allow visualizing types in a graph

[CiaranMn]

🌟 What is the purpose of this PR?

Introduces a graph visualization for types – specifically, the relationships between entity types (which entity types can link to other entity types).

Pre-Merge Checklist 🚀

🚢 Has this modified a publishable library?

This PR:

• does not modify any publishable blocks or libraries, or modifications do not need publishing

📜 Does this require a change to the docs?

The changes in this PR:

• are internal and do not require a docs change

🕸️ Does this require a change to the Turbo Graph?

The changes in this PR:

• do not affect the execution graph

🐾 Next steps

• H-3328: Use sigma.js (used in this PR) instead of the existing ECharts solution for visualizing entities in a chart, which should be more performant and allow us to use the same interactivity features (e.g. highlight a subgraph on hover/click).

🛡 What tests cover this?

• None yet

❓ How to test this?

1. Visit /types

📹 Demo

Kapture.2024-09-18.at.14.11.14.mp4

[vilkinsons]

🚀

[github-actions]

Benchmark results

@rust/graph-benches – Integrations

scaling_read_entity_complete_one_depth

Function	Value	Mean	Flame graphs
entity_by_id	10 entities	$$51.3 \mathrm{ms} \pm 282 \mathrm{μs}\left({\color{red}62.8 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	50 entities	$$1.55 \mathrm{s} \pm 4.43 \mathrm{ms}\left({\color{red}291 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	1 entities	$$19.9 \mathrm{ms} \pm 144 \mathrm{μs}\left({\color{gray}-0.547 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	25 entities	$$71.8 \mathrm{ms} \pm 375 \mathrm{μs}\left({\color{gray}-1.950 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	5 entities	$$25.2 \mathrm{ms} \pm 268 \mathrm{μs}\left({\color{gray}1.91 \mathrm{\%}}\right) $$	Flame Graph

scaling_read_entity_complete_zero_depth

Function	Value	Mean	Flame graphs
entity_by_id	10 entities	$$2.02 \mathrm{ms} \pm 10.6 \mathrm{μs}\left({\color{gray}-1.839 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	50 entities	$$4.12 \mathrm{ms} \pm 32.7 \mathrm{μs}\left({\color{red}5.49 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	1 entities	$$1.90 \mathrm{ms} \pm 11.9 \mathrm{μs}\left({\color{gray}1.77 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	25 entities	$$2.57 \mathrm{ms} \pm 19.1 \mathrm{μs}\left({\color{lightgreen}-17.295 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	5 entities	$$1.93 \mathrm{ms} \pm 9.29 \mathrm{μs}\left({\color{gray}2.47 \mathrm{\%}}\right) $$	Flame Graph

scaling_read_entity_linkless

Function	Value	Mean	Flame graphs
entity_by_id	10 entities	$$1.88 \mathrm{ms} \pm 8.07 \mathrm{μs}\left({\color{gray}0.803 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	100 entities	$$2.03 \mathrm{ms} \pm 8.39 \mathrm{μs}\left({\color{gray}1.35 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	1000 entities	$$2.78 \mathrm{ms} \pm 14.8 \mathrm{μs}\left({\color{gray}-0.208 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	1 entities	$$1.85 \mathrm{ms} \pm 4.67 \mathrm{μs}\left({\color{gray}-0.223 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	10000 entities	$$12.8 \mathrm{ms} \pm 145 \mathrm{μs}\left({\color{gray}-0.923 \mathrm{\%}}\right) $$	Flame Graph

representative_read_entity_type

Function	Value	Mean	Flame graphs
get_entity_type_by_id	Account ID: d4e16033-c281-4cde-aa35-9085bf2e7579	$$1.44 \mathrm{ms} \pm 10.4 \mathrm{μs}\left({\color{gray}2.63 \mathrm{\%}}\right) $$	Flame Graph

representative_read_entity

Function	Value	Mean	Flame graphs
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/book/v/1	$$15.3 \mathrm{ms} \pm 187 \mathrm{μs}\left({\color{gray}0.033 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/playlist/v/1	$$18.2 \mathrm{ms} \pm 219 \mathrm{μs}\left({\color{red}17.7 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/uk-address/v/1	$$16.1 \mathrm{ms} \pm 192 \mathrm{μs}\left({\color{gray}-1.833 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/person/v/1	$$17.2 \mathrm{ms} \pm 247 \mathrm{μs}\left({\color{red}8.28 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/building/v/1	$$17.2 \mathrm{ms} \pm 208 \mathrm{μs}\left({\color{gray}3.17 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/page/v/2	$$16.8 \mathrm{ms} \pm 213 \mathrm{μs}\left({\color{gray}2.39 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/organization/v/1	$$17.1 \mathrm{ms} \pm 212 \mathrm{μs}\left({\color{red}7.17 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/block/v/1	$$16.3 \mathrm{ms} \pm 207 \mathrm{μs}\left({\color{lightgreen}-35.806 \mathrm{\%}}\right) $$	Flame Graph
entity_by_id	entity type ID: https://blockprotocol.org/@alice/types/entity-type/song/v/1	$$16.2 \mathrm{ms} \pm 160 \mathrm{μs}\left({\color{gray}-1.225 \mathrm{\%}}\right) $$	Flame Graph

representative_read_multiple_entities

Function	Value	Mean	Flame graphs
link_by_source_by_property	depths: DT=2, PT=2, ET=2, E=2	$$98.6 \mathrm{ms} \pm 577 \mathrm{μs}\left({\color{gray}2.12 \mathrm{\%}}\right) $$	Flame Graph
link_by_source_by_property	depths: DT=0, PT=0, ET=0, E=2	$$81.6 \mathrm{ms} \pm 569 \mathrm{μs}\left({\color{gray}3.98 \mathrm{\%}}\right) $$	Flame Graph
link_by_source_by_property	depths: DT=0, PT=0, ET=0, E=0	$$44.1 \mathrm{ms} \pm 233 \mathrm{μs}\left({\color{red}7.01 \mathrm{\%}}\right) $$	Flame Graph
link_by_source_by_property	depths: DT=0, PT=0, ET=2, E=2	$$91.0 \mathrm{ms} \pm 733 \mathrm{μs}\left({\color{gray}2.85 \mathrm{\%}}\right) $$	Flame Graph
link_by_source_by_property	depths: DT=0, PT=2, ET=2, E=2	$$94.4 \mathrm{ms} \pm 655 \mathrm{μs}\left({\color{gray}2.14 \mathrm{\%}}\right) $$	Flame Graph
link_by_source_by_property	depths: DT=255, PT=255, ET=255, E=255	$$108 \mathrm{ms} \pm 792 \mathrm{μs}\left({\color{gray}2.80 \mathrm{\%}}\right) $$	Flame Graph
entity_by_property	depths: DT=2, PT=2, ET=2, E=2	$$59.8 \mathrm{ms} \pm 427 \mathrm{μs}\left({\color{gray}3.64 \mathrm{\%}}\right) $$	Flame Graph
entity_by_property	depths: DT=0, PT=0, ET=0, E=2	$$44.7 \mathrm{ms} \pm 241 \mathrm{μs}\left({\color{red}5.06 \mathrm{\%}}\right) $$	Flame Graph
entity_by_property	depths: DT=0, PT=0, ET=0, E=0	$$40.5 \mathrm{ms} \pm 321 \mathrm{μs}\left({\color{red}5.58 \mathrm{\%}}\right) $$	Flame Graph
entity_by_property	depths: DT=0, PT=0, ET=2, E=2	$$49.6 \mathrm{ms} \pm 307 \mathrm{μs}\left({\color{gray}1.40 \mathrm{\%}}\right) $$	Flame Graph
entity_by_property	depths: DT=0, PT=2, ET=2, E=2	$$54.1 \mathrm{ms} \pm 388 \mathrm{μs}\left({\color{gray}1.56 \mathrm{\%}}\right) $$	Flame Graph
entity_by_property	depths: DT=255, PT=255, ET=255, E=255	$$69.0 \mathrm{ms} \pm 352 \mathrm{μs}\left({\color{gray}4.32 \mathrm{\%}}\right) $$	Flame Graph