The project uses its own scroll implementations and scrolling effects. Just today, a warning appeared in Firefox when scrolling through the page, the text is as follows:

It seems that this site uses the scrolling effect of positioning. This may not work well with asynchronous panning; See https://developer.mozilla.org/docs/Mozilla/Performance/ScrollLinkedEffects to learn more and join the discussion of related tools and features!

I read the information by reference, there is a description of the so-called "asynchronous scrolling", "sticky positioning", etc., but I still do not understand what the problem may be and what is "asynchronous panning".

  • Asynchronous programming is when the procedures in the total mass are not consistently executed — but by event / timer / timer from event / .... If firefox warns, then it is better to really think about these effects. - Goncharov Alexander
  • @ Goncharov Alexander, thank you, I understand what "asynchronous programming" is, I don't understand what "asynchronous panning" is :) - Romanzhivo pm

1 answer 1

Apparently, everything is quite simple: I suppose that Firefox "parsits" the js code loaded on the page and, if it finds the positioning properties inside the onscroll function or - when using jQuery - inside the .scroll () method, it gives a similar warning. The following code examples in Firefox (tested in version 47.0.1) will cause a warning:

<style> .wrapper { margin: 0; } .scrolled_block { position: absolute; height: 400%; width: 100%; } </style> <div class="wrapper"> <div class="scrolled_block"></div> </div> 

https://jsfiddle.net/Romanzhivo/mbmwdo2t/

 window.onscroll = function() { document.getElementsByClassName('scrolled_block')[0].style.top = 20 + 'px' } 

https://jsfiddle.net/Romanzhivo/mbmwdo2t/2

 $(window).scroll(function() { $('.scrolled_block').css({ 'top': '10px', 'left': '10px' }) });