Skip to content

Instantly share code, notes, and snippets.

@pasaran
Created March 19, 2018 11:35
Show Gist options
  • Save pasaran/8e68e0cdcb8c8ba3141d7083854fa6a1 to your computer and use it in GitHub Desktop.
Save pasaran/8e68e0cdcb8c8ba3141d7083854fa6a1 to your computer and use it in GitHub Desktop.
const classnames = require('classnames');
const props = {
checked: true,
color: 'red',
disabled: true,
focused: false,
hovered: true,
size: 'xl',
type: null,
width: null,
className: 'MyRadio',
};
const N = 10000;
let r;
console.time('a');
for (let i = 0; i < N; i++) {
const { checked, color, disabled, focused, hovered, size, type, width, className } = props;
r = classnames(
'Radio',
{
Radio_checked: checked,
[`Radio_color_${ color }`]: color,
Radio_disabled: disabled,
Radio_focused: focused,
Radio_hovered: hovered,
[`Radio_size_${ size }`]: size,
[`Radio_type_${ type }`]: type,
[`Radio_width_${ width }`]: width,
},
className
);
}
console.timeEnd('a');
console.log(r);
console.time('b');
for (let i = 0; i < N; i++) {
let r = 'Radio';
if (props.checked) {
r += ' Radio_checked';
}
if (props.color) {
r += ' Radio_color_' + props.color;
}
if (props.disabled) {
r += ' Radio_disabled';
}
if (props.focused) {
r += ' Radio_focused';
}
if (props.hovered) {
r += ' Radio_hovered';
}
if (props.size) {
r += ' Radio_size_' + props.size;
}
if (props.type) {
r += ' Radio_type_' + props.type;
}
if (props.width) {
r += ' Radio_width_' + props.width;
}
if (props.className) {
r += ' ' + props.className;
}
}
console.timeEnd('b');
console.log(r);
@pasaran
Copy link
Author

pasaran commented Mar 19, 2018

node test.js
a: 60.297ms
Radio Radio_checked Radio_color_red Radio_disabled Radio_hovered Radio_size_xl MyRadio
b: 4.178ms
Radio Radio_checked Radio_color_red Radio_disabled Radio_hovered Radio_size_xl MyRadio

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment