Frage: Welches der drei methoden kommt der JS-Parser besser zurecht und frisst weniger resourcen und erzeugt glatte übergänge?
Du machst dir im Vorfeld zu viele Gedanken über Performance. In der Webentwicklung ist es nützlich eine Top-Down-Perspektive zu Effizienz einzunehmen, d.h. du schreibst deinen Code erst mal möglichst sauber und elegant runter. Erst anschließend prüfst du werkzeuggesetützt[1] ob und wo sich die Flaschenhälse in deinem Code befinden, dann kannst du gezielt und wirkungsvoll optimieren.
Ich mein bei CSS Deklaration Background muss JS- oder HTML-Parser ja diesen einen Pixel für die gaze anzeigefläche wiederholen und das n bruchteil einer sekunde.
Das darfst du der Rendering-Engine der Browser gewiss zutrauen.
Chrome hat bspw. sogenannte Profiler in den Entwicklertools enthalten. ↩︎