Server Side Rendered (ssr)

Category: frontend | Form: | Symbol: Sr

Host a Server-Side Rendered application (Next.js, Nuxt)

SSR renders HTML on the server per-request for SEO, fast initial load, and dynamic data injection. The render operation follows a 3-step fallback chain: (1) cached build from S3 (namespace exp-{element_id}), (2) template rendering via code_ref using the RenderForce (Handlebars/Tera/Minijinja), (3) built-in placeholder with multi-page demo. Render accepts path (route within the app) and data (context object for template variables). The build operation uses BuildForce with framework hints: next, nuxt, sveltekit, astro. Set spec.framework (required, default “next”) and optionally spec.source and spec.code_ref. An empty code_ref is treated as None — it won’t produce empty HTML bypassing the fallback. Use ssr over spa when you need SEO, server-side data fetching, or per-route dynamic content. Use view instead if you don’t need custom code. Common mistake: setting code_ref to an empty string and expecting template rendering — empty strings are explicitly filtered out.

Guide

Server-side rendered applications with template fallback and dynamic data injection.

Overview

SSR elements render HTML on the server for every request, providing SEO benefits, fast initial load, and dynamic data integration. The rendering pipeline uses a 3-step fallback chain: cached build → template rendering → built-in placeholder.

How Rendering Works (physics/src/physics/impls/ssr.rs)

Render Operation

1. Cached build: Checks S3 (exp-{element_id}/builds/latest/index.html) for pre-built HTML
2. Template rendering: If no cached build, uses spec.code_ref to render via the RenderForce (supports Handlebars, Tera, Minijinja). The data input is passed as template context
3. Default placeholder: If no code_ref (or it’s empty), serves a built-in multi-page demo with hash routing

Key detail: empty code_ref strings are explicitly treated as None — they won’t produce empty HTML that bypasses the fallback.

Build Operation

Uses BuildForce with framework-specific hints:

Framework	Hint
next	FrameworkHint::Next
nuxt	FrameworkHint::Nuxt
sveltekit	FrameworkHint::SvelteKit
astro	FrameworkHint::Astro

Source defaults to “local”. Artifacts are stored to S3 with manifest and entry HTML.

Configuration

Required Fields

Field	Type	Default	Description
framework	enum	next	next, nuxt, remix, sveltekit, astro

Key Properties

Property	Type	Description
source	string	Git URL or path (default: “local”)
code_ref	string	Template reference for RenderForce rendering
rendering.default_strategy	enum	ssr, ssg, isr, csr
runtime.mode	enum	nodejs, edge, hybrid
runtime.memory_mb	integer	Memory allocation (128-4096, default 512)
runtime.timeout_ms	integer	Request timeout (1000-300000, default 30000)
environment.server_variables	object	Server-side only env vars
environment.client_variables	object	Client-exposed env vars

Operations

Operation	Description
render	3-step fallback: cached build → code_ref template → placeholder. Accepts path and data
build	BuildForce with framework hint. Returns build_hash, asset_count, size_bytes, duration_ms

Plus all category operations.

Quick Start

# Create an SSR app with Next.js
POST /api/{circle}/frontend/ssr/
{
  "slug": "my-site",
  "spec": { "framework": "next" }
}

# Build it
POST /api/{circle}/frontend/ssr/my-site/ops/build
{ "environment": "production" }

# Render a specific route with data
POST /api/{circle}/frontend/ssr/my-site/ops/render
{
  "path": "/about",
  "data": { "user": { "name": "Alice" } }
}

Template-based rendering (no build needed)

POST /api/{circle}/frontend/ssr/
{
  "slug": "my-template",
  "spec": {
    "framework": "next",
    "code_ref": "templates/landing.html"
  }
}

# Render with data context
POST /api/{circle}/frontend/ssr/my-template/ops/render
{ "data": { "title": "Welcome", "items": [1, 2, 3] } }

SSR vs SPA vs View

