Benchmark: alpinejs speed-up transitionIn & transitionOut

HTML Preparation code:

<div
    x-show="open"
    x-transition:enter="transition ease-out duration-300"
    x-transition:enter-start="opacity-0 transform scale-90"
    x-transition:enter-end="opacity-100 transform scale-100"
    x-transition:leave="transition ease-in duration-300"
    x-transition:leave-start="opacity-100 transform scale-100"
    x-transition:leave-end="opacity-0 transform scale-90"
>...</div>

Script Preparation code:

/* Directive `transition` gonna endup kinda like this: */
var attrs = [
  {value: 'enter'}, {value: 'enter-start'}, {value: 'enter-end'},
  {value: 'leave'}, {value: 'leave-start'}, {value: 'leave-end'},
]

Tests:

filter
attrs.filter(attr => ['enter', 'enter-start', 'enter-end'].includes(attr.value)).length > 0
some
attrs.some(attr => ['enter', 'enter-start', 'enter-end'].includes(attr.value))

Historical Performance Data aggregated from 8 community runs

Desktop Results:

Chrome 8 runs

some

53.7M/s

filter

15.8M/s

Fastest: some (3.4x faster)

View exact numbers

✓ some: 53,670,288 ops/sec
• filter: 15,779,915 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
filter
some

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:138.0) Gecko/20100101 Firefox/138.0

Browser/OS: Firefox 138 on Ubuntu

View result in a separate tab

some

15.8M/s

filter

2.2M/s

View exact numbers

Test name	Executions per second
✓ some	15,814,764 Ops/sec
filter	2,199,052 Ops/sec

alpinejs speed-up transitionIn & transitionOut (version: 1) Benchmark.js

Comparing performance of: `filter vs some`

Created: 6 years ago by: Registered User

Go to the latest result

filter

some

Historical Performance Data aggregated from 8 community runs

Desktop Results:

Chrome 8 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

alpinejs speed-up transitionIn & transitionOut (version: 1) Benchmark.js

Comparing performance of: filter vs some

Created: 6 years ago by: Registered User

Go to the latest result

filter

some

Historical Performance Data aggregated from 8 community runs

Desktop Results:

Chrome 8 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Related benchmarks

Comparing performance of: `filter vs some`