Nest shot scripts under Queue jobs, keep the studio from overflowing on phones, and lighten library thumbs and polling so the UI stays responsive.

Co-authored-by: Cursor <cursoragent@cursor.com>

server/api/library/clips/[id]/last-frame.get.ts

@@ -1,4 +1,5 @@
-import { existsSync, readFileSync } from 'node:fs'
+import { existsSync, createReadStream } from 'node:fs'
+import { clipLastFramePath, clipVideoPath, fileEtag, sniffImageType } from '~/server/utils/library'
 
 export default defineEventHandler(async (event) => {
   const { owner } = assertLibraryOwner(event)
@@ -18,8 +19,13 @@ export default defineEventHandler(async (event) => {
       throw createError({ statusCode: 500, statusMessage: `Could not extract the last frame: ${message}` })
     }
   }
-  const buf = readFileSync(framePath)
-  setHeader(event, 'Content-Type', 'image/png')
-  setHeader(event, 'Cache-Control', 'private, no-store')
-  return buf
+  const etag = fileEtag(framePath)
+  setHeader(event, 'ETag', etag)
+  setHeader(event, 'Cache-Control', 'private, max-age=86400, stale-while-revalidate=604800')
+  if (getHeader(event, 'if-none-match') === etag) {
+    setResponseStatus(event, 304)
+    return null
+  }
+  setHeader(event, 'Content-Type', sniffImageType(framePath))
+  return sendStream(event, createReadStream(framePath))
 })

server/api/library/clips/[id]/thumb.get.ts

@@ -1,4 +1,5 @@
-import { existsSync, readFileSync } from 'node:fs'
+import { existsSync, createReadStream } from 'node:fs'
+import { clipThumbPath, fileEtag, sniffImageType } from '~/server/utils/library'
 
 export default defineEventHandler((event) => {
   const { owner } = assertLibraryOwner(event)
@@ -9,8 +10,13 @@ export default defineEventHandler((event) => {
   if (!existsSync(path)) {
     throw createError({ statusCode: 404, statusMessage: 'Thumbnail not found' })
   }
-  const buf = readFileSync(path)
-  setHeader(event, 'Content-Type', imageContentType(buf))
-  setHeader(event, 'Cache-Control', 'private, max-age=3600')
-  return buf
+  const etag = fileEtag(path)
+  setHeader(event, 'ETag', etag)
+  setHeader(event, 'Cache-Control', 'private, max-age=86400, stale-while-revalidate=604800')
+  if (getHeader(event, 'if-none-match') === etag) {
+    setResponseStatus(event, 304)
+    return null
+  }
+  setHeader(event, 'Content-Type', sniffImageType(path))
+  return sendStream(event, createReadStream(path))
 })