chore: prepare better playground

Author: Julien-R44

package.json

@@ -37,6 +37,7 @@
     "testcontainers": "^10.17.2",
     "ts-node": "^10.9.2",
     "tsup": "^8.3.6",
+    "tsx": "^4.19.2",
     "typescript": "~5.7.3"
   },
   "prettier": "@julr/tooling-configs/prettier"

playground/package.json

@@ -1,19 +1,13 @@
 {
   "name": "@bentocache/playground",
   "type": "module",
-  "private": true,
   "scripts": {
-    "start": "cross-env NODE_NO_WARNINGS=1 node --loader ts-node/esm src/index.ts",
-    "start-server": "cross-env NODE_NO_WARNINGS=1 node --loader ts-node/esm src/server.ts"
+    "dev": "tsx watch src/index.tsx"
   },
   "dependencies": {
-    "@aws-sdk/client-dynamodb": "^3.741.0",
-    "@bentocache/plugin-prometheus": "workspace:*",
+    "@hono/node-server": "^1.13.8",
     "bentocache": "workspace:*",
+    "hono": "^4.6.20",
     "pino": "^9.6.0"
-  },
-  "devDependencies": {
-    "cross-env": "7.0.3",
-    "prom-client": "^15.1.3"
   }
 }

playground/src/cache.ts

@@ -0,0 +1,24 @@
+import { pino } from 'pino'
+import { BentoCache, bentostore } from 'bentocache'
+import { redisDriver } from 'bentocache/drivers/redis'
+import { memoryDriver } from 'bentocache/drivers/memory'
+
+export const bento = new BentoCache({
+  default: 'memoryAndRedis',
+  logger: pino({
+    level: 'debug',
+    transport: {
+      target: 'pino-pretty',
+      options: { colorize: true },
+    },
+  }),
+  stores: {
+    memory: bentostore().useL1Layer(memoryDriver({})),
+
+    redis: bentostore().useL2Layer(redisDriver({ connection: { host: 'localhost', port: 6379 } })),
+
+    memoryAndRedis: bentostore()
+      .useL1Layer(memoryDriver({}))
+      .useL2Layer(redisDriver({ connection: { host: 'localhost', port: 6379 } })),
+  },
+})

playground/src/index.ts

@@ -0,0 +1,53 @@
+import { Hono } from 'hono'
+import { logger } from 'hono/logger'
+import { serve } from '@hono/node-server'
+import { setTimeout } from 'node:timers/promises'
+
+import { bento } from './cache.js'
+
+const app = new Hono().use(logger())
+
+const slowFetcher = async (url: string, timeout: number = 1000) => {
+  await setTimeout(timeout)
+  return fetch(url).then((response) => response.json())
+}
+
+app.get('/cache-user/:id', async (c) => {
+  const id = c.req.param('id')
+  const user = await slowFetcher(`https://jsonplaceholder.typicode.com/users/${id}`)
+
+  await bento.set({
+    ttl: '10s',
+    key: `user-${id}`,
+    value: user,
+  })
+
+  return c.html(
+    <div>
+      <h1>User {id}</h1>
+      <p>Cached for 10 seconds</p>
+      <pre>{JSON.stringify(user, null, 2)}</pre>
+    </div>,
+  )
+})
+
+app.get('/cached-user/:id', async (c) => {
+  const id = c.req.param('id')
+  const user = await bento.get({ key: `user-${id}`, defaultValue: 'NOT CACHED' })
+
+  return c.html(
+    <div>
+      <h1>User {id}</h1>
+      <p>From cache</p>
+      <pre>{JSON.stringify(user, null, 2)}</pre>
+    </div>,
+  )
+})
+
+app.get('/', (c) => {
+  return c.text('Hello Hono!')
+})
+
+const port = 3042
+console.log(`Server is running on http://localhost:${port}`)
+serve({ fetch: app.fetch, port })

playground/src/index.tsx

@@ -1,7 +1,12 @@
 {
-  "extends": "@adonisjs/tsconfig/tsconfig.package.json",
   "compilerOptions": {
-    "rootDir": "./",
-    "outDir": "build"
+    "target": "ESNext",
+    "jsx": "react-jsx",
+    "jsxImportSource": "hono/jsx",
+    "module": "NodeNext",
+    "types": ["node"],
+    "strict": true,
+    "verbatimModuleSyntax": true,
+    "skipLibCheck": true
   }
 }