Coming from Gradio

Gradio excels at building ML demo interfaces. webwrench targets a broader set of dashboard and reporting use cases with a simpler architecture.

Key Conceptual Differences

Concept	Gradio	webwrench
Primary use case	ML model demos	Dashboards and HTML reports
Layout model	Blocks with `gr.Row`, `gr.Column`	Context managers: `ww.columns`, `ww.tabs`
Event handling	`.click(fn, inputs, outputs)`	`@widget.on_change` decorator
Dependencies	Many (fastapi, pydantic, etc.)	Zero runtime dependencies
Frontend	Svelte components	bitwrench.js
Sharing	Gradio hosted sharing links	Static HTML export

Side-by-Side Examples

Text Input with Output

Gradio webwrench

Gradio	webwrench
`import gradio as gr def greet(name): return f"Hello {name}!" gr.Interface( fn=greet, inputs="text", outputs="text", ).launch()`	`import webwrench as ww ww.title("Greeter") name = ww.input("Name") output = ww.text("") @name.on_change def greet(val): output.update(f"Hello {val}!") ww.serve()`

import gradio as gr

def greet(name):
    return f"Hello {name}!"

gr.Interface(
    fn=greet,
    inputs="text",
    outputs="text",
).launch()

import webwrench as ww

ww.title("Greeter")
name = ww.input("Name")
output = ww.text("")

@name.on_change
def greet(val):
    output.update(f"Hello {val}!")

ww.serve()

Slider Control

Gradio webwrench

Gradio	webwrench
`import gradio as gr def scale(data, n): return [d * n for d in data] with gr.Blocks() as demo: s = gr.Slider(1, 10, value=1) out = gr.JSON() s.change(scale, [s], [out]) demo.launch()`	`import webwrench as ww data = [10, 20, 30] chart = ww.chart(data, type="bar", labels=["A", "B", "C"]) s = ww.slider("Scale", min=1, max=10) @s.on_change def scale(n): chart.update([d * n for d in data]) ww.serve()`

import gradio as gr

def scale(data, n):
    return [d * n for d in data]

with gr.Blocks() as demo:
    s = gr.Slider(1, 10, value=1)
    out = gr.JSON()
    s.change(scale, [s], [out])

demo.launch()

import webwrench as ww

data = [10, 20, 30]
chart = ww.chart(data, type="bar",
    labels=["A", "B", "C"])
s = ww.slider("Scale", min=1, max=10)

@s.on_change
def scale(n):
    chart.update([d * n for d in data])

ww.serve()

Gradio Concepts That Map Differently

gr.Interface — No direct equivalent. webwrench uses individual widget + callback patterns instead of input/output function mapping.
gr.Blocks — Similar to webwrench script mode. Elements are added sequentially.
.change(fn, inputs, outputs) — webwrench uses @widget.on_change and calls .update() on targets directly.
Sharing links — webwrench uses ww.export() for static sharing. For live sharing, deploy as a standard Python web server.

Advantages of webwrench

Zero dependencies — no FastAPI, uvicorn, or pydantic required
Self-contained HTML export for offline sharing
Direct DOM updates without intermediary serialization
Built-in Chart.js support for data visualization