Feature	SSR	SPA	View
Build required	Yes	Yes	No
SEO	Excellent	Poor	Excellent
Dynamic data	Per-request	Client fetch	Data bindings
Custom code	Full control	Full control	No code
CDN cacheable	No	Yes	No

S3 Storage

• Namespace: exp-{element_id}
• Build artifacts: builds/latest/{filename}
• Manifest: builds/latest/manifest.json
• Entry HTML: builds/latest/index.html

When to Use

• SEO-critical pages (marketing sites, blogs, docs)
• Pages with server-side data fetching
• Dynamic content that changes per-request
• Full-stack frameworks (Next.js, Nuxt, SvelteKit, Astro)

When NOT to Use

• Pure client-side apps → use spa
• Simple forms/dashboards → use view
• 3D experiences → use three-d

Related

• View — No-code declarative UI
• SPA — Client-side rendering
• Frontend Category — Shared operations

Relationships

• Attaches to: rate-limit, auth-policy
• Uses: variable, function, sql, document

Capabilities

• buildable: Supports build/serve/assets operations
• ssr: Server-side rendering
• edge: Edge runtime support
• api-routes: API route discovery
• streaming: Streaming SSR

Properties

Property	Type	Default	Description
template	string	—	HTML template with {{variable}} placeholders for server-side substitution
source	string	—	Git reference to source code directory
code_ref	string	—	Reference to the code source for rendering
framework	string	"next"	SSR framework. vanilla serves a hand-written index.html from the workspace with no bundler/npm build — the right choice for a single static page.
build	object	—	Build configuration
runtime	object	—	Runtime configuration
routing	object	—	Routing configuration
api	object	—	API routes configuration
rendering	object	—	Rendering strategy
environment	object	—	Environment variables
optimization	object	—	Build optimization settings
cdn	object	—	CDN configuration
security	object	—	Security configuration
preview	object	—	Preview environments

Operations

activity

Get /ops/activity | Auth: Read

Get activity events for this element

Scope depends on element capabilities: individual elements query by element_id, project-form elements with activity-scope-members include member activities, circle-level elements with activity-scope-all query the entire circle. Gracefully returns empty list if activities table is missing (old circles).

analytics

Get /ops/analytics | Auth: Read

Get experience usage analytics

Returns usage metrics for the frontend element. Use ?period query param (1d, 7d, 30d, 90d) to specify the time window. Returns views, unique_visitors, avg_session_duration_ms, bounce_rate, and top_paths. Useful for understanding user engagement with the frontend.

asset

Get /ops/assets/{asset_path} | Auth: Read

Serve a static asset from the build output (JS, CSS, WASM, images)

Serves a single asset by path from the build output. Returns binary content with appropriate Content-Type header. Used by the browser to load JS/CSS/WASM referenced in the served HTML. Typically called via /live URLs, not directly by agents.

assets

Get /ops/assets | Auth: Read

List bundled static assets

Lists all static assets from the last build output (JS, CSS, images, fonts). Each asset includes path, type, size_bytes, and content hash for cache busting. Returns total_size_bytes for the whole bundle. Only meaningful after a successful build.

attach

Post /ops/attach | Auth: Read

Attach this experience to a target element

Attaches this frontend to a target element (e.g., browser or user-browser). The target’s contract.yaml must declare this frontend type in attaches. Priority controls ordering when multiple frontends are attached. Returns attachment_id for later detach.

attachments

Get /ops/attachments | Auth: Read

List all modifiers and resources attached to this element

Returns both modifiers (policy enforcement) and resources (data injection) with is_modifier flag to distinguish. Items in the generated MODIFIER_TYPES list are modifiers; everything else is a resource. Includes cascade_policy and version pin info.

batch_stats

Get /ops/batch_stats | Auth: Read

Get per-element statistics for all children of this element

Returns per-child stats plus an aggregate. Most meaningful on compound or manifest form elements (repositories, circles, projects); atoms have no children so the result is an empty children array with a zeroed aggregate. Uses efficient GROUP BY SQL. Weighted averages for eval scores.

build

Post /ops/build | Auth: Write

Build the SSR application

Builds via BuildForce with framework hints: nextjs, nuxt, sveltekit, astro. Source defaults to “local”. Stores build artifacts and manifest to S3, plus index.html at well-known path for fast serve. clean:true deletes previous artifacts first. Returns build_id, build_hash (12 chars), asset_count, size_bytes, duration_ms, cache_hit.

build_status

Get /ops/build/{build_id} | Auth: Read

Get build status and logs

Poll this after triggering an async build. Returns status (pending/building/completed/failed), duration_ms, artifact list with sizes, build logs, and error message if failed.

compose

Post /ops/compose | Auth: Execute

Batch add and remove modifiers on this element in a single call

Declarative composition: add modifiers by ref path (slug or path@version) and remove by attachment ID, all in one atomic call on the target element. Each ‘add’ entry resolves the source element, validates topology, attaches with optional priority and cascade policy. Each ‘remove’ entry deletes the attachment row. Returns a summary of what was added and removed. Example: compose({ add: [{ref: “my-prompt”}, {ref: “rate-limit/api@v2”, priority: 50}], remove: [{attachment_id: “uuid”}] })

configure_domain

Post /ops/domain | Auth: Admin

Configure a custom domain for this experience

Maps a custom domain (e.g., app.example.com) to this frontend element. ssl_mode “auto” provisions a Let’s Encrypt certificate automatically. Returns status (pending_verification, active, error) and ssl_status. DNS must point to Triform before verification succeeds.

context

Get /ops/context | Auth: Read

Get connected elements (graph traversal)

Graph traversal showing all connected elements with their relationship type (contains, contained_by, references, referenced_by, attaches, etc.). Use ?depth=N to control traversal depth (default 1) and ?types=actor,data to filter by element types.

create

Post /ops/create | Auth: Write

Create child element

POST to the parent path — element_type goes in the request body, NOT the URL. Both element_type and slug are required and must be non-empty. Name is derived from slug if omitted. Writes to both Git and PostgreSQL. All elements are stored flat under the circle — no intermediate library wrapper rows.

create_preview

Post /ops/preview/create | Auth: Write

Create a time-limited public preview link (no auth required to view)

Generates a shareable preview URL that expires after expires_in_hours (default 24). Anyone with the URL can view the frontend without authentication. Returns the token, full preview URL, and expiration timestamp. Use for stakeholder reviews or demos.

delete

Delete /ops/delete | Auth: Admin

Delete element (soft delete)

Soft delete — sets state to ‘deleted’ but retains the record. Cannot delete elements that have children (has_no_bond precondition) or active runs. Requires admin auth and confirmation.

detach

Post /ops/detach | Auth: Read

Detach this experience from a target element

Removes the attachment between this frontend and a target element. Requires target_id. This is a destructive action — the frontend will no longer be served through that target.

disable

Post /ops/disable | Auth: Admin

Disable element (hides and prevents use)

Idempotent — safe to call on already-disabled elements. Optionally pass a reason string. Disabled elements cannot be invoked or executed. Inverse of enable.

enable

Post /ops/enable | Auth: Admin

Enable element (makes usable and visible)

Idempotent — safe to call on already-enabled elements. Transitions element to ready/enabled state. Cannot enable deleted elements. Inverse of disable.

export_bundle

Get /ops/export/bundle | Auth: Read

Export element as downloadable git bundle

On non-root-namespace elements, returns a binary git bundle. On root-namespace (circle) elements, dispatch hands off to the circle’s own export_bundle op, which returns a multi-element JSON envelope with one base64 bundle per child element — this is intentional, not an error.

get

Get /ops/get | Auth: Read

Get element details

Element is already resolved by the routing layer — this returns the cached element, not a fresh DB query. Use the path /api/{circle}/{slug} to address elements.

get_attached_modifiers

