SuperAPI AI Directory
Partner with us中文AI newsFavorites
DirectoryNews and tutorials

AGenUI - The Native A2UI Framework Open-Sourced Jointly by Amap and Alibaba

Author: AI小集 · Original source: AI工具集

What Is AGenUI

AGenUI is the industry's first end-cloud integrated native A2UI open-source framework covering iOS, Android, and HarmonyOS, launched by Amap in collaboration with the Alibaba Qwen consumer application team. The framework is built on Google A2UI open protocol, completing device-side native rendering capabilities, enabling AI Agent output to be directly transformed into interactive native cards without writing separate UI code for different platforms, driving AI applications from text interaction toward generative UI interaction.

AGenUI

Main Features of AGenUI

  • Native Rendering on Three Platforms: One codebase runs simultaneously on iOS, Android, and HarmonyOS, with device-side rendering directly into native components.
  • Complete A2UI Protocol Implementation: Based on the Google A2UI protocol, it defines a standard way for models to describe interfaces and completes device-side execution capabilities.
  • Rich Component Ecosystem: Built-in 22 basic components and 45 CSS properties, supporting complex components such as Chart, RichText, Lottie, PageViewer, and audio/video players.
  • Streaming Real-Time Rendering: Adopts a Streaming-first architecture, where components are mounted and presented as they are generated, combined with differential updates and asynchronous rendering.
  • Theme Design System: Achieves automatic mapping from semantic descriptions to brand styles through Design Tokens, supporting dark/light modes.
  • Three-Dimensional Component Customization: Supports flexible customization and overriding at the component level, function call level, and theme level.

Technical Principles of AGenUI

  • End-Cloud Integrated Architecture: The cloud side generates JSON data conforming to the A2UI specification through Agent Skill, reducing the large model's token consumption and output uncertainty; the device side relies on a cross-platform C++ Core to uniformly handle protocol parsing, state management, and layout computation, rendering directly into native components on all three platforms, ensuring consistent multi-platform experience from the ground up.
  • Streaming-First Architecture: Supports mounting components immediately upon arrival, achieving "presentation while generating"; combined with minimized node differential updates and independent-thread asynchronous rendering mechanisms, high-frequency incremental updates do not block the main thread, ensuring a smooth 120fps animation experience.
  • Native Cross-Platform Kernel: Uses C++ Core as the cross-platform foundation, directly calling the native rendering pipeline on each platform, rather than relaying through WebView or a self-drawn engine, achieving ultimate first-frame rendering performance and native interaction experience.

Core Advantages of AGenUI

  • One Codebase for Three Platforms: One codebase simultaneously covers iOS, Android, and HarmonyOS, completely eliminating the cost of duplicate cross-platform UI development.
  • Device-Side Native Rendering: Directly calls each platform's native rendering pipeline, greatly reducing first-frame time, with animation smoothness reaching 120fps, far exceeding WebView solutions.
  • Streaming Real-Time Presentation: Adopts a Streaming-first architecture, where components are mounted and presented as they are generated, allowing users to start interacting without waiting for a complete response.
  • Differential Asynchronous Updates: Minimized node differential updates combined with independent-thread asynchronous rendering, high-frequency incremental updates do not block the main thread, remaining smooth even in complex scenarios.
  • Built-In Design System: Achieves automatic mapping from semantics to brand through Design Tokens, allowing Agent-generated UI to directly align with product visual standards, and supports dark/light modes.
  • Minimal integration experience: Unified API design, SDK integration can be completed in just a few lines of code, greatly lowering the barrier to Agent UI development.

AGenUI project address

  • Project official website：https://genui.amap.com/
  • GitHub repository：https://github.com/AGenUI/AGenUI

Comparison of AGenUI with similar competing products

