High CPU usage when trying to animate a line

[HarelM]

mapbox-gl-js version: 0.53.1

browser: Chrome

Steps to Trigger Behavior

1. See the code below - animate a line using setPaintProperty in an interval function.

Link to Demonstration

The following code is used to animate the direction of a line:
https://stackoverflow.com/questions/43057469/dashed-line-animations-in-mapbox-gl-js
This is related somewhat to this issue I've opened in the past: #8140
It might also be related to #8243, and I've reported it also at: #7235
An example of a running code can be found here:
https://jsfiddle.net/2mws8y3q/

When the above tab is open in chrome the CPU starts working and never stops which causes severe performance issues on the site. It's not noticeable on strong machines but is when using old PCs or weak mobile devices.
More info can be found here:
IsraelHikingMap/Site#1012
I basically would like to show the user the direction of a route, but without the animation it's hard as direction arrow heads have their drawback, which is described here:
IsraelHikingMap/Site#1030

Let me know how I can help.
Keep up the good work!

Expected Behavior

Animation should not use that much CPU that will cause the site to be sluggish.

Actual Behavior

Animation uses a lot of CPU and causes the site to be sluggish.

[exside]

Was wondering why the obviously awesome work of mapbox-animation was never adapted into the core library, I'm way not deep enough into WebGL to understand what he did, but I think he somehow uses shaders? Wouldn't it be a great feature if we could simply tell a source to .animate(<delay in ms>) and update the data and all would animate smoothly? I'm fighting extreme CPU loads by just animating a simple line with two points around a circle, think of it like a radar scanner...but the CPU load goes over 100% immediately, which is not really a realistic solution...