Hugging Face's logo

Spaces:
llmonitor
/
benchmarks
Build error

App Files Community
1
benchmarks
File size: 2,836 Bytes 
4ffd659
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
 
import getDB from "@/utils/getDB"
import Head from "next/head"
import Link from "next/link"

export const getStaticPaths = async () => {
  const db = await getDB()

  const prompts = await db.all(`SELECT * FROM prompts`)

  return {
    paths: prompts.map((prompt) => ({
      params: { slug: prompt.slug },
    })),
    fallback: false,
  }
}

export const getStaticProps = async (props) => {
  const db = await getDB()

  const slug = props.params.slug

  const prompt = await db.get(`SELECT * FROM prompts WHERE slug = ?`, [slug])

  // get results with their model (join)
  const results = await db.all(
    `SELECT * FROM results INNER JOIN models ON results.model = models.id WHERE prompt = ? ORDER BY models.name ASC`,
    [prompt.id]
  )

  return { props: { prompt, results } }
}

export default function Prompt({ prompt, results }) {
  return (
    <>
      <Head>
        <title>LLM Benchmark</title>
        <meta name="description" content={`Asking models: ${prompt.text}`} />
      </Head>
      <h3>Prompt asked:</h3>
      <br />
      <pre style={{ maxWidth: 800 }}>{prompt.text}</pre>
      <br />
      {prompt.note && <p>Note: {prompt.note}</p>}
      <br />
      <Link href="/">Back to home</Link>
      <br />
      <br />
      <table>
        <thead>
          <tr>
            <th>Model</th>
            <th>Answer</th>
            <th>Latency</th>
            <th>Chars / s</th>
          </tr>
        </thead>
        <tbody>
          {results.map((result, i) => (
            <tr key={i}>
              <td>
                <Link
                  href={`/model/${result.api_id
                    .split("/")
                    .pop()
                    .toLowerCase()}`}
                >
                  {result.name}
                </Link>
              </td>
              <td>
                <pre>{result.result.trim()}</pre>
              </td>
              <td>{result.duration}ms</td>
              <td>{result.rate}</td>
            </tr>
          ))}
        </tbody>
      </table>
      <br />
      <Link href="/">Back to home</Link>

      <br />
      <br />

      <table style={{ maxWidth: 600 }}>
        <th>
          <p>
            Edit: as this got popular, I added an email form to receive
            notifications for future benchmark results:
          </p>
          <iframe
            src="https://embeds.beehiiv.com/65bd6af1-2dea-417a-baf2-b65bc27e1610?slim=true"
            height="52"
            frameborder="0"
            scrolling="no"
            style={{
              width: 400,
              border: "none",
              transform: "scale(0.8)",
              transformOrigin: "left",
            }}
          ></iframe>
          <br />
          <small>(no spam, max 1 email per month)</small>
        </th>
      </table>
      <br />
    </>
  )
}