trace.cafe icon indicating copy to clipboard operation
trace.cafe copied to clipboard

easy webperf trace sharing

trafficstars

trace.cafe - easy webperf trace sharing

https://trace.cafe/

trace.cafe while uploading a tracetrace.cafe viewing a trace

Biggups to the team behind https://profiler.firefox.com/ who've enabled Firefox folks to do this for years.

And shoutout to Artem (and me, lol), who worked on this project's predecessor: https://chromedevtools.github.io/timeline-viewer/

Development

Probably npm install -g firebase-tools

firebase use tum # optional

yarn watch # or yarn build

yarn serve
# deploying
yarn deploy

TODO

  • motion grpahics animation on drop?
  • navigation transition API?
  • create nanoid as hash of content. (I experimented with https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/digest#converting_a_digest_to_a_hex_string but it gives a ~40 char string. and i'm too lazy to find a determinisitic hashing nanoid thing that will stay short.)