developer notes

What the tag does, and what it refuses to do.

Everything below describes the script tag you are being asked to add to a build. If you are the person who has to approve it, this is the page for you — and the security page covers what leaves the browser, and how to verify the file yourself before you approve anything.

the developer's objection

It cannot break your app.

Isolated both ways

The entire UI lives in a shadow root. No style of yours collides with any style of ours, and none of ours leaks into your page.

shadow DOM

Nothing to break at load

The loader is dependency-free ES5 that runs before anything else. The heavy drawing canvas loads only when someone enters draw mode.

no bundle, no build step

Immutable versions

Every release is a frozen folder on the CDN and only the loader points at it, so a deploy can never pair a new script with a stale stylesheet. A rollback is repointing one small file.

/v/<version>/

Off in production by default

The tag names the hostnames it may run on. Ship it everywhere; on any host you did not list it does nothing until you tell it otherwise.

data-hosts
local-firstWork lives in IndexedDB in the browser and is published deliberately. Nothing leaves until you publish it.
no screenshotsAnnotations are vector data rendered over the real product. Nothing about your interface is copied to a server as an image.
no passwordsThe step recorder never records what was typed into a password field.
no customer dataRoute grouping keeps parameter names and drops their values — /orders?tab,id. The screen is identified; the order number never enters the grouping.

what it needs from you

Where it works, and where it doesn't.

source detection
Finding the file and line reads React debug data or build-time source attributes, so it wants a development build — which is where this product belongs. Against a minified production bundle you keep the pin, the route and the steps, and lose the file path.
pin anchoring
Anchors re-resolve against the live DOM and survive scroll and reflow well. Component libraries that mint fresh element ids on every mount are an active area of work. A pin that cannot be placed honestly renders nothing rather than guessing a position and pointing at the wrong component.
← Back to zidl.io