缩写文字
计算符合边框的最大文本字体大小,而不使用网页浏览器。 到处都行 佐织 does,例如Node.js,网页浏览器,Vercel边缘运行时间等.
安装
# Using NPM
npm install @altano/satori-fit-text
# Using Yarn
yarn add @altano/satori-fit-text
# Using PNPM
pnpm add @altano/satori-fit-text
基本示例
import { findLargestUsableFontSize, type Font } from "@altano/satori-fit-text";
async function getInter(): Promise<Font> {
const interSemiBoldBuffer = await fetch(
`https://cdn.jsdelivr.net/npm/@fontsource/[email protected]/files/inter-latin-600-normal.woff`,
).then((res) => res.arrayBuffer());
return {
name: "Inter",
data: interSemiBoldBuffer,
weight: 600,
};
}
const largestUsableFontSize = await findLargestUsableFontSize({
lineHeight: 1,
font: await getInter(),
text: "Some text I want to be as big as possible",
maxWidth: 1136,
maxHeight: 429,
});
console.log(largestUsableFontSize);
示例用途
密码沙盒
代码
执行情况
库会尝试各种字体大小,直到找到最理想的可行字体. 每个迭代都通过生成带有佐藤里的SVG并计算出SVG的边框来测试.
业绩
字体大小搜索是在 1 到 1000 之间的二进制搜索 O(log maxFontSize-minFontSize) 运行时间,或默认 O(log 1000)。可以通过缩小搜索空间之间的差值来提高性能 minFontSize 财务报告和审定财务报表 maxFontSize,减少了猜测的数量.
如果你在做类似制作Open Graph卡片的事 那你可能就不用担心表现了.