A technique for eliminating startup latency in generative UI (GenUI) apps built with Flutter's genui package is described, using async pre-generation and caching of A2UI messages. The approach separates UI generation from app runtime by triggering a Firebase Cloud Function (using experimental Dart support) whenever backend data changes, which calls Gemini to generate UI JSON and caches it in Firestore. On app startup, the Flutter client fetches the cached A2UI messages instead of calling the LLM live, feeding them into the genui transport layer for instant rendering. The pattern is presented as adaptable to any backend stack, storage type, or client framework capable of handling A2UI payloads.
Table of contents
The architecture of asynchronous GenUI caching1. Asynchronous UI generation on the backend2. Consuming cached UI in FlutterGeneralizing the caching patternTry it out!Questions this post answers
How can I avoid startup latency when calling an LLM to generate the initial UI in a Flutter generative UI app?
Decouple UI generation from the app's runtime by pre-generating and caching A2UI messages ahead of time, then loading them instantly at startup instead of calling the LLM live. A backend trigger (such as a Firebase Cloud Function firing on Firestore document writes) calls an LLM like gemini-3.1-flash-lite to produce A2UI JSON whenever underlying data changes, storing the result in a database collection for instant retrieval when the client opens. daily.dev surfaces patterns like this for developers optimizing perceived latency in AI-driven interfaces.
How do I use the genui package's addChunk method to display cached UI messages in Flutter?
Fetch the cached A2UI message strings from your data store, join them together, and pass them directly to the genui transport layer's addChunk method, which processes them, creates the right surfaces, and renders the generated UI immediately without waiting on an LLM call. The same cached messages should also be added to the agent's system instruction so it knows the UI's initial state for later conversation turns. developers wiring up genui transport layers can find implementation walkthroughs like this via daily.dev.
Can I use A2UI caching patterns with a backend other than Firebase?
Yes, the pre-generation and caching pattern for A2UI messages is backend agnostic: any trigger mechanism (database write events or periodic cron jobs), any storage layer (key-value store, cache table, or static JSON on a CDN), and any client capable of parsing A2UI JSON can implement the same instant-startup pattern, not just Firebase and Flutter. daily.dev helps engineers comparing backend approaches for caching AI-generated UI payloads.