UI రూపొందించడానికి తక్కువ టోకెన్లు
Lyra UI తో AI 26% తక్కువ టోకెన్లు రాస్తుంది.
Claude Sonnetను ఒకే చాట్, డ్యాష్బోర్డ్, సెట్టింగ్ల ఇంటర్ఫేస్లను Lyra UI తో, React, Tailwind, shadcn/ui తో, అలాగే సాధారణ HTML, CSS, JavaScript తో నిర్మించమని అడిగాము (18 రన్లు). Lyra UI తో shadcn/ui కంటే 26% తక్కువ అవుట్పుట్ టోకెన్లు, 46% తక్కువ లైన్లు రాసింది; సాధారణ HTML కంటే 33% తక్కువ టోకెన్లు రాసింది, ఎందుకంటే ఒక్క ట్యాగ్ మార్కప్, స్టైలింగ్, స్టేట్ను భర్తీ చేస్తుంది. Lyra రన్లు ఏజెంట్లు క్యాష్ చేసి మళ్లీ ఉపయోగించే llms-full.txt సూచనను కూడా చదివాయి.
ఉదాహరణ
కొన్ని ట్యాగ్లతో ఒక చాట్ ఇంటర్ఫేస్.
<script type="module">
import '@aceshooting/lyra-ui/components/lr-chat-viewport.js';
import '@aceshooting/lyra-ui/components/lr-chat-message.js';
import '@aceshooting/lyra-ui/components/lr-chat-composer.js';
</script>
<lr-chat-viewport>
<lr-chat-message message-role="user">Summarize this report.</lr-chat-message>
<lr-chat-message message-role="assistant" status="streaming">Here are the key points…</lr-chat-message>
</lr-chat-viewport>
<lr-chat-composer placeholder="Ask anything"></lr-chat-composer>