Get /ops/attached | Auth: Read

Get elements that are attached to this experience

Returns modifiers and resources attached TO this frontend (inverse of list_attachments). Includes rate-limit, auth-policy, and other modifier elements that affect this frontend.

import_bundle

Post /ops/import/bundle | Auth: Write

Import git bundle into element

Accepts a base64-encoded git bundle in the JSON bundle_base64 field. Use overwrite=true to replace existing elements with same slug (default skips duplicates). Imported elements get new UUIDs. Returns counts of imported/skipped elements and any errors.

intention

Get /ops/intention | Auth: Read

Get element intention with full inheritance chain

Returns three levels: direct (this element’s intention), inherited (from category and root), and resolved (final merged intention). Useful for understanding an element’s purpose in context of its hierarchy.

list_attachments

Get /ops/targets | Auth: Read

List all elements this experience is attached to

Returns all target elements where this frontend is currently attached. Shows target_id, target_type, priority, and cascade_policy.

navigate

Post /ops/navigate | Auth: Read

Navigate to a route within the SPA (returns index.html for client-side routing)

For SPAs, this is identical to serve — always returns the same index.html regardless of the path parameter. Client-side JavaScript handles route resolution (history API fallback). Do not expect different HTML for different paths. For per-route server rendering, use ssr.

preview

Get /ops/preview | Auth: Read

Generate a preview/screenshot of the experience

Generates an image preview of the rendered frontend. Use query params ?width, ?height, ?path to customize. Returns image_url with an expiration timestamp. Useful for social cards and portal thumbnail previews.

promote

Post /ops/promote | Auth: Admin

Promote element configuration to a target environment

Only for manifest-form elements (projects). Environments advance: dev → demo → live. dev→demo requires member+ role, demo→live requires admin. Freezes member versions at promotion time (creates snapshot). Persists environment config to spec.environments.

readme

Get /ops/readme | Auth: Read

Get element README.md content

Reads README.md from the element’s git repository. Returns empty content (not an error) if no README exists. Always returns markdown format.

readme_update

Post /ops/readme_update | Auth: Write

Update element README.md content

Creates or overwrites README.md in the element’s git repo. Commits to the draft branch. Content must be provided as a markdown string.

remove-modifier

Post /ops/remove-modifier | Auth: Execute

Remove an attached modifier from this element by attachment ID

Removes a modifier/resource attachment by its row ID. The ID comes from the attachments or context API. This is the reverse of attach — called on the target element, not the source.

render

Post /ops/render | Auth: Read

Server-side render the page

3-step fallback: (1) cached build from S3 (exp-{element_id}/builds/latest/index.html), (2) template render via code_ref using RenderForce (Handlebars/Tera/Minijinja) with the data input as context, (3) built-in multi-page placeholder. The path input selects a route within the app (default “/”). Empty code_ref is treated as None to prevent blank HTML. Returns _html_content with _etag and _cache_control: no-cache.

restore

Post /ops/restore | Auth: Admin

Restore element to a specific version

Automatically snapshots the current state before restoring (creates a ‘Before restore to vN’ version entry). Writes restored spec to git as .triform/spec.yaml. Git failures warn but don’t fail the operation — DB state is authoritative. Cannot restore deleted elements.

scaffold

Post /ops/scaffold | Auth: Write

Generate project scaffold from template

Creates a project scaffold from one of the built-in templates (nextjs, nuxt, sveltekit). Writes scaffold files to the element’s git namespace. Requires a template parameter.

schema

Get /ops/schema | Auth: Read

Get element input/output schema (MCP tools/list compatible)

Returns type-level port schemas from the TypeRegistry — not instance-specific overrides. Includes direction (input/output), required flag, and JSON schema per port. Useful for understanding what data an element accepts and produces.

serve

Get /ops/serve | Auth: Read

Serve the built experience (returns HTML)

