Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Run results for:
alpinejs speed-up transitionIn & transitionOut
Go to the benchmark
Embed
Embed Benchmark Result
Run details:
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Safari/537.36
Browser:
Chrome 128
Operating system:
Windows
Device Platform:
Desktop
Date tested:
one year ago
Test name
Executions per second
filter
7425129.5 Ops/sec
some
11974873.0 Ops/sec
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))