| Test name | Executions per second |
|---|---|
| classnames | 2705606.2 Ops/sec |
| clsx | 3971421.2 Ops/sec |
| custom implemenatation | 2093373.1 Ops/sec |
<script src='https://cdnjs.cloudflare.com/ajax/libs/classnames/2.3.2/index.min.js'></script><script src='https://unpkg.com/clsx@1.2.1/dist/clsx.min.js'></script>var str = 'style';var obj = { 'style-2': true, 'style-3': false, 'style-4': true,}var arr = ['style-5', 'style-6']function composeCssClass(values) { const classNameStack = [] for (let i=0; i<values.length; i+=1) { const value = values[i] switch (true) { case !value: { continue } case typeof value === "string": case typeof value === "number": { classNameStack.push(value) continue } case Array.isArray(value): { const valueFromArray = composeCssClass(value) if (typeof valueFromArray !== 'undefined') { classNameStack.push(valueFromArray) } continue } case typeof value === "object": { for (const key in value) { if (value[key]) { classNameStack.push(key) } } continue } } } return classNameStack.length > 0 ? classNameStack.join(" ") : undefined}let result = window.classNames(str, obj, arr, 'test classname')let result = window.clsx(str, obj, arr, 'test classname')let result = composeCssClass(str, obj, arr, 'test classname')
