Skip to content

Commit

Permalink
perf: switch from chalk to colorette
Browse files Browse the repository at this point in the history
saves ~10KB in bundle size
  • Loading branch information
pi0 committed Mar 28, 2023
1 parent cfaba5e commit 271b4db
Show file tree
Hide file tree
Showing 4 changed files with 24 additions and 47 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -48,8 +48,8 @@
"devDependencies": {
"@types/node": "^18.15.10",
"@vitest/coverage-c8": "^0.29.8",
"chalk": "^5.2.0",
"changelogen": "^0.5.2",
"colorette": "^2.0.19",
"dayjs": "^1.11.7",
"eslint": "^8.36.0",
"eslint-config-unjs": "^0.1.0",
Expand Down
6 changes: 3 additions & 3 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

31 changes: 20 additions & 11 deletions src/reporters/fancy.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,7 @@
import stringWidth from "string-width";
import { mainSymbols } from "figures";
import chalk from "chalk";
import * as colors from "colorette";
import { parseStack } from "../utils/error";
import { chalkColor, chalkBgColor } from "../utils/chalk";
import { TYPE_COLOR_MAP, LEVEL_COLOR_MAP } from "../utils/fancy";
import BasicReporter from "./basic";

Expand All @@ -29,18 +28,15 @@ export default class FancyReporter extends BasicReporter {
}

formatStack(stack) {
const grey = chalkColor("grey");
const cyan = chalkColor("cyan");

return (
"\n" +
parseStack(stack)
.map(
(line) =>
" " +
line
.replace(/^at +/, (m) => grey(m))
.replace(/\((.+)\)/, (_, m) => `(${cyan(m)})`)
.replace(/^at +/, (m) => colors.gray(m))
.replace(/\((.+)\)/, (_, m) => `(${colors.cyan(m)})`)
)
.join("\n")
);
Expand All @@ -53,14 +49,16 @@ export default class FancyReporter extends BasicReporter {
this.options.secondaryColor;

if (isBadge) {
return chalkBgColor(typeColor).black(` ${logObj.type.toUpperCase()} `);
return getBgColor(typeColor)(
colors.black(` ${logObj.type.toUpperCase()} `)
);
}

const _type =
typeof TYPE_ICONS[logObj.type] === "string"
? TYPE_ICONS[logObj.type]
: logObj.icon || logObj.type;
return _type ? chalkColor(typeColor)(_type) : "";
return _type ? getColor(typeColor)(_type) : "";
}

formatLogObj(logObj, { width }) {
Expand All @@ -71,7 +69,7 @@ export default class FancyReporter extends BasicReporter {
? Boolean(logObj.badge)
: logObj.level < 2;

const secondaryColor = chalkColor(this.options.secondaryColor);
const secondaryColor = getColor(this.options.secondaryColor);

const date = this.formatDate(logObj.date);
const coloredDate = date && secondaryColor(date);
Expand All @@ -81,7 +79,7 @@ export default class FancyReporter extends BasicReporter {
const tag = logObj.tag ? secondaryColor(logObj.tag) : "";

const formattedMessage = message.replace(/`([^`]+)`/g, (_, m) =>
chalk.cyan(m)
colors.cyan(m)
);

let line;
Expand All @@ -96,3 +94,14 @@ export default class FancyReporter extends BasicReporter {
return isBadge ? "\n" + line + "\n" : line;
}
}

function getColor(color: string) {
return (colors as any)[color] || colors.white;
}

function getBgColor(color: string) {
return (
(colors as any)[`bg${color[0].toUpperCase()}${color.slice(1)}`] ||
colors.bgWhite
);
}
32 changes: 0 additions & 32 deletions src/utils/chalk.ts

This file was deleted.

0 comments on commit 271b4db

Please sign in to comment.