felixge / felixge/flame-explain

Better display of huge numbers

Open
#1 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
55
Forks
5
PR merge metrics
No merged PRs in 30d

Description

# Problem

Sometimes the UI needs to display big numbers, e.g. 1500000 rows like shown below:

![image](https://user-images.githubusercontent.com/15000/90109844-a98c0400-dd4c-11ea-8609-c1955b619917.png)

https://flame-explain.com/visualize/treetable?gist=d95c6de7296070383aaacbd67c3c3a52

This can be difficult to read. Is it 1.5 million, or 15 million? There is no quick to know without counting the digits.

# Proposal

Create a PR that improves the display of these numbers. Ideally it would also work for the side inspector and any numeric column that isn't already getting special formatting (e.g. time).

One idea is to use [SI Prefixes](https://en.wikipedia.org/wiki/Metric_prefix#List_of_SI_prefixes) so that the example above would show `1.5 M` instead.

Another idea is to use accounting style, e.g. `1.500.000`. I prefer SI prefixes, but I could be convinced otherwise as well : ).

Contributor guide

Open the contributing guide

Research direction

Start by locating the UI rendering for the treetable's numeric columns and the side inspector, then compare how values such as 1500000 are currently displayed. Decide on the formatting approach from the proposal and consider numeric columns that do not already have special formatting; done means large values are consistently easier to read in the affected views.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data-visualization, frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.