@saolsen
Telemetry For Vals.
Telemetry is a library that lets you trace val town executions with opentelemetry. All traces are stored in val.town sqlite and there is an integrated trace viewer to see them.
Quickstart
Instrument an http val like this.
import {
init,
tracedHandler,
} from "https://esm.town/v/saolsen/telemetry";
// Set up tracing by passing in `import.meta.url`.
// be sure to await it!!!
await init(import.meta.url);
async function handler(req: Request): Promise<Response> {
// whatever else you do.
return
}
export default tracedHandler(handler);
This will instrument the http val and trace every request. Too add additional traces see this widgets example.
Then, too see your traces create another http val like this.
import { traceViewer } from "https://esm.town/v/saolsen/telemetry";
export default traceViewer;
This val will serve a UI that lets you browse traces. For example, you can see my UI here.
Tracing
By wrapping your http handler in tracedHandler
all your val executions will be traced. You can add additional traces by using the helpers.
trace
lets you trace a block of syncronous code.
import { trace } from "https://esm.town/v/saolsen/telemetry";
trace("traced block", () => {
// do something
});
traceAsync
lets you trace a block of async code.
import { traceAsync } from "https://esm.town/v/saolsen/telemetry";
await traceAsync("traced block", await () => {
// await doSomething();
});
traced
wraps an async function in tracing.
import { traceAsync } from "https://esm.town/v/saolsen/telemetry";
const myTracedFunction: () => Promise<string> = traced(
"myTracedFunction",
async () => {
// await sleep(100);
return "something";
},
);
-
fetch
is a traced version of the builtinfetch
function that traces the request. Just import it and use it like you would usefetch
. -
sqlite
is a traced version of the val town sqlite client. Just import it and use it like you would use https://www.val.town/v/std/sqlite -
attribute
adds an attribute to the current span, which you can see in the UI. -
event
adds an event to the current span, which you can see in the UI.
View val changes as a diff.
Go to /v/username/valname/version to see a diff between that version and the previous one. For example https://saolsen-changes.web.val.run/v/saolsen/tracing/108
Opentelemetry Tracing for Vals!
Enables Opentelemetry tracing for vals.
Exports two functions, init
and traced_handler
.
init
will set up opentelemetry.
For how to use it see this example val.
By default, traces log to the console but if you set HONEYCOMB_API_KEY
it'll also push the traces to honeycomb.
In the future we can add more export targets for other services. I'm also thinking about making a val to display them.
traced_handler
is a wrapper for your handler you can use on an HTTP val. Just pass it your HTTP function and export it as the default and it'll trace every request.
Here's a screenshot of what the honeycomb view of a trace from my connect playing val looks like.
Play connect4.
- Write agents that play connect4.
- Battle your agents against other agents.
- It's fun.
Builds a torus as a gltf file and displays it with https://modelviewer.dev/
based on
Prune a val's versions.
Useful if you want to delete a bunch of versions.
All versions before keep_since
that aren't in keep_versions
will be deleted!!!
You can run it without passing commit
to see a preview of what will happen.
Example
await prune_val("abcdefg", [3,6,8], 12, true);
Could output
Val: untitled_peachTakin, Current Version: 15
Deleting Versions: [ 1, 2, 4, 5, 7, 8, 9, 10, 11 ]
Deleting Version 1
Deleted
Deleting Version 2
Deleted
Deleting Version 4
Deleted
Deleting Version 5
Deleted
Deleting Version 6
Deleted
Deleting Version 7
Version already deleted, skipping
Deleting Version 8
Deleted
Deleting Version 9
Deleted
Deleting Version 10
Deleted
Deleting Version 11
Deleted
Tiny migrations "framework" that makes using sqlite in vals a little easier.
Not great yet, so far can only run "up" for migrations you haven't run yet or down for all the ones you have run.
See https://www.val.town/v/saolsen/sqlite_migrations_example for usage.
Display Markdown
Takes a markdown document (as a string) and returns an http handler that renders it.
Example https://www.val.town/v/saolsen/display_markdown_example
Display Mermaid
Takes a mermaid document (as a string) and returns an http handler that renders it.
Example https://www.val.town/v/saolsen/display_mermaid_example
import { displayMermaid } from "https://esm.town/v/saolsen/display_mermaid";
const mermaid = `
sequenceDiagram
Alice->>John: Hello John, how are you?
John-->>Alice: Great!
Alice-)John: See you later!
`;
export default displayMermaid(mermaid);
P5 sketch
Easily turn a p5.js sketch into a val. See https://www.val.town/v/saolsen/p5_sketch for an example.
Usage
- Make a p5 sketch, you can import the p5 types to make it easier.
import type * as p5 from "npm:@types/p5";
-
Export any "global" p5 functions. These are functions like
setup
anddraw
that p5 will call. -
Set the val type to http and default export the result of
sketch
, passing inimport.meta.url
.
A full example looks like this.
import type * as p5 from "npm:@types/p5";
export function setup() {
createCanvas(400, 400);
}
export function draw() {
if (mouseIsPressed) {
fill(0);
} else {
fill(255);
}
ellipse(mouseX, mouseY, 80, 80);
}
import { sketch } from "https://esm.town/v/saolsen/p5";
export default sketch(import.meta.url);
How it works
The sketch function returns an http handler that sets up a basic page with p5.js added. It then imports your module from the browser and wires up all the exports so p5.js can see them. All the code in your val will run in the browser (except for the default sketch
export) so you can't call any Deno functions, environment variables, or other server side apis.