https://grafana.com/blog/2022/03/31/can-grafana-run-doom/ Grafana Labs Logo * Products Open source Learn Company * Downloads Contact us Sign In Create free account Contact us Products All Products The Grafana Stack Visualization with Grafana Metrics with Prometheus and Graphite Logs with Loki Traces with Tempo Cloud Self-managed Pricing Pricing overview Other cool stuff OSS vs. Cloud Dashboards Plugins Alerts Load testing with Grafana k6 Grafana Machine Learning Grafana OnCall Open Source All Open Source # Grafana # Prometheus # Grafana Loki # Grafana Mimir # Grafana Tempo # Graphite # Grafana k6 # OpenTelemetry Learn All Learn Blog Success stories Community Documentation Webinars and videos Events Tutorials Exporters Grafana University Company All Company Our team Careers We're hiring Partnerships Newsroom Grafana store Contact us Search Help build the future of open source observability software Open positions Check out the open source projects we support Downloads Sign in Products Visualization with Grafana Metrics with Prometheus and Graphite Logs with Loki Traces with Tempo Pricing overview OSS vs. Cloud Dashboards Plugins Alerts Load testing with Grafana k6 Grafana Machine Learning Grafana OnCall --------------------------------------------------------------------- Open source Grafana Prometheus Grafana Loki Grafana Mimir Grafana Tempo Graphite Grafana k6 OpenTelemetry --------------------------------------------------------------------- Learn Blog Success stories Community Documentation Webinars and videos Events Tutorials Exporters Grafana University --------------------------------------------------------------------- Company Our team Careers Partnerships Newsroom Grafana store Contact us The Grafana Stack Visualization with Grafana Metrics with Prometheus and Graphite Logs with Loki Traces with Tempo Cloud Self-managed Pricing Pricing overview Other cool stuff OSS vs. Cloud Dashboards Plugins Alerts Load testing with Grafana k6 Grafana Machine Learning Grafana OnCall Get Started [cloud-oran] Free Forever plan: * 10,000 series metrics * 14-day retention * 50 GB of logs * 50 GB of traces * 3 team members * Grafana, of course Create free account # Grafana # Prometheus # Grafana Loki # Grafana Mimir # Grafana Tempo # Graphite # Grafana k6 # OpenTelemetry Blog Success stories Community Documentation Webinars and videos Events Tutorials Exporters Grafana University Webinar spotlight We'll demo all the highlights of the major release: new and updated visualizations and themes, data source improvements, and Enterprise features. Grafana 8.0 demo video We'll demo all the highlights of the major release: new and updated visualizations and themes, data source improvements, and Enterprise features. Watch now - Our team Careers We're hiring Partnerships Newsroom Grafana store Contact us Blog / Engineering Can Grafana run Doom? Bogdan Matei, Domas Lapinskas, Kostas Pelelis * 31 Mar 2022 * 5 min read --------------------------------------------------------------------- It started as all good projects do ... with Rick Astley. After seeing the project about how to Rickroll your friends with Grafana -- in which a seemingly innocent hyperlink surprises users with the music video for Astley's classic "Never Gonna Give You Up" rendered with Prometheus and Grafana -- a question arose: Can Grafana run Doom? As the latest company-wide hackathon at Grafana Labs approached in March, the three of us decided why not take on that challenge? We could answer a question that is tied to almost any tech device/ platform out there; we would push the time series streaming to the limit; and we can also try live streaming data sources. Now, on the 25th anniversary of the Doom 64 release, we're excited to say that not only can Grafana query, visualize, alert on, and understand your data no matter where it's stored. It can also run Doom! If you want to give it a try, you can enjoy "Doomfana" in full resolution or half resolution. There's supposed to be a video here, but for some reason there isn't. Either we entered the id wrong (oops!), or Vimeo is down. If it's the latter, we'd expect they'll be back up and running soon. In the meantime, check out our blog! Meet the Doom players Name Bogdan Matei Title Software Engineer, Cloud Engineering Location Romania Hackathon weapon of choice C-hainsaw -- handles everything on his own Doom in Grafana: Bogdan Matei Doom in Grafana: Bogdan Matei Name Kostas Pelelis Title Software Engineer, Cloud Engineering Location Greece Hackathon weapon of choice WebRockets - WebSockets that produce fireworks Doom in Grafana: Kostas Pelelis Doom in Grafana: Kostas Pelelis Name Domas Lapinskas Title Software Engineer, Cloud Engineering Location Lithuania Hackathon weapon of choice BSG 9000 aka "Big Streaming Gun" -- one shot those [DEL:monsters:DEL] metrics Doom in Grafana: Domas Lapinskas Doom in Grafana: Domas Lapinskas MAP03: Main engineering For running Doom, we had two possibilities: Either run it server side and send the data through WebSockets, or use Doom WASM to run Doom in the browser and fetch the data from it. Here were the pros and cons for both options. WebSockets * This implementation required a lot of C code so that the frames could be safely transported to WebSocket clients. With some optimizations, we could stream the game in 640x400 @ 35 fps. * Exporting game stats from Prometheus would require an HTTP exporter in C, which would be troublesome. WebAssembly * In this option, we compile Doom to WebAssembly (WASM) via Emscripten, paint everything into a canvas element using WebGL, capture the output pixel by pixel, and expose it as metrics. * Using SDL C-library to capture the output instead of canvas resulted in out of memory since WASM has some serious memory constraints. * In order to expose the health info and others, a special hook was added to Doom so it calls a JS function that receives the data and exposes it as metrics. In the end, we decided to go the WebAssembly route. MAP08: Final output You can now try "Doomfana" at full resolution or half resolution. In the half resolution mode (100x160) alone, there are 256 active time series (one per color) and 16k data points rendered at ~30 frames per second. [gif] [doom-grafa] Above: Doomfana (and a monster) at full resolution in Grafana. In running this project, we learned some great tips to optimize live streaming time series panel performance in Grafana: * Keep the list of fields constant; only update. Mutating fields only causes expensive configuration updates. * When assembling data frames, initializing a fixed length array and then assigning items by index is faster than using Array.push. * Configure explicit min and max Y-axis values instead of letting Grafana decide them. This is one of the performance improvements we found during the hackathon. * Push new frames on window.requestAnimationsFrame tick. * If using Chrome, make sure "Canvas 2d out of process rasterization" is enabled. See chrome://gpu And the mission is still not done! There are a lot of improvements that we want to implement: bring all the Doom stats to Grafana panels, improve the frame rate, fix some minor graphic glitches, use the new heatmap panel as an alternative to the time series panel, and more. We have already considered building more starts, a recording feature, and other cool capabilities into Doomfana; and the recent Grafana Mimir news will only help us achieve that. We will make our code public next week and will update this blog post with it. MAP27: Playground The Grafana Labs hackathon itself was the best part of this project. It allowed us to focus on something that was not necessarily work-related, but we found a couple of improvements that can be implemented in Grafana, we had a lot of fun, and we tried technologies that we don't actively use. For the record, Grafana's live streaming feature is awesome! We've seen a lot of reactions that made us smile since we shared our Doomfana project, but the one that made us feel great appeared during a presentation when someone from another team commented: "This is a true hackathon project." If you want to play with cool technology, have some fun while doing it, and participate in Grafana Labs' hackathons, we're hiring! Find out how you can become an official Grafanista by visiting our careers page. --------------------------------------------------------------------- * Grafana On this page: * Meet the Doom players * MAP03: Main engineering + WebSockets + WebAssembly * MAP08: Final output * MAP27: Playground --------------------------------------------------------------------- Grafana Cloud Free Forever plan: 10,000 series metrics 10,000 series metrics 14-day retention 14-day retention 50 GB of logs and traces 50 GB of logs and traces 3 team members 3 team members Create free account - [ ] Up next How to best organize your teams and resources in Grafana How to best organize your teams and resources in Grafana 8 min | 14 Mar 2022 How to manage cardinality with out-of-the-box dashboards in Grafana Cloud How to manage cardinality with out-of-the-box dashboards in Grafana Cloud 7 min | 28 Feb 2022 New in Grafana 8.4: How to use full-range log volume histograms with Grafana Loki New in Grafana 8.4: How to use full-range log volume histograms with Grafana Loki 4 min | 2 Mar 2022 waving hand emoji Keep up with us. Product developments and observability innovations. [ ] [ ] [ ] Success! Sorry, an error occurred. Email update@grafana.com for help. --------------------------------------------------------------------- Grafana Labs Logo --------------------------------------------------------------------- * Grafana * Overview * Deployment options * Plugins * Dashboards * Products * Grafana Cloud * Grafana Cloud Status * Grafana Enterprise Stack * Grafana OnCall * Open Source * Grafana * Prometheus * Grafana Loki * Grafana Mimir * Grafana Tempo * Metrictank * Graphite * Grafana k6 * Tanka * OpenTelemetry * GitHub * Learn * Grafana Labs Blog * Documentation * Downloads * Community * Grafana ObservabilityCON * GrafanaCON * Successes * Training * Videos * Company * Our mission * The team * Press * Careers * Events * Partnerships * Contact --------------------------------------------------------------------- Grafana Cloud Status Sitemap Legal and Security Terms of Service Trademark Policy Copyright 2022 (c) Grafana Labs Grafana Labs uses cookies for the normal operation of this website. Learn more. Got it!