Examples#

The examples/ directory belongs to the framework repo (contributor/developer perspective). For regular app development, start from the ztron init path in Quick Start.

The repo's examples/ directory contains eight runnable examples, all directly runnable via pnpm filters:

Name	Package	Demonstrates	Run command
hello	@zturnlibs/ztron-example-hello	a full drill of invoke/events/Channel/fs/path and other APIs (85 checks)	pnpm --filter @zturnlibs/ztron-example-hello dev
multiwin	@zturnlibs/ztron-example-multiwin	multi-window: conf declaration + runtime WebviewWindow create/destroy	pnpm --filter @zturnlibs/ztron-example-multiwin dev
menuprobe	@zturnlibs/ztron-example-menuprobe	menu capability probing	pnpm --filter @zturnlibs/ztron-example-menuprobe dev
bench	@zturnlibs/ztron-example-bench	automated perf measurement sequence (invoke/Channel/window)	node packages/cli/dist/index.js bench --runs 3
showcase	@zturnlibs/ztron-example-showcase	beginner-friendly interactive demo: 34 feature cards + code snippets + doc links	pnpm --filter @zturnlibs/ztron-example-showcase dev
react-demo	@zturnlibs/ztron-example-react-demo	React 19 + Tailwind v4 verification example (calling Ztron APIs the React way)	pnpm --filter @zturnlibs/ztron-example-react-demo dev
vue-demo	@zturnlibs/ztron-example-vue-demo	Vue 3 + Tailwind v4 verification example (calling Ztron APIs the Vue way)	pnpm --filter @zturnlibs/ztron-example-vue-demo dev
svelte-demo	@zturnlibs/ztron-example-svelte-demo	Svelte 5 + Tailwind v4 verification example (calling Ztron APIs the Svelte way)	pnpm --filter @zturnlibs/ztron-example-svelte-demo dev

hello#

A full drill of @zturnlibs/ztron-api — invoke, events, Channel streams, fs/path/http/os, and other APIs — with 85 built-in deterministic checks; combined with ztron check it serves as the regression baseline for the whole framework (FULL_OK, exit 0). Its ztron.conf.json also demonstrates declarative multi-window (windows[], with both window sources: the url: "frontend" placeholder and inline html). Source: examples/hello/ (config ztron.conf.json, main process src/main.ts, commands src/commands.ts, frontend frontend/src/main.ts).

multiwin#

Demonstrates the two ways of doing multi-window: statically declaring in ztron.conf.json's windows[], and creating/destroying windows at runtime via WebviewWindow (verification anchor MULTI_WINDOW_OK; the second runtime-created window is really created and destroyed, SECOND_WINDOW_OK label=second). Source: examples/multiwin/.

menuprobe#

A menu capability probing example, covering menu construction and dynamic manipulation capabilities. Source: examples/menuprobe/.

bench#

The perf benchmark example: ztron bench drives its automated measurement sequence (cold/warm start, invoke P50/P95, Channel throughput, event round trip, window create, RSS, app size) and compares the results against the perf-budget.json budgets as a regression gate (see the Bench section of the repo root README). Source: examples/bench/.

showcase#

An interactive demo app for beginners (34 cards: live buttons + snippets + doc links). See the dedicated page for viewing and usage: Showcase Demo App.

react-demo#

A React 19 + Tailwind CSS v4 verification example: standard React idioms (createRoot, hooks, React.lazy) running directly on Ztron's dev/build pipeline, exercising dev HMR, IIFE bundling, and the full IPC chain (invoke, events, Channel, window theme). For integration and bundling constraints see the dedicated page: Frontend Frameworks & Third-Party Packages.

vue-demo#

A Vue 3 + Tailwind CSS v4 verification example: standard Vue idioms (<script setup>, composables, defineAsyncComponent) replicating the five react-demo tabs, covering dev HMR, IIFE bundling, and the full IPC chain; smoke anchor VUE_DEMO_OK. For integration see the dedicated page: Frontend Frameworks & Third-Party Packages.

svelte-demo#

A Svelte 5 + Tailwind CSS v4 verification example: standard Svelte 5 idioms (runes, a mount entry, {#await import} lazy loading) replicating the five react-demo tabs, covering dev HMR, IIFE bundling, and the full IPC chain; smoke anchor SVELTE_DEMO_OK. For integration see the dedicated page: Frontend Frameworks & Third-Party Packages.

Each example depends on workspace packages inside the monorepo; complete Installation and the native chain build first.

Deep dive: Architecture · IPC · Security ACL · CLI Command Reference

适用版本：ztron 0.3.0