Returns the index.html from the latest cached build in S3. Without a prior build, returns a placeholder page. Response includes _html_content, _etag, and _cache_control. For SPAs, this is the only HTML page — all routing is client-side. Prefer /live URLs for public access without API auth.

source

Get /ops/source | Auth: Read

Get any file’s content from the element’s git repository

Reads an arbitrary file from the element’s CAS-backed git tree by its relative path. Same store as readme, just generalized. Path safety: rejects .. traversal, leading /, and null bytes. Use this to view main.py for action elements, asset files for SPAs, etc. Returns empty content (not an error) if the file doesn’t exist.

source_branches

Get /ops/source/branches | Auth: Read

List Source branches for this element

Returns the standard draft/demo/live Source branches, their current commits, and promotion relationships. Use GET /api/{element_path}/ops/source/branches.

source_promote

Post /ops/source/promote | Auth: Write

Promote Source branch forward

Promotes draft to demo or demo to live through the generated element op path. Direct Git pushes to demo/live are blocked by Source policy.

source_repair

Post /ops/source/repair | Auth: Write

Inspect or repair the element Source index

Runs Source repair through the element operation path. Defaults to dry_run=true; set dry_run=false only after reviewing a dry-run report.

source_status

Get /ops/source/status | Auth: Read

Get Source control status for this element

Returns the branch-aware clone URL, checkout commands, current draft commit, child source-link count, portable export summary, Source health, warnings, and auth hints for the addressed element. Use the element-first path: GET /api/{element_path}/ops/source/status.

source_validate

Post /ops/source/validate | Auth: Read

Validate Source branch contents

Validates a Source branch before accepting local Git workflow changes or promotion. Defaults to branch=draft and rejects runtime data, generated output, secret material, and unreadable CAS refs.

stats

Get /ops/stats | Auth: Read

Get aggregate statistics for this element

Health status is computed: error if errors_per_day > 5 or success_rate < 0.8, warning if errors_per_day > 0 or success_rate < 0.95. Firing alerts escalate health to error/warning. Default period is ‘day’. Returns runs_per_day, success_rate, avg_duration_ms, and more.

tree

Get /ops/tree | Auth: Read

Get the element’s position in the graph — ancestors, children, references, and subtree statistics

Uses per-circle ElementGraph cache for O(1) lookups. Returns ancestors (containment chain), children (direct), members (references), referenced_by (reverse refs), attachments, and subtree stats. Default depth is 3, max is 10. Pass ?include_metadata=true for name/state on each node.

update

Patch /ops/update | Auth: Write

Update element

Partial update — send only the fields you want to change. spec, name, and intention are all independently optional. spec MUST be a JSON object when present; deep-merged into the existing spec by default. Empty {"spec":{}} preserves existing spec content but still records a new version (no-op for content, not for version state). To clear/replace the entire spec wholesale send {"spec":{...},"deep":false}. List-typed spec fields use replace semantics (the patch list replaces the existing list, no array merging). Coordinates Git + DB writes. Slug cannot be changed after creation.

update_meta

Patch /ops/update_meta | Auth: Write

Update element metadata (lightweight merge — does NOT bump version or snapshot spec)

Shallow JSONB merge into element.meta. Top-level keys in the provided value replace existing meta values; other keys are preserved. Used for UI metadata like canvas positions, panel state, viewer preferences. Wire-shape op_name is update_meta (distinct from update) so SSE subscribers + the cache auto-invalidator can distinguish lightweight metadata changes from spec edits without inspecting the payload. The MutatingElementStore wrapper stamps this op_name on the lifecycle event emitted by update_element_meta storage calls.

version

Get /ops/version | Auth: Read

Get current version or full history

Returns current version by default. Pass ?history=true for full version history (up to ?limit=N, default 50). Versions are backed by the element_versions table. Every spec update creates a new version entry.

Error Codes

Code	Class	Retryable	Description
SSR_BUILD_FAILED	internal	yes	SSR build failed
SSR_RUNTIME_ERROR	internal	no	SSR runtime error