guppy
guppy copied to clipboard
joshwcomeau
Limit how much log output is shown/kept
While using Guppy on a side-project, I realized that it gets kinda slow/sluggish after a while.
I believe this is because the Development Server outputs all text, forever. The longer it stays open, the more DOM is added, and it gets to be a lot.
One easy solution could be to clear the terminal whenever it rebuilds. Another slightly trickier solution could be to virtualize the offscreen content (tricky since each log entry is of unknown height).
We should also see if it's sufficient to just not put it in the DOM, or if we should also delete it from Redux. If we keep it in Redux, we'd be able to show history on demand.
Setting this as "top priority" because Guppy becomes unusably slow after moderate usage with the current logging.
Another slightly trickier solution could be to virtualize the offscreen content (tricky since each log entry is of unknown height).
React-Virtualized could help with this. The screenshot in the README shows that soft wrapping doesn’t occur, so how would each entry be of unknown height?
React-Virtualized could help with this. The screenshot in the README shows that soft wrapping doesn’t occur, so how would each entry be of unknown height?
Each log entry is a DIV containing 1 or more lines:
We could probably work around this by splitting each log entry around newlines and sticking each one in its own div, so it's not unsolvable.
Also, I think I do want the output to line-wrap; the reason it doesn't right now is I couldn't find a quick way to wrap lines and preserve whitespace (as seen in the URL portion of the screenshot above, whitespace is often used for positioning, and things don't align nicely with the default behaviour of reducing multiple whitespace chars into a single one). Although linewrapping might also break some layouts... so I'm actually not sure what the best approach there is.
For now, I think having a "clear" button (#57) will solve the immediate need, so I'm removing the "top priority" label.