Polyfill (scroll-timeline.js) сбрасывает CSS ⇐ Javascript

[Anonymous]

На моем веб-сайте (простой php, html, css, js) я использую анимацию на основе прокрутки через js с использованием анимации-временной шкалы, которая не поддерживается в Firefox. Команда Google выпустила файл Scroll-timeline.js (polyfill), но в Firefox это вызывает что-то вроде FOUC. На странице применены все стили, css полностью загружен (main.min.css в сети, все в одном домене), а затем в конце вы видите, как входит Scroll-timeline.js и каким-то образом на короткое время сбрасывает CSS, прежде чем загрузить их снова (main.min.css снова появляется в сети, и на этот раз «инициатором» является не таблица стилей, а «scroll-timeline.js»). Это происходит каждый раз, когда вы переходите на другую страницу / F5.
Есть идеи, в чем может быть проблема? Я пробовал удалить все виды js/стилей, даже те, которые используют полифилл, но пока я загружаю полифилл, Firefox делает свое дело.
Использовал полифилл: flackr Scroll-timeline.js
Вот сеть:

В текстовых соответствующих строках:



Файл
Инициатор
Тип




main.min.css
таблица стилей
css


scroll-timeline.js
/:859 (скрипт)
js


main.min.css
scroll-timeline.js:1 (fetch)
css



И вот мое единственное использование временной шкалы анимации:
$.each($parallaxes, function (i, parallax){
let distance = ($(parallax).attr('data-parallax-distance') != undefined) ? $(parallax).attr('data-parallax-distance') : '600';
let animation = parallax.animate(
{
transform: ['translateY(0)', 'translateY(-'+distance+'px)'],
},
{
fill: 'both',
timeline: new ViewTimeline({
subject: parallax,
}),
rangeStart: 'entry 50%',
rangeEnd: 'cover 95%',
}
);
animations.push(animation);
});


Подробнее здесь: https://stackoverflow.com/questions/798 ... resets-css