uPlot
caniuse
Our great sponsors
uPlot | caniuse | |
---|---|---|
18 | 382 | |
8,402 | 5,485 | |
- | - | |
8.5 | 9.5 | |
24 days ago | 1 day ago | |
JavaScript | JavaScript | |
MIT License | Creative Commons Attribution 4.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.
caniuse
-
Free Resources Every Web Developer Should Know About
Can I Use (https://caniuse.com/)
-
Speedometer 3.0: A Shared Browser Benchmark for Web Application Responsiveness
> Is it though?
In my experience it's the buggiest browser out of the big three, and is often missing basic features like e.g.:
https://caniuse.com/?search=opus
Supported in Firefox for *12 years* now, in Chrome for 10, still no support in Safari.
They only "support" Opus audio in their special snowflake '.caf' container, which is super buggy and the last time I checked no open source program could even generate Opus '.caf' files that could be played by Safari on all Apple platforms. I ended up writing a custom converter which takes a standard '.opus' file and remuxes it on-the-fly (I only store '.opus' files on my server) into Safari-compatible '.caf' files, taking special care to massage it so that it avoids all of their demuxer/decoder bugs. You shouldn't have to do this to have cross-browser high quality audio!
-
Streaming HTML out of order without JavaScript
Seems like browser support is pretty universal, even says so in the article
> All browsers support streaming HTML
And the caniuse is promising: https://caniuse.com/?search=slot
Well I'll be! In my mind I had this clear picture of Firefox implementing it.
It correct, it was only Chrome: https://caniuse.com/?search=html%20import
-
IPissed: Apple is after web capabilities to protect close to 100B App Store Tax
https://caniuse.com/?search=web%20bluetooth
which might be great because you have the choice...
and you can use open source chromium or brave (like the jvm to run cross platform java) to run web apps seemlessly that need web bluetooth or such but use safari or firefox for personal use if you find them more secure
I mean using chromium engine as the running environment where chromium only ever runs special trusted web domains and never goes to other "malicious" web domains that may fuck up iOS as Apple claims would be still a secure choice
like you will not download spyware from Apple Store because you are an adult not because Apple can protect you there
-
WebAssembly Playground
I'm developing a wasm game, and currently I am targeting WebGL2 in order to run in iOS Safari.
Me (and others, I'm sure) are currently waiting for WebGPU [1] to land in Safari so it will make sense to target it.
WebGPU allows for simplified porting of desktop apps to the web, such as WGSL shaders [2]
WebGPU will be the next big thing, and currently it is enabled on Chrome Windows/macOS, and can be enabled in Firefox Nightly with a config setting.
Hopefully, 2024 will be the year of WebGPU!
-
Why Isn't the <HTML> Element 100% Supported on CanIUse.com?
> a lot of the data on the site actually comes from MDN
Eh... not really.
The feature support matrix (as linked on CanIUse) comes from the browser-compat-data repo. Here's the HTML element's source data: https://github.com/mdn/browser-compat-data/blob/main/html/el...
This doesn't contain the testing and usage info that CanIUse cites for support, though, just which browser versions included which features.
CanIUse also points to their own repo, which contains a lot of data: https://github.com/fyrd/caniuse
But I can't find an easy entry point to find where they're getting the numbers for a specific element. The data on there seems to be primarily for features.
So the more precise question is, where is CanIUse getting HTML element testing and usage numbers from? Because that seems to be the issue.
-
The web just gets better with Interop 2024
I meant across all browsers since Interop is about raising the bar on all browser capability.
Right now, no other browsers support those features.
-
Apple Announces Changes to iOS, Safari, and the App Store in the European Union
> A new version of Safari shipped 17 times in the last 28 month
> Yes, not as frequent as monthly releases, but Apple shipped 7 Safari updates on iOS in 2023.
That's a very recent change: prior to 2022 Apple had far fewer updates to Safari on both macOS and iOS - and still witholds Safari updates from older iOS versions - for example, there was only 1 macOS Safari update per year between 2008 and 2015, and only 2 updates per year from 2015 to 2022; while things were just as sparse on iOS.
The data is all here: click on the "Date relative" view on any of the items on https://caniuse.com/?search=webkit
-
Starting to write CSS in 2023 will be different
Baseline is coming to caniuse.com soon! This blog post will introduce this integration and explore some of the features included in Baseline 2023. According to the new definition of benchmark , the feature lifecycle is divided into two stages. The first option is newly launched , and then fully launched after 30 months. If a feature is interoperable in the following browsers, it will become part of the new features provided by Baseline:
What are some alternatives?
PlotJuggler - The Time Series Visualization Tool that you deserve.
Grafana - The open and composable observability and data visualization platform. Visualize metrics, logs, and traces from multiple sources like Prometheus, Loki, Elasticsearch, InfluxDB, Postgres and many more.
Charts - ⚡ Laravel Charts — Build charts using laravel. The laravel adapter for Chartisan.
browserslist - 🦔 Share target browsers between different front-end tools, like Autoprefixer, Stylelint and babel-preset-env
caniemail - Can I email… Support tables for HTML and CSS in emails.
laravel-recharts - A Laravel package for using the Recharts charting Library. Docs: https://kaishiyoku.github.io/laravel-recharts
TimeChart - An chart library specialized for large-scale time-series data, built on WebGL.
postcss-preset-env - Convert modern CSS into something browsers understand
modern-css-reset - A bare-bones CSS reset for modern web development.
network-weathermap-prometheus-datasource - attempt to add prometheus as datasource for network-weathermap
modern-normalize - 🐒 Normalize browsers' default style
WHATWG HTML Standard - HTML Standard