Genau diesem Problem widmet sich Velocity.js – ein jQuery-Plug-in, das die Animations-Funktionalitäten reimplementiert und für eine deutlich bessere Performance sorgen soll.
Das gerade einmal sieben Kilobyte große Plug-in macht regen Gebrauch von jQuery $.queue() und funktioniert daher auch mit $.animate(), $.fade() und $.delay(), ohne dabei die bekannte Syntax zu verändern. Darüber hinaus bietet Velocity.js eine volle Abwärtskompatibilität bis hin zum Internet Explorer 8 und Android 3.2. Dabei ist die geheime Zutat so simpel wie genial:
JavaScript and jQuery are falsely conflated. JavaScript animation, which Velocity uses, is fast; it’s jQuery that’s slow. Although Velocity is a jQuery plugin, it uses its own animation stack that delivers its performance through two underlying design principles: 1) synchronize the DOM → tween stack to minimize layout thrashing, and 2) cache values to minimize the occurrence of DOM querying.
Demos und weitere Hintergrundinformationen findet man auf VelocityJS.org, das Projekt selbst liegt auf GitHub und soll ab dem 30. April 2014 als Full Release zur Verfügung stehen.
Aufmacherbild: funny finish of racing snails von Shutterstock / Urheberrecht: pixinoo