Tu jest opisana wydajność css-a "ustawianego" z poziomu kodu (rendering), czy css-a "ustawionego" z poziomu js-a CSS and JavaScript animation performance, pod koniec tego artykułu, mamy takie ...
Summary
Browsers are able to optimize rendering flows. In summary, we should always try to create our animations using CSS transitions/animations where possible. If your animations are really complex, you may have to rely on JavaScript-based animations instead.
... , ale nie potrzeba popadać w "paranoje", jeżeli jest taka potrzeba i nie ma tego "dużo" (css-a ustawianego z poziomu kodu js-a) można śmiało używać js-a (bez wyraźnego spadku wydajności), ale zawsze trzeba najpierw spróbować, czy nie da się tego zaimplementować w "czystym" css-ie. 
. Dobrym trikiem jest tu napsanie class w css-ie, a z poziomu kodu js-a używanie: element.classList
| Property |
Description |
| length |
Returns the number of classes in the list.
This property is read-only |
Methods
| Method |
Description |
| add(class1, class2, ...) |
Adds one or more class names to an element.
If the specified class already exist, the class will not be added |
| contains(class) |
Returns a Boolean value, indicating whether an element has the specified class name.
Possible values:
- true - the element contains the specified class name
- false - the element does not contain the specified class name
|
| item(index) |
Returns the class name with a specified index number from an element. Index starts at 0.
Returns null if the index is out of range |
| remove(class1, class2, ...) |
Removes one or more class names from an element.
Note: Removing a class that does not exist, does NOT throw an error |
| toggle(class, true|false) |
Toggles between a class name for an element.
The first parameter removes the specified class from an element, and returns false.
If the class does not exist, it is added to the element, and the return value is true.
The optional second parameter is a Boolean value that forces the class to be added or removed, regardless of whether or not it already existed. For example:
Remove a class: element.classList.toggle("classToRemove", false);
Add a class: element.classList.toggle("classToAdd", true);
Note: The second parameter is not supported in Internet Explorer or Opera 12 and earlier. |
