What is Mist?
Written by Leonoor Rinke de Wit and Eric Lemay
Mist is an APM development tool for unpublished Cloudflare “workers,” also known as serverless functions. With Mist, developers gain access to request and response data visualizations for their Cloudflare workers while running them in a local dev environment. Utilizing an intelligent system of interconnected local ports, the application “records” a session of requests and then displays them across several visual mediums. These metrics help provide developers with insight into the performance of their Cloudflare workers, opening the door for meaningful comparison and code optimization prior to deployment.
Why use Mist?
With wrangler 1.0, setting up a local dev environment with Cloudflare required a stable internet connection, as serverless functions run on Cloudflare’s Edge Network. Requiring a live internet connection added a layer of complexity to the development process. When Miniflare came along, it became possible to run serverless functions locally. Unfortunately, Cloudflare’s GraphQL Analytics API only works when serverless functions are fully deployed to CloudFlare’s Edge Network. We saw the need to create an APM tool that would run in a local dev environment; thus, Mist was born.
How does Mist work?
Mist is relatively straightforward in its implementation. It uses a port on the developer’s local machine to host a sandbox environment for workers, which replicates cloud-hosted conditions. Another local port hosts Mist’s GUI for recording and displaying visual metrics. Following a recording session, Mist relays the recorded activity to a developer’s SQL database to store past sessions for easy retrieval and future analysis. It then logs worker activity, including HTTP request and response times, duration, status codes, etc. Finally, it maps retrieved data across several charts to easily visualize worker performance. Visuals include:
- A table featuring the entire log of recorded activity for a given session
- A scatter chart displaying individual requests and responses, complete with the duration of time between the request and the response.
- A pie chart showing successes and errors for the recorded session
- A bar chart displaying the average response times of the worker from the most recent recording sessions.
Mist’s setup is also straightforward, requiring only an available SQL database and slight modification to the source code. Follow the steps below or check out our website for a full tutorial on the application.
Getting Started
Install the mist package by running npm i mist-analytics to get started. Once Mist is installed, you’ll want to open it up in your browser with npm run mist. This command will open up the Mist GUI on localhost:8080. Now run node — require ‘./server/tracing.js’ server/miniflare to create a server instance with Miniflare and our tracing package. You’ll also want to create an .env file. Here, declare a variable called WORKER_NAME, and set it equal to the exact name of the Worker file you will be tracing.
Database
To store your metrics, you’ll want to create a database. For set-up purposes, we’ll assume you’re using ElephantSQL, but other postgreSQL database services will work as well.
- Create a new postgreSQL database
- Copy the link for that database
- Open up the Mist directory in your terminal
- Run the following command: psql -d <url from elephantSQL> -f db_template.sql. Ensure that your url is a string.
- Run a query to ensure that the table is present.
- In the .env file, store your postgreSQL link to a variable called MY_URI.
Now, you are ready to record worker-based metrics! To learn more, read the section on gathering metrics.
Gathering Metrics
On Mist, press start to begin a recording session. Now navigate to your localhost:8788, to run your app.
Next, trigger your worker to start gathering metrics. Once you’ve activated the worker, navigate back to Mist and press stop.
Now, you’re ready to press generate metrics.
If you wish to record another session of metrics, press reset metrics. After pressing start again, a new session will begin.
Stretch Goals
With the future in mind, the team behind Mist has already begun planning the implementation of extended features:
- Previous recording session look-up
- More worker-specific metrics (CPU median time, subrequests, performance, etc.)
- Improved support for multiple workers
Team Mist
- Anthony Marin | LinkedIn | Github
- Eric Lemay | LinkedIn | Github
- Kristen Althoff | LinkedIn | Github
- Leonoor Rinke De Wit | LinkedIn | Github
- Stewart Elmore | LinkedIn | Github
Continuing Development
Mist is an ever-evolving open-source product. If you’d like to contribute, please reach out to a team member with your proposal so we can incorporate you into the development process.