The only thing I wish µPlot had is support for tooltips rather than numbers in the legend, but that's a small price to pay for this level of performance.
Show HN: Plotting 3 years of hourly data in 150ms
31–40 of 118 posts
Re: Show HN: Plotting 3 years of hourly data in 150ms
#32Unfortunately, I have to use Google Analytics and Google Ads at work every day, and these UIs have absolutely terrible performance :( A small part of the problem is drawing the trend charts. So I decided to make uPlot [1] to see what was really possible. [1] https://github.com/leeoniya/uPlot
Re: Show HN: Plotting 3 years of hourly data in 150ms
#33If you wanted to render these on a regular basis, WebGL is fairly straightforward, and works really well for this simple sort of rendering. You could do this with one polygon and a small fragment shader (treat the data as a texture, and use SDF to draw the line and fills), or use the actual geometry (render as a triangle strip; and separate the line if you want to do more interesting stuff in your fragment shader).
Re: Show HN: Plotting 3 years of hourly data in 150ms
#34I was slightly disappointed when I zoomed in as I expected 3 years of data in 150ms increments (600 million measurements) but that's probably not possible
Re: Show HN: Plotting 3 years of hourly data in 150ms
#35If you wanted to render these on a regular basis, WebGL is fairly straightforward, and works really well for this simple sort of rendering. You could do this with one polygon and a small fragment shader (treat the data as a texture, and use SDF to draw the line and fills), or use the actual geometry (render as a triangle strip; and separate the line if you want to do more interesting stuff in your fragment shader).
Re: Show HN: Plotting 3 years of hourly data in 150ms
#36I have done some visualization with WebGL because I couldn't get it fast enough with just drawing lines. That was a while ago so I'm not sure about the details, but even a simple prototype just drawing a few tens of thousands to a hundred thousand lines using canvas was slower than this for me (subjectively).
I'll have to look at the code later, but I'm curious about where this library is getting the performance from. Before I saw this I would have said you can't do this at this speed without using previously downsampled version of the data points, I'm not entirely sure now.
I'm still looking at the performance tab in the browser dev tools and how impressively empty the main Javascript usage plot is.
Re: Show HN: Plotting 3 years of hourly data in 150ms
#37Looks really nice. I was slightly disappointed when I zoomed in as I expected 3 years of data in 150ms increments (600 million measurements) but that's probably not possible
Re: Show HN: Plotting 3 years of hourly data in 150ms
#38Could you compare your performance against this one if possible?
Re: Show HN: Plotting 3 years of hourly data in 150ms
#39I find it curious that the volume of users are similar for day of the month regardless of year. For instance the first of the month is not always the same day of the week.
If there was a very pronounced weekday effect, a quick hack is to use a 364-day instead of full-year offset for comparison.