Question 1

How do I add syntax highlighting to code blocks in llm-ui?

Accepted Answer

llm-ui integrates Shiki for syntax highlighting, automatically rendering code blocks for all programming languages based on the detected language in the LLM output, without additional configuration needed.

Question 2

Can I use llm-ui with Next.js for server-side rendering?

Accepted Answer

Yes, llm-ui is compatible with Next.js and other React-based frameworks, but since it handles streaming, ensure your SSR setup accommodates client-side hydration for dynamic content to avoid performance issues.

Question 3

What makes llm-ui different from using a regular markdown parser with React?

Accepted Answer

llm-ui is specifically optimized for LLM output, with built-in features like stream throttling and markdown cleanup that address common quirks in AI-generated content, which generic parsers might not handle effectively.

Question 4

How to customize the appearance of llm-ui components?

Accepted Answer

As a headless library, you apply custom styles via CSS or CSS-in-JS by targeting the rendered HTML elements; the library provides the functional structure without any imposed styles, giving full design control.

Question 5

Is llm-ui better than shadcn/ui for building AI chatbots?

Accepted Answer

llm-ui is tailored for LLM interaction with streaming optimizations and markdown handling, while shadcn/ui offers pre-styled components; choose llm-ui for core LLM output management and shadcn/ui for ready-made designs, or combine both for a complete solution.

Question 6

Does llm-ui support non-streaming LLM responses or batch processing?

Accepted Answer

While optimized for streaming, llm-ui can handle static or batch LLM responses, but its key features like throttling may be less beneficial, making it potentially overkill for such use cases.

llm-ui

What is llm-ui?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions