uPlot
Grafana
Our great sponsors
uPlot | Grafana | |
---|---|---|
18 | 376 | |
8,402 | 59,887 | |
- | 1.5% | |
8.5 | 10.0 | |
25 days ago | 5 days ago | |
JavaScript | TypeScript | |
MIT License | GNU Affero General Public License v3.0 |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
uPlot
-
Rendering data that changes very frequently
Here is a very efficient 2D canvas lib that is extremely efficient https://github.com/leeoniya/uPlot i recommend looking through their readme and seeing if it solves your current problems.
- Graphing Libraries that are as good as Excel?
-
Show HN: Inflation-adjusted stock charts – Total Real Returns
BACKEND:
It's about 3000 lines of Crystal code https://crystal-lang.org/ -- it's been an absolute dream to program in. Ruby-like syntax, statically compiled performance. Nice standard library. Would recommend :)
Performance == caching
Local ephemeral filesystem for shortest-term caching.
Redis for shared medium-term caching and locking.
S3-compatible object storage for longest-term caching (for raw data feeds pulled every evening by a cronjob).
FRONTEND:
Bootstrap
uPlot https://github.com/leeoniya/uPlot
Just a sprinkle of inline JS+CSS on the page.
-
It's always been you, Canvas2D
you can use matchMedia to detect devicePixelRatio changes and re-sync:
https://github.com/leeoniya/uPlot/blob/190134aa844cfa2a0c052...
everything stays crisp even as you browser-zoom. e.g. https://leeoniya.github.io/uPlot/demos/area-fill.html
-
AMP Has Irreparably Damaged Publishers’ Trust in Google-Led Initiatives
Safari's slow release cadence (typically tied to OS version upgrades) does leave it more broken and for longer than Firefox, Chrome, Opera and other browsers that are updated more frequently and not tied to the OS.
just recently i ran into incompatibilities with Safari < 14 needing the old-spec matchmedia api:
https://github.com/leeoniya/uPlot/issues/538#issuecomment-87...
-
WebGL charting libraries
If you are showing 100s of thousands of points, I'd still go with canvas eg uPlot. It's a really, really excellent library.
-
[task] Program uplot support into node-red-dashboard (javascript)
The existing node red chart tools is not great. I'd like to be able to use uplot instead. The uplot-charts node should work very much like that charts node built into node-red-dashboard.
-
Optimizing at the CPU instruction level in the browser w. Rust and WebAssembly
super cool!
i've done my share of optimizations and benchmarking charting libs [1] but this goes deeper still.
SVG is not a good choice for large raw datasets when you need performance.
-
Grafana v8.0 Released
> Can you now maybe talk a little bit about the React integration?
do you have a specific question about it?
there are some third party integrations now:
https://github.com/leeoniya/uPlot#third-party-integrations
in general, my stance on the topic has not changed. wrapping a fast imperative lib in a declarative framework facade has significant performance drawbacks. the main CPU & RAM cost of rendering a Grafana dashboard full of uPlot graphs is almost always React (by far).
> Another question: are you considering making uPlot more accessible?
this is a pretty complex challenge for data vis. i don't think this will ever be built into uPlot since the required code to make it actually good would be quite large.
grafana in general will definitely need a better accessibility story, so we will have to figure something out and at minimum provide some kinds of fallback html summary tables. i imagine this will not be a trivial project. while it's easy to summarize a simple bar or pie chart with 5 series, how do you summarize 100 noisey trendlines with 2k points each? how do you summarize a histogram or temporal heatmap?
at the end of the day, the data you feed into uPlot is already there for you to create an accessibility story externally. if you'd like to write some code that can take arbitrary data as input and output something sensible, please open a PR/discussion in Grafana or uPlot.
Hey @leeoniya, great to hear that you've been involved in including uPlot. Can you now maybe talk a little bit about the React integration [1]?
Another question: are you considering making uPlot more accessible? Right now, at least the uPlot demo is inaccessible to screen reader users and only partially accessible to keyboard users.
Grafana
-
4 facets of API monitoring you should implement
Prometheus: Open-source monitoring system. Often used together with Grafana.
-
The Mechanics of Silicon Valley Pump and Dump Schemes
Grafana
-
Reverse engineering the Grafana API to get the data from a dashboard
Yes I'm aware that Grafana is open source but the method I used to find the API endpoints is far quicker than digging through hundreds of files in a codebase I'm not familiar with.
-
Building an Observability Stack with Docker
So, you will add one last container to allow us to visualize this data: Grafana, an open-source analytics and visualization platform that allows us to see traces and metrics simply. You can set Grafana to read data from both Tempo and Prometheus by setting them as datastores with the following grafana.datasource.yaml config file:
-
How to collect metrics from node.js applications in PM2 with exporting to Prometheus
In example above, we use 2 additional parameters: code (HTTP response code) and page (page identifier), which provide detailed statistics. For example, you can build such graphs in Grafana:
-
Root Cause Chronicles: Quivering Queue
Robin switched to the Grafana dashboard tab, and sure enough, the 5xx volume on web service was rising. It had not hit the critical alert thresholds yet, but customers had already started noticing.
-
Teach Yourself Programming in Ten Years (1998)
I completely agree but do feel it needs qualifying. The problems beginners run into aren't usually the same as the problems experienced devs run into when adopting a language new to them, but where I see the two overlap I know something is a serious hazard in a language.
Java as a first language: won't like the boilerplate but won't have any point of comparison anyway, will get a few NPEs, might use threads and get data races but won't experience memory unsafety.
Go as a first language: much less boilerplate, but will still get nil panics, will be encouraged to use goroutines because every tutorial shows off how "easy" they are, will get data races with full blown memory unsafety immediately.
Rust as a first language: `None` // no examples found
I think Go as a beginner language would be better if people were discouraged from using goroutines instead of actively encouraged (the myth of "CSP solves everything"), otherwise I think it needs much better tooling to save people from walking off a cliff with their goroutines. And no, -race clearly isn't it, especially not for a beginner.
And in one respect I've found Go more of a hazard for experienced devs than beginners: the function signature of append() gives you the intuition of a functional programming append that never modifies the original slice. This has literally resulted in CVEs[1] even by experienced devs, especially combined with goroutines. Beginners won't have an intuition for this and will hopefully check the documentation instead of assuming.
[1] https://github.com/grafana/grafana/security/advisories/GHSA-...
-
Start your server remotely
I build the Tasmota firmware for the S31's nightly, and expose the Prometheus endpoint so I can also monitor the current used by these devices in real time with the data pushed to Grafana. I have ~30 of them in my home/homelab, and servers, appliances, sump pump, fans, etc. are all monitored by my S31 fleet.
-
List of your reverse proxied services
Grafana - for dashboards and log monitoring
-
PM2 module to monitoring node.js application with export to Prometheus and Grafana
In most cases, applications use the combination of Prometheus + Grafana, which allows collect data and display it in the form of graphs and also to set up alerts for changes in any metrics.
What are some alternatives?
Thingsboard - Open-source IoT Platform - Device management, data collection, processing and visualization.
Apache Superset - Apache Superset is a Data Visualization and Data Exploration Platform [Moved to: https://github.com/apache/superset]
Heimdall - An Application dashboard and launcher
Wazuh - Wazuh - The Open Source Security Platform. Unified XDR and SIEM protection for endpoints and cloud workloads.
Thingspeak - ThingSpeak is an open source “Internet of Things” application and API to store and retrieve data from things using HTTP over the Internet or via a Local Area Network. With ThingSpeak, you can create sensor logging applications, location tracking applications, and a social network of things with status updates.
uptime-kuma - A fancy self-hosted monitoring tool
skywalking - APM, Application Performance Monitoring System
Freeboard - A damn-sexy, open source real-time dashboard builder for IOT and other web mashups. A free open-source alternative to Geckoboard.
Dashing
dashy - 🚀 A self-hostable personal dashboard built for you. Includes status-checking, widgets, themes, icon packs, a UI editor and tons more!
Sentry - Developer-first error tracking and performance monitoring
alertmanager - Prometheus Alertmanager