lukeed/clsxPublic

A tiny (239B) utility for constructing `className` strings conditionally.

Performance check: Current code might be 6% or so slower that can be

WE

webJose opened ยท

Definitely a low priority. See [this benchmark](https://jsperf.app/votezu).

It compares 3 possible code snippets to prepare the final CSS classes string. On the majority of cases, the way clsx currently does it is 6% slower in Chromium browsers. I don't have other browsers installed, so I have no idea if this is consistent across the board.

<img width="1465" height="734" alt="Image" src="https://github.com/user-attachments/assets/3c210f6a-a7f0-4f6f-84d1-34add729d86c" />

If people have the time and willingness, kindly run the benchmark and report.

The eventual request would be to alter the code to use the fastest code sample.

  1. IN

    <img width="960" height="476" alt="Image" src="https://github.com/user-attachments/assets/c3605744-d93c-4935-bf77-205492dc0eea" />

    <img width="957" height="472" alt="Image" src="https://github.com/user-attachments/assets/b08e838d-b79c-4861-9375-1f9fea5df6c0" />

  2. DM

    <img width="979" height="648" alt="Image" src="https://github.com/user-attachments/assets/0e99b312-bd2e-449c-b8b6-015b1a353198" />

    <img width="988" height="648" alt="Image" src="https://github.com/user-attachments/assets/89da37b5-11f6-44ed-9a69-b25f879c649a" />

    <img width="1002" height="645" alt="Image" src="https://github.com/user-attachments/assets/5d212a0e-9f6e-4060-b3d6-0710e2cbea82" />

    **The following results are somewhat random**

    <img width="1838" height="1208" alt="Image" src="https://github.com/user-attachments/assets/85adc108-c93a-4229-b177-42d8affd3126" />

    <img width="1874" height="1218" alt="Image" src="https://github.com/user-attachments/assets/51eb80e3-7490-4a23-a3c0-133e8e7c9fa4" />