Skip to content

Commit

Permalink
- add the class Ansis to create more independent instances to increas…
Browse files Browse the repository at this point in the history
…e the performance by benchmark

- improve performance
- code refactoring
- update readme
  • Loading branch information
webdiscus committed Dec 27, 2021
1 parent 3d11267 commit a7e6963
Show file tree
Hide file tree
Showing 10 changed files with 270 additions and 197 deletions.
6 changes: 6 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,11 @@
# Change log

## 1.1.1 (2021-12-27)
- add the class Ansis to create more independent instances to increase the performance by benchmark
- improve performance
- code refactoring
- update readme

## 1.1.0 (2021-12-25)
- add supports the use of `open` and `close` properties for each style
- fix codes for methods ansi256() and bgAnsi256()
Expand Down
100 changes: 50 additions & 50 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ Output:
const theme = {
error: ansis.red.bold,
info: ansis.cyan.italic,
warning: ansis.bgYellowBright,
warning: ansis.black.bgYellowBright,
ruby: ansis.hex('#E0115F'),
bgAmber: ansis.bgHex('#FFBF00'),
};
Expand Down Expand Up @@ -194,50 +194,50 @@ c.red(`${c.bold(`${c.cyan(`${c.yellow('yellow')}cyan`)}`)}red`);
```
```diff
colors-js 1,119,016 ops/sec
colorette 4,537,603 ops/sec
picocolors 3,818,885 ops/sec
cli-color 470,921 ops/sec
color-cli 109,666 ops/sec
ansi-colors 1,267,504 ops/sec
kleur/colors 2,265,820 ops/sec
kleur 2,216,547 ops/sec
chalk 2,272,601 ops/sec
+ ansis 1,910,873 ops/sec
colors-js 1,152,114 ops/sec
colorette 4,548,418 ops/sec
picocolors 3,832,593 ops/sec
cli-color 471,929 ops/sec
color-cli 110,282 ops/sec
ansi-colors 1,272,164 ops/sec
kleur/colors 2,278,569 ops/sec
kleur 2,223,929 ops/sec
chalk 2,255,589 ops/sec
+ ansis 2,674,316 ops/sec
```
### Base styles
```js
styles.forEach((style) => c[style]('foo'));
```
```diff
colors-js 462,720 ops/sec
colorette 1,492,260 ops/sec
picocolors 5,736,444 ops/sec
cli-color 222,377 ops/sec
color-cli 73,354 ops/sec
ansi-colors 719,913 ops/sec
kleur/colors 1,446,799 ops/sec
kleur 3,822,845 ops/sec
chalk 3,151,919 ops/sec
+ ansis 4,248,414 ops/sec
colors-js 475,774 ops/sec
colorette 1,174,392 ops/sec
picocolors 5,724,714 ops/sec
cli-color 220,577 ops/sec
color-cli 73,535 ops/sec
ansi-colors 727,414 ops/sec
kleur/colors 1,275,337 ops/sec
kleur 3,843,212 ops/sec
chalk 3,144,045 ops/sec
+ ansis 4,360,629 ops/sec
```
### Chained styles
```js
colors.forEach((color) => c[color].bold.underline.italic('foo'));
```
```diff
colors-js 136,976 ops/sec
colors-js 138,219
colorette (not supported)
picocolors (not supported)
cli-color 142,024 ops/sec
color-cli 52,604 ops/sec
ansi-colors 159,209 ops/sec
cli-color 144,837
color-cli 52,732
ansi-colors 158,921
kleur/colors (not supported)
kleur 511,077 ops/sec
chalk 1,613,521 ops/sec
+ ansis 5,126,060 ops/sec
kleur 514,035
chalk 1,234,573
+ ansis 5,515,868
```
Expand All @@ -246,16 +246,16 @@ colors.forEach((color) => c[color].bold.underline.italic('foo'));
colors.forEach((color) => c[color](c.bold(c.underline(c.italic('foo')))));
```
```diff
colors-js 165,526 ops/sec
colorette 750,531 ops/sec
picocolors 940,217 ops/sec
cli-color 64,927 ops/sec
color-cli 13,764 ops/sec
ansi-colors 258,639 ops/sec
kleur/colors 566,145 ops/sec
kleur 645,191 ops/sec
chalk 493,049 ops/sec
+ ansis 354,148 ops/sec
colors-js 165,202 ops/sec
colorette 712,604 ops/sec
picocolors 939,536 ops/sec
cli-color 64,758 ops/sec
color-cli 13,833 ops/sec
ansi-colors 258,930 ops/sec
kleur/colors 563,266 ops/sec
kleur 646,985 ops/sec
chalk 385,590 ops/sec
+ ansis 554,813 ops/sec
```
Expand All @@ -264,16 +264,16 @@ colors.forEach((color) => c[color](c.bold(c.underline(c.italic('foo')))));
c.red(`a red ${c.white('white')} red ${c.red('red')} red ${c.cyan('cyan')} red ${c.black('black')} red ${c.red('red')} red ${c.green('green')} red ${c.red('red')} red ${c.yellow('yellow')} red ${c.blue('blue')} red ${c.red('red')} red ${c.magenta('magenta')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.green('green')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.magenta('magenta')} red ${c.red('red')} red ${c.red('red')} red ${c.cyan('cyan')} red ${c.red('red')} red ${c.red('red')} red ${c.yellow('yellow')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} red ${c.red('red')} message`);
```
```diff
colors-js 91,036 ops/sec
colorette 247,359 ops/sec
picocolors 246,168 ops/sec
cli-color 42,756 ops/sec
color-cli 14,343 ops/sec
ansi-colors 122,972 ops/sec
kleur/colors 241,366 ops/sec
kleur 228,477 ops/sec
chalk 195,446 ops/sec
+ ansis 210,382 ops/sec
colors-js 89,529 ops/sec
colorette 243,237 ops/sec
picocolors 242,528 ops/sec
cli-color 41,897 ops/sec
color-cli 14,245 ops/sec
ansi-colors 120,991 ops/sec
kleur/colors 233,875 ops/sec
kleur 220,233 ops/sec
chalk 157,450 ops/sec
+ ansis 205,393 ops/sec
```
Expand All @@ -291,8 +291,8 @@ c.hex('#FBA')('foo');
ansi-colors (not supported)
kleur/colors (not supported)
kleur (not supported)
chalk 2,935,616 ops/sec
+ ansis 4,612,085 ops/sec
chalk 2,746,362 ops/sec
+ ansis 4,584,357 ops/sec
```
## Testing
Expand Down
68 changes: 41 additions & 27 deletions bench/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@ import Bench from './lib/bench.js';
import { createFixture } from './lib/utils.js';