Comparison dimension AGenUI AG-UI (CopilotKit) React Native
Product positioning An end-cloud integrated native UI generation framework for AI Agents, enabling large model output to be directly transformed into interactive native interfaces. A real-time interaction protocol for frontend Agent-UI, enabling bidirectional data flow between LLMs and frontend components, with a focus on Web scenarios. A traditional cross-platform mobile application development framework that uses JavaScript to write logic and native components to render UI, and is not designed for Agent scenarios.
Protocol foundation Based on Google A2UI open protocol, it defines a standard JSON format for models to describe interfaces and completes device-side native execution capabilities. Self-developed AG-UI protocol, which drives frontend component state updates through event streams to achieve bidirectional binding between LLMs and UI. There is no specific Agent protocol; developers need to handle the parsing and mapping logic from LLM output to UI themselves.
Supported platforms Covers iOS, Android, and HarmonyOS simultaneously, allowing one codebase to run across platforms. Mainly focused on the Web ecosystem, relying on frontend frameworks (React/Vue/Angular); mobile requires WebView or PWA. Supports iOS and Android, can be extended to Web and desktop through community solutions, but does not support native HarmonyOS.
Rendering method Device-side native rendering, with a cross-platform C++ Core directly calling each platform's native rendering pipeline, without WebView intermediation. Frontend framework-agnostic rendering, ultimately relying on the browser or WebView rendering engine, not direct native component output. Native rendering, with JavaScript bridging to call platform native components, delivering performance close to purely native applications.
AI-native design Designed from scratch specifically for Agent scenarios, with components, layout, and interactions all optimized around large model generative output. Designed specifically for Agent scenarios, providing frontend-level LLM state management and component linkage mechanisms. A general-purpose application development framework with no built-in Agent or LLM interaction capabilities and requiring complete custom encapsulation.
Streaming generation Adopts a Streaming-first architecture, where components are mounted and displayed as they are generated, combined with differential updates and asynchronous rendering. Supports event stream driving, where LLM output can be mapped to frontend state in real time, but component rendering is limited by frontend framework performance. Does not support native streaming UI generation; achieving a similar effect requires developers to build a complex state management solution themselves.
Component ecosystem Built in with 22 basic components and 45 CSS properties, covering complex components such as Chart, RichText, Lottie, and audio/video players. Relies on existing component libraries in the frontend ecosystem, binding LLM capabilities through the protocol layer; component richness depends on the chosen frontend framework. Has a vast community component ecosystem, but components need to be manually orchestrated and cannot be dynamically generated and combined by an Agent.
Performance First-frame rendering time is greatly reduced, supporting smooth 120fps animations, with high-frequency incremental updates that do not block the main thread. Performance is limited by browser or WebView rendering efficiency, and frame drops are likely in scenarios with complex animations and high-frequency updates. Native rendering performance is excellent, but JavaScript bridge communication incurs overhead, and complex scenarios require additional optimization.
Integration Method With a few lines of code using a unified API, the SDK can be integrated; after A2UI data is generated on the cloud side, it is automatically mapped to native interfaces on the device side. The SDK must be introduced into the front-end project and an AG-UI protocol adaptation layer must be configured, which imposes certain requirements on the front-end technology stack. A complete development environment must be set up, and JSX components and native module bridge code must be written, resulting in relatively high integration costs.
Open Source License Open source MIT open source MIT open source

Application Scenarios of AGenUI

  • Intelligent Assistant Interactive Cards: In complex scenarios such as map navigation, local life, and travel services, the Agent generates interactive native cards in real time, allowing users to complete operations such as queries, bookings, and payments without jumping to another page.
  • Dynamic Data Visualization: The Agent instantly generates native chart components such as line charts, bar charts, and pie charts based on the conversation context, transforming abstract data into intuitive and visual native interfaces on the device side.
  • Rich Media Content Display: Supports dynamic generation of rich interactive content such as mixed text and images, carousels, Lottie animations, and audio/video playback, meeting the multimedia presentation needs of scenarios such as marketing, news, and education.
  • Enterprise-Level Cross-Platform Agent Applications: Aimed at B2B intelligent agent products that need to be deployed simultaneously on iOS, Android, and HarmonyOS and have high requirements for performance, visual consistency, and interaction smoothness, greatly reducing multi-platform adaptation costs.