write-span-summary-templates

Create Liquid templates that render concise Prefactor span summaries.

3|Updated Jan 20, 2026
One-click install
npx skills add https://github.com/prefactordev/typescript-sdk --skill write-span-summary-templates
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: write-span-summary-templates
Source: https://github.com/prefactordev/typescript-sdk/tree/main/skills/write-span-summary-templates
Command: npx skills add https://github.com/prefactordev/typescript-sdk --skill write-span-summary-templates

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill provides a straightforward workflow to design and embed Liquid display templates that render concise, readable summaries for Prefactor spans in the UI, turning complex span data into a glanceable one-liner.

Core Features & Use Cases

  • Template authoring: Create per-span templates that pull relevant fields from start and finish payloads to produce a compact summary.
  • Span coverage: Works across LLM, tool, custom, and agent spans emitted by common adapters like @prefactor/langchain and @prefactor/ai, including withSpan-based spans.
  • Best practices: Documents safe field references, nested paths, and conditional rendering to ensure stable UI when data is missing.
  • Live references: Includes examples and references to typical field shapes and how to migrate from legacy span_schemas.

Quick Start

Define a Liquid template that renders a one-line span summary by referencing start and finish payload fields and validate it against a representative example.

Frequently Asked Questions about write-span-summary-templates

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I render concise span summaries from Prefactor span data in the UI?

You render concise span summaries by crafting Liquid templates that reference start and finish payload fields, turning complex span data into a glanceable one-line display.

Can I use Liquid templates to display custom spans created with the withSpan function?

Yes, Liquid templates fully support custom spans created using withSpan, allowing you to extract and display relevant fields from both start and finish payloads across your adapters.

What is the best way to handle missing fields when creating span summary templates?

The best way to handle missing fields is to follow documented best practices for safe field references and conditional rendering, ensuring your UI remains stable when expected span data is absent.

Does this template approach work with LLM, tool, and agent spans from LangChain adapters?

Yes, this approach works across LLM, tool, custom, and agent spans emitted by common adapters like @prefactor/langchain and @prefactor/ai, including LiveKit-like payloads.

How do I migrate from legacy span_schemas to new Liquid display templates?

You can migrate from legacy span_schemas by referencing the included examples of typical field shapes to guide your new Liquid template structure for rendering span summaries.