[Perf] Animation: Allow to start immediately

src/util/animation.ts

@@ -16,19 +16,19 @@ export function animateSingle(tick: Function, instance?: AnimationInstance) {
     currentInstance = instance;
   }
 
-  fastRaf(() => {
   if (!instance!.isCancelled && tick()) {
+    fastRaf(() => {
       animateSingle(tick, instance);
-    }
     });
+  }
 }
 
 export function animate(tick: Function) {
-  fastRaf(() => {
   if (tick()) {
+    fastRaf(() => {
       animate(tick);
-    }
     });
+  }
 }
 
 export type TimingFn = (t: number) => number;

src/util/fastSmoothScroll.ts

@@ -10,6 +10,7 @@ import {
 import { IS_ANDROID } from './environment';
 import { dispatchHeavyAnimationEvent } from '../hooks/useHeavyAnimationCheck';
 import { animateSingle } from './animation';
+import { fastRaf } from './schedulers';
 
 let isAnimating = false;
 
@@ -135,6 +136,7 @@ function scrollWithJs(
   const startAt = Date.now();
   const onHeavyAnimationStop = dispatchHeavyAnimationEvent();
 
+  fastRaf(() => {
     animateSingle(() => {
       const t = Math.min((Date.now() - startAt) / duration, 1);
       const currentPath = path * (1 - transition(t));
@@ -149,6 +151,7 @@ function scrollWithJs(
 
       return isAnimating;
     });
+  });
 }
 
 function longTransition(t: number) {

src/util/fastSmoothScrollHorizontal.ts

@@ -2,6 +2,7 @@ import { getGlobal } from '../lib/teact/teactn';
 
 import { ANIMATION_LEVEL_MIN } from '../config';
 import { animate } from './animation';
+import { fastRaf } from './schedulers';
 
 const DEFAULT_DURATION = 300;
 
@@ -39,6 +40,7 @@ function scrollWithJs(container: HTMLElement, left: number, duration: number) {
 
   const startAt = Date.now();
 
+  fastRaf(() => {
     animate(() => {
       const t = Math.min((Date.now() - startAt) / duration, 1);
 
@@ -47,6 +49,7 @@ function scrollWithJs(container: HTMLElement, left: number, duration: number) {
 
       return t < 1;
     });
+  });
 }
 
 function transition(t: number) {

src/util/switchTheme.ts

@@ -1,6 +1,7 @@
 import { ISettings } from '../types';
 
 import { animateSingle } from './animation';
+import { fastRaf } from './schedulers';
 
 import themeColors from '../styles/themes.json';
 
@@ -54,6 +55,7 @@ export default (theme: ISettings['theme'], withAnimation: boolean) => {
   isInitialized = true;
 
   if (shouldAnimate) {
+    fastRaf(() => {
       animateSingle(() => {
         const t = Math.min((Date.now() - startAt) / DURATION_MS, 1);
 
@@ -61,6 +63,7 @@ export default (theme: ISettings['theme'], withAnimation: boolean) => {
 
         return t < 1;
       });
+    });
   } else {
     applyColorAnimationStep(startIndex, endIndex);
   }