رموز أقل لتوليد واجهة المستخدم

يكتب الذكاء الاصطناعي رموزًا أقل بنسبة 26% مع Lyra UI.

طلبنا من Claude Sonnet بناء واجهات الدردشة ولوحة المعلومات والإعدادات نفسها باستخدام Lyra UI، وباستخدام React وTailwind وshadcn/ui، وباستخدام HTML وCSS وJavaScript الخالصة (18 تشغيلًا). ومع Lyra UI كتب النموذج رموز إخراج أقل بنسبة 26% وأسطرًا أقل بنسبة 46% مقارنةً بـ shadcn/ui، ورموزًا أقل بنسبة 33% مقارنةً بـ HTML الخالصة، لأن وسمًا واحدًا يحلّ محل الترميز والتنسيق والحالة. كما قرأت تشغيلات 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>

تصفّح المكوّنات · اقرأ الدليل (بالإنجليزية)