// vendor libraries for benchmark
import ansis from '../src/index.js';
import chalk from 'chalk';
import ansis2, { Ansis } from '../src/index.js';
import colorsJs from 'colors';
import * as colorette from 'colorette';
import ansiColors from 'ansi-colors';
Expand All @@ -40,6 +40,9 @@ import kleur from 'kleur';
import * as kleurColors from 'kleur/colors';
import picocolors from 'picocolors';

// create new instance of Ansis for correct measure in benchmark
const ansis = new Ansis();

// All vendor libraries to be tested
const vendors = [
{ name: 'colors-js', lib: colorsJs },
Expand All @@ -54,14 +57,15 @@ const vendors = [
{ name: 'ansis', lib: ansis },
];

const benchStyle = new Ansis();
const bench = new Bench({
minOpsWidth: 12,
suiteNameColor: ansis.bgYellow.black,
benchNameColor: ansis.magenta,
opsColor: ansis.greenBright,
rmeColor: ansis.cyan,
statUnitColor: ansis.dim,
failColor: ansis.red.bold,
suiteNameColor: benchStyle.bgYellow.black,
benchNameColor: benchStyle.magenta,
opsColor: benchStyle.greenBright,
rmeColor: benchStyle.cyan,
statUnitColor: benchStyle.dim,
failColor: benchStyle.red.bold,
});

// styles present in all libraries
Expand All @@ -82,14 +86,22 @@ const colorStyles = ['black', 'red', 'green', 'yellow', 'blue', 'magenta', 'cyan

let fixture = [];

// reserved
// bench('Single style')
// .add('ansis', () => baseStyles.forEach((style) => ansis[style]('foo')))
// .add('colorette', () => colorette.red('colorette'))
// .add('picocolors', () => picocolors.red('picocolors'))
// .add('chalk', () => chalk.red('chalk'))
// .add('ansis', () => ansis.red('foo'))
// .run();
function outputNested(name, lib) {
const rgb = lib.hex('#80109f');

const str = lib.red(
`begin ${rgb.bold('RGB')} ${lib.yellow('yellow')} red ${lib.italic.cyan('italic cyan')} red ${lib.red(
'red'
)} red ${lib.underline.green.italic(
`underline italic green ${lib.hex('#e5850a')('underline italic blue')} underline italic green`
)} red ${lib.cyan('cyan')} red ${lib.bold.yellow('bold yellow')} red ${lib.green('green')} end`
);

console.log(` ${name}`, str);
}

outputNested('chalk\t', chalk);
outputNested('ansis\t', ansis);

// Colorette bench
// https://github.com/jorgebucaran/colorette/blob/main/bench/index.js
Expand All @@ -105,6 +117,8 @@ bench('Colorette bench')
.add(vendors[7].name, () => fixture[7](vendors[7].lib))
.add(vendors[8].name, () => fixture[8](vendors[8].lib))
.add(vendors[9].name, () => fixture[9](vendors[9].lib))
//.add('chalk', () => chalk.red(`${chalk.bold(`${chalk.cyan(`${chalk.yellow('yellow')}cyan`)}`)}red`))
//.add('ansis', () => ansis.red(`${ansis.bold(`${ansis.cyan(`${ansis.yellow('yellow')}cyan`)}`)}red`))
.run();

// Base styles
Expand Down Expand Up @@ -185,18 +199,18 @@ bench('Nested styles')
.run();

// reserved
// bench('Break style')
// .add('colors-js', () => colorsJs.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('colorette', () => colorette.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('picocolors', () => picocolors.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('cli-color', () => cliColor.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('color-cli', () => colorCli.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('ansi-colors', () => ansiColors.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('kleur/colors', () => kleurColors.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('kleur', () => ansis.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('chalk', () => kleur.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .add('ansis', () => ansis.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
// .run();
bench('Break style')
.add('colors-js', () => colorsJs.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('colorette', () => colorette.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('picocolors', () => picocolors.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('cli-color', () => cliColor.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('color-cli', () => colorCli.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('ansi-colors', () => ansiColors.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('kleur/colors', () => kleurColors.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('kleur', () => ansis.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('chalk', () => kleur.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.add('ansis', () => ansis.green(`\nAnsis\nNEW LINE\nNEXT NEW LINE\n`))
.run();

// HEX colors
// the hex(), rgb(), bgHex(), bgRgb() methods support only chalk and ansis
Expand Down
16 changes: 9 additions & 7 deletions bench/lib/bench.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import Benchmark from 'benchmark';
import ansis from '../../src/index.js';
import { Ansis } from '../../src/index.js';

const benchStyle = new Ansis();

/**
*
Expand All @@ -18,12 +20,12 @@ import ansis from '../../src/index.js';
const defaultOptions = {
minNameWidth: 15,
minOpsWidth: 15,
suiteNameColor: ansis.yellow.underline,
benchNameColor: ansis.visible,
opsColor: ansis.cyanBright,
rmeColor: ansis.visible,
statUnitColor: ansis.visible,
failColor: ansis.red.bold,
suiteNameColor: benchStyle.yellow.underline,
benchNameColor: benchStyle.visible,
opsColor: benchStyle.cyanBright,
rmeColor: benchStyle.visible,
statUnitColor: benchStyle.visible,
failColor: benchStyle.red.bold,
};
let errors = {};

Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "ansis",
"version": "1.1.0",
"version": "1.1.1",
"description": "Color styling of text for ANSI terminals using the SGR codes defined in the ECMA-48 standard.",
"keywords": [
"ansi",
Expand Down
61 changes: 59 additions & 2 deletions src/ansi-codes.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
const codes = {
const esc = ([open, close]) => ({ open: `\x1b[${open}m`, close: `\x1b[${close}m` });

export const codes = {
// commands
reset: [0, 0],
inverse: [7, 27],
Expand Down Expand Up @@ -55,4 +57,59 @@ const codes = {
bgWhiteBright: [107, 49],
};

export default codes;
export const ansiCodes = {
// commands
reset: esc([0, 0]),
inverse: esc([7, 27]),
hidden: esc([8, 28]),

// styles
bold: esc([1, 22]),
dim: esc([2, 22]), // alias for faint
faint: esc([2, 22]),
italic: esc([3, 23]),
underline: esc([4, 24]),
doubleUnderline: esc([21, 24]),
strikethrough: esc([9, 29]),
strike: esc([9, 29]), // alias for strikethrough
frame: esc([51, 54]),
encircle: esc([52, 54]),
overline: esc([53, 55]),

// foreground colors
black: esc([30, 39]),
red: esc([31, 39]),
green: esc([32, 39]),
yellow: esc([33, 39]),
blue: esc([34, 39]),
magenta: esc([35, 39]),
cyan: esc([36, 39]),
white: esc([37, 39]),
gray: esc([90, 39]), // alias for blackBright
blackBright: esc([90, 39]),
redBright: esc([91, 39]),
greenBright: esc([92, 39]),
yellowBright: esc([93, 39]),
blueBright: esc([94, 39]),
magentaBright: esc([95, 39]),
cyanBright: esc([96, 39]),
whiteBright: esc([97, 39]),

// background colors
bgBlack: esc([40, 49]),
bgRed: esc([41, 49]),
bgGreen: esc([42, 49]),
bgYellow: esc([43, 49]),
bgBlue: esc([44, 49]),
bgMagenta: esc([45, 49]),
bgCyan: esc([46, 49]),
bgWhite: esc([47, 49]),
bgBlackBright: esc([100, 49]),
bgRedBright: esc([101, 49]),
bgGreenBright: esc([102, 49]),
bgYellowBright: esc([103, 49]),
bgBlueBright: esc([104, 49]),
bgMagentaBright: esc([105, 49]),
bgCyanBright: esc([106, 49]),
bgWhiteBright: esc([107, 49]),
};
2 changes: 2 additions & 0 deletions src/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -254,3 +254,5 @@ export interface AnsisInstance extends StyleFunction, StyleProperties {
declare const ansis: AnsisInstance;

export default ansis;

export const Ansis: new (str: string) => AnsisInstance;
Loading

0 comments on commit a7e6963

Please sign in to comment.