Make URLs shareable

[taneliang]

From Brian's 17 July email and doc:

Make URLs shareable (like Firefox profiler)

• Full JSON profiles are huge, but also contain mostly data that we aren’t using. Maybe we can serialize the parts we do use (React’s profiler marks, JS flame graph) and store it on the URL like Mozilla does? (If we could get it below the max 2MB size limit at least).

Steps

• Figure out what can be removed. Ensure that all User Timing data is retained for Show remaining User Timing marks in the UI  #72.
• Figure out how this can also work with Firefox support (Add Firefox support #52)
• Figure out a way to get it below 2MB. Verify with an average profile?
• Implement a URL import route (we may want to add react-router instead of implementing a state-based route like we do now)

Update 20 Jul 2020:

Maybe we should also consider storing profiles in local storage? Ruled out by Brian.

Moved to the back in terms of priority, improving on the MVP from feedback takes precedence.

Update 06 Aug 2020:

Using the facebook.com profile, JSON.stringify(profilerData).length = 58,488,710

Here are some strategies I can think of to reduce this size:

• Serialize the data with shorter keys.
• Compression: will be able to significantly reduce the size by a few times, but I'm quite sure we won't be able to get it to <2k chars
• Replace JSON with a more compact transmission format
• Dump some displayed information such as component stacks and script URLs.
• Dedupe flamechart information: many flamechart frames are executions of the same underlying node.

Here is a wild alternative to this exact feature that I can think of: implement a one-click way to upload profiles as a GitHub Gist/Pastebin, coupled with a one-click way to import gists and pastes.