fix: use cache with ogimage

sunadoi · Nov 30, 2024 · 655bdf3 · 655bdf3
1 parent 0f4e203
commit 655bdf3
Show file tree

Hide file tree

Showing 52 changed files with 11 additions and 2 deletions.
diff --git a/app/public/ogimage/browser-rendering.png b/app/public/ogimage/browser-rendering.png
diff --git a/app/public/ogimage/cache-strategy-batch.png b/app/public/ogimage/cache-strategy-batch.png
diff --git a/app/public/ogimage/cloudflare-workers-cold-start.png b/app/public/ogimage/cloudflare-workers-cold-start.png
diff --git a/app/public/ogimage/errors-as.png b/app/public/ogimage/errors-as.png
diff --git a/app/public/ogimage/eslint-flat-config.png b/app/public/ogimage/eslint-flat-config.png
diff --git a/app/public/ogimage/eslint-settings.png b/app/public/ogimage/eslint-settings.png
diff --git a/app/public/ogimage/eslint-with-prettier.png b/app/public/ogimage/eslint-with-prettier.png
diff --git a/app/public/ogimage/firebase-multiple-hosting.png b/app/public/ogimage/firebase-multiple-hosting.png
diff --git a/app/public/ogimage/firebase-react-suspense.png b/app/public/ogimage/firebase-react-suspense.png
diff --git a/app/public/ogimage/form-multiple-submit-button.png b/app/public/ogimage/form-multiple-submit-button.png
diff --git a/app/public/ogimage/generate-ci.png b/app/public/ogimage/generate-ci.png
diff --git a/app/public/ogimage/git-rebase.png b/app/public/ogimage/git-rebase.png
diff --git a/app/public/ogimage/github-actions-firebase-preview.png b/app/public/ogimage/github-actions-firebase-preview.png
diff --git a/app/public/ogimage/github-merge.png b/app/public/ogimage/github-merge.png
diff --git a/app/public/ogimage/go-ch-batch.png b/app/public/ogimage/go-ch-batch.png
diff --git a/app/public/ogimage/go-fmt-stringer.png b/app/public/ogimage/go-fmt-stringer.png
diff --git a/app/public/ogimage/go-json-tag.png b/app/public/ogimage/go-json-tag.png
diff --git a/app/public/ogimage/go-sql-package.png b/app/public/ogimage/go-sql-package.png
diff --git a/app/public/ogimage/go-test-parallel-flaky.png b/app/public/ogimage/go-test-parallel-flaky.png
diff --git a/app/public/ogimage/go-text-template.png b/app/public/ogimage/go-text-template.png
diff --git a/app/public/ogimage/honox-blog.png b/app/public/ogimage/honox-blog.png
diff --git a/app/public/ogimage/js-date-tz.png b/app/public/ogimage/js-date-tz.png
diff --git a/app/public/ogimage/library-template-literal-types.png b/app/public/ogimage/library-template-literal-types.png
diff --git a/app/public/ogimage/next-link-legacybehavior.png b/app/public/ogimage/next-link-legacybehavior.png
diff --git a/app/public/ogimage/nextjs-standalone.png b/app/public/ogimage/nextjs-standalone.png
diff --git a/app/public/ogimage/node-duplex-stream.png b/app/public/ogimage/node-duplex-stream.png
diff --git a/app/public/ogimage/node-pdf-to-jpeg.png b/app/public/ogimage/node-pdf-to-jpeg.png
diff --git a/app/public/ogimage/npm-library-operation.png b/app/public/ogimage/npm-library-operation.png
diff --git a/app/public/ogimage/npm-library-settings.png b/app/public/ogimage/npm-library-settings.png
diff --git a/app/public/ogimage/object-difinition.png b/app/public/ogimage/object-difinition.png
diff --git a/app/public/ogimage/operation-log.png b/app/public/ogimage/operation-log.png
diff --git a/app/public/ogimage/parquet_performance.png b/app/public/ogimage/parquet_performance.png
diff --git a/app/public/ogimage/playwright-firebase-emulators.png b/app/public/ogimage/playwright-firebase-emulators.png
diff --git a/app/public/ogimage/react-v17-update.png b/app/public/ogimage/react-v17-update.png
diff --git a/app/public/ogimage/react18-strict-mode.png b/app/public/ogimage/react18-strict-mode.png
diff --git a/app/public/ogimage/renovate-settings.png b/app/public/ogimage/renovate-settings.png
diff --git a/app/public/ogimage/s3-delete-lifecycle.png b/app/public/ogimage/s3-delete-lifecycle.png
diff --git a/app/public/ogimage/svelte-diff.png b/app/public/ogimage/svelte-diff.png
diff --git a/app/public/ogimage/swr-render-as-you-fetch.png b/app/public/ogimage/swr-render-as-you-fetch.png
diff --git a/app/public/ogimage/trap-command.png b/app/public/ogimage/trap-command.png
diff --git a/app/public/ogimage/ts-exclude-key.png b/app/public/ogimage/ts-exclude-key.png
diff --git a/app/public/ogimage/ts-function-overload.png b/app/public/ogimage/ts-function-overload.png
diff --git a/app/public/ogimage/tuple-type-check.png b/app/public/ogimage/tuple-type-check.png
diff --git a/app/public/ogimage/type-predicate-firebase-error.png b/app/public/ogimage/type-predicate-firebase-error.png
diff --git a/app/public/ogimage/type-predicate.png b/app/public/ogimage/type-predicate.png
diff --git a/app/public/ogimage/unix-domain-socket.png b/app/public/ogimage/unix-domain-socket.png
diff --git a/app/public/ogimage/use-state-without-set-state.png b/app/public/ogimage/use-state-without-set-state.png
diff --git a/app/public/ogimage/virtual-dom.png b/app/public/ogimage/virtual-dom.png
diff --git a/app/public/ogimage/vitest-firebase-emulators.png b/app/public/ogimage/vitest-firebase-emulators.png
diff --git a/app/public/ogimage/vitest-spyon.png b/app/public/ogimage/vitest-spyon.png
diff --git a/app/public/ogimage/webpack-to-vite.png b/app/public/ogimage/webpack-to-vite.png
diff --git a/app/routes/ogimage/[slug].tsx b/app/routes/ogimage/[slug].tsx
@@ -1,4 +1,4 @@
-import { readFileSync } from "node:fs"
+import { readFileSync, writeFileSync, existsSync } from "node:fs"
 import { Resvg } from "@resvg/resvg-js"
 import { ssgParams } from "hono/ssg"
 import { createRoute } from "honox/factory"
@@ -7,7 +7,10 @@ import { getArticle, getArticles } from "../../functions/articles"
 
 export default createRoute(
   ssgParams(() =>
-    getArticles().articles.map((article) => ({ slug: article.slug })),
+    // OGP画像が作成されてない場合のみ作成する。更新する場合は作成済みのものを削除する必要あり
+    getArticles().articles
+      .filter(article => !existsSync(getOGPPath(article.slug)))
+      .map((article) => ({ slug: article.slug }))
   ),
   async (c) => {
     const slug = c.req.param("slug")
@@ -73,12 +76,18 @@ export default createRoute(
     )
 
     const body = new Resvg(svg).render().asPng()
+    const ogpPath = getOGPPath(slug)
+    writeFileSync(ogpPath, body)
 
     c.header("Content-Type", "image/png")
     return c.body(body)
   },
 )
 
+const getOGPPath = (slug: string) => {
+  return new URL(`../../public/ogimage/${slug}.png`, import.meta.url)
+}
+
 const loadGoogleFont = async ({
   family,
   weight,