GitHub/quartz
1
0
Fork 2
mirror of https://github.com/jackyzha0/quartz.git synced 2025-12-31 00:34:05 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

perf: memoize fonts

Browse Source
This commit is contained in:
Ben Schlegel 2023-09-22 17:00:17 +02:00
parent 346dbfe3e3
commit 91a0c3e0b4
No known key found for this signature in database
GPG Key ID: 8BDB8891C1575E22
1 changed files with 8 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
quartz/components/Head.tsx
View File

@ -1,7 +1,7 @@
import { FullSlug, _stripSlashes, joinSegments, pathToRoot } from "../util/path" import { FullSlug, _stripSlashes, joinSegments, pathToRoot } from "../util/path"
import { JSResourceToScriptElement } from "../util/resources" import { JSResourceToScriptElement } from "../util/resources"
import { QuartzComponentConstructor, QuartzComponentProps } from "./types" import { QuartzComponentConstructor, QuartzComponentProps } from "./types"
import satori from "satori" import satori, { SatoriOptions } from "satori"
import * as fs from "fs" import * as fs from "fs"
import { getSatoriFont } from "../util/fonts" import { getSatoriFont } from "../util/fonts"
import { GlobalConfiguration } from "../cfg" import { GlobalConfiguration } from "../cfg"
@ -20,12 +20,12 @@ async function generateSocialImage(
title: string, title: string,
description: string, description: string,
fileName: string, fileName: string,
headerFontName: string, fontsPromise: Promise<SatoriOptions["fonts"]>,
bodyFontName: string,
cfg: GlobalConfiguration, cfg: GlobalConfiguration,
colorScheme: "lightMode" | "darkMode", colorScheme: "lightMode" | "darkMode",
) { ) {
const fonts = await getSatoriFont(headerFontName, bodyFontName) const fonts = await fontsPromise
// How many characters are allowed before switching to smaller font // How many characters are allowed before switching to smaller font
const fontBreakPoint = 22 const fontBreakPoint = 22
const useSmallerFont = title.length > fontBreakPoint const useSmallerFont = title.length > fontBreakPoint
@ -109,25 +109,17 @@ const extension = "webp"
const imageDir = "public/static/social-images" const imageDir = "public/static/social-images"
export default (() => { export default (() => {
let font: Promise<ArrayBuffer | undefined> let fontsPromise: Promise<SatoriOptions["fonts"]>
function Head({ cfg, fileData, externalResources }: QuartzComponentProps) { function Head({ cfg, fileData, externalResources }: QuartzComponentProps) {
if (!font) { if (!fontsPromise) {
// font = getSatoriFont(cfg.theme.typography.header) fontsPromise = getSatoriFont(cfg.theme.typography.header, cfg.theme.typography.body)
} }
const slug = fileData.filePath const slug = fileData.filePath
const filePath = slug?.replaceAll("/", "-") const filePath = slug?.replaceAll("/", "-")
const title = fileData.frontmatter?.title ?? "Untitled" const title = fileData.frontmatter?.title ?? "Untitled"
const description = fileData.description?.trim() ?? "No description provided" const description = fileData.description?.trim() ?? "No description provided"
generateSocialImage( generateSocialImage(title, description, filePath as string, fontsPromise, cfg, "lightMode")
title,
description,
filePath as string,
cfg.theme.typography.header,
cfg.theme.typography.body,
cfg,
"lightMode",
)
if (!fs.existsSync(imageDir)) { if (!fs.existsSync(imageDir)) {
fs.mkdirSync(imageDir, { recursive: true }) fs.mkdirSync(imageDir, { recursive: true })