How zauberzeug/nicegui works
NiceGUI is a Python framework for building browser-based interfaces, with an optional native-window mode. The principal workflow is that a Python application declares pages and UI elements; the runtime serves a rendered client, then routes browser interactions back to Python event handlers. The README also describes binding and refreshable functions, timers, persistence, custom routes, and a broad set of higher-level visualization and interaction elements, which are shown as distinct capabilities. The source excerpts support key client, element, storage, and native-event responsibilities; wiring for unsampled subsystems is kept conservative.
Main entry points: elements UI elements · ui.py UI API · app.py App lifecycle · client.py Client rendering
Components 21
Python authoring
- UI API
nicegui/ui.py - Pages and routes
nicegui/page.py - UI elements
nicegui/elements - Visualizations and media
nicegui/elements
Application runtime
- App lifecycle
nicegui/app/app.py - ASGI server
nicegui/server.py - Client rendering
nicegui/client.py - Element model
nicegui/element.py - Event dispatch
nicegui/events.py - Client updates
nicegui/outbox.py
Browser interface
- Vue and Quasar UI
nicegui/static/nicegui.js - DOM querying
nicegui/elements/query.js
State and extensions
- Binding and refresh
nicegui/binding.py - Timers
nicegui/timer.py - Per-user persistence
nicegui/storage.py - Persistence backends
nicegui/persistence - Custom data routes
nicegui/app/app.py - Native window mode
nicegui/native - Native event manager
nicegui/native/event_manager.py
Other components
- App developer
- Browser user
Connections 26
- App developer → UI API: declares interface
- UI API → Pages and routes: registers pages
- UI API → UI elements: creates elements
- UI API → Visualizations and media: creates components
- UI API → App lifecycle: configures runtime
- Pages and routes → Client rendering: builds page
- UI elements → Element model: uses model
- Visualizations and media → Element model: uses model
- App lifecycle → ASGI server: starts server
- ASGI server → App lifecycle: serves requests
- Client rendering → Element model: serializes elements
- Client rendering → Browser user: serves interface
- Browser user → Vue and Quasar UI: uses interface
- Vue and Quasar UI → Client rendering: sends events
- Client rendering → Event dispatch: dispatches events
- Event dispatch → UI elements: invokes handlers
- UI elements → Client updates: queues updates
- Client updates → Vue and Quasar UI: sends updates
- DOM querying → Browser user: updates DOM
- Binding and refresh → UI elements: refreshes values
- Timers → UI elements: triggers updates
- Per-user persistence → Persistence backends: uses backend
- App lifecycle → Per-user persistence: owns storage
- Custom data routes → Browser user: serves responses
- App lifecycle → Native window mode: configures window
- Native event manager → Event dispatch: dispatches handlers