# Generative UI... in Python? — Jeremiah Lowin, Prefect

## Executive summary

This talk introduces Prefect, a Python DSL designed to solve the challenge of delivering rich, interactive UIs within the MCP (Messaging/Communication Protocol) ecosystem. While MCP apps allow tools to bypass the agent and render full HTML/CSS/JS interfaces, the primary user base (Python engineers in enterprises) needed a way to build these UIs without writing complex frontend code. Prefect achieves this by allowing developers to compose UIs using Python context managers and classes, which are then serialized into a JSON protocol and rendered by a React app. A key optimization is streaming the Python code itself over the wire and executing it in a sandbox, resulting in a 70% reduction in size compared to streaming the JSON representation.

## Key takeaways

- MCP Apps and Agent Bypass: MCP apps are an extension of the MCP protocol that allows tool results to bypass the agent and be delivered directly to the user as a full UI (HTML, CSS, JavaScript), enabling rich, interactive experiences.
- The Prefect Solution: Prefect is a Python DSL that allows developers to compose UIs by nesting components using context managers, avoiding the need to write traditional frontend code.
- The Core Pipeline: The process involves using a Python DSL to build a declarative representation, which is serialized into a JSON protocol. This JSON is then rendered by a React app hosted as the MCP app.
- Efficiency Improvement: The system was optimized to stream the Python representation of the UI over the wire and execute it in a sandbox, which was found to be approximately 70% smaller and more efficient than streaming the full JSON protocol.

## Technical details

- MCP Protocol Extension: MCP apps allow tool results to be delivered as a full UI (HTML, CSS, JS), enabling direct user interaction without the agent's context window being the sole intermediary.
- Python DSL and Composition: Prefect uses Python context managers to build the UI structure, treating every component as a class that can be instantiated and parameterized. This approach focuses on composing existing, world-class components rather than building a UI from scratch.
- Client-Side Interactivity: Reactive variables (RX) allow for creating client-side interactivity and binding data between components without requiring explicit JavaScript code.
- FastMCP Integration: In FastMCP, returning a Prefect component from a tool function automatically signals that the result should be an MCP app, triggering the necessary machinery to render the interactive UI for the user.
- File Upload Improvement: Prefect enables a secure and efficient file upload mechanism for MCP apps, allowing files to bypass the agent and go directly to the server, solving the 'world's most expensive copy paste operation' problem.

## Practical implications

- Build interactive data tools (e.g., data tables, charts) for enterprise users using only Python.
- Create full-featured MCP applications with integrated backend logic and frontend UI.
- Implement efficient file upload functionality that bypasses the agent's context window.
- Enable generative UIs by exposing a tool that accepts a UI protocol serialization (JSON/Python) for real-time rendering.

## Topics

Build Engineering, UI/UX Development, Python DSL, Protocol Design, Agentic Systems, Web Development, Prefect, FastMCP

Source: https://www.youtube.com/watch?v=Krzs8GeiWTc