Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Javascript scroll function slow, lots of "Timer Fired: onloadwff.js:310" weasel events in Chrome

Tags:

I'm trying to debug a page which is acting a little slow in Chrome, think it might be an issue with the following javascript code:

$(document).ready(function() {   function navScroll(distance){     $(window).scroll(function() {       var scrollTop;       if(distance){         scrollTop = distance;       }else{         scrollTop = 150;       }       if($(window).scrollTop() >= scrollTop) {         if(!($('#mainNav').hasClass('showNav'))) {           $('#mainNav').addClass('showNav');         }       } else {         if($('#mainNav').hasClass('showNav')) {           $('#mainNav').removeClass('showNav');         }       }     });   }    if($('.header-image-base').length){     var windowHeight = $(window).height();     $('.header-image-base').css('height', windowHeight);     navScroll(windowHeight);   }else{     navScroll();   } }); 

When I look in Chrome's console's 'timeline' panel, and press record, this is what I see:

enter image description here

Any ideas what is happening here? I can't find any references to this on google and no idea how to remedy it.

like image 981
JVG Avatar asked Feb 18 '14 00:02

JVG


1 Answers

Your page is slow most likely because you’re attaching a handler to the window scroll event—this is not a good practice as explained below:

It’s a very, very, bad idea to attach handlers to the window scroll event. Depending upon the browser the scroll event can fire a lot and putting code in the scroll callback will slow down any attempts to scroll the page (not a good idea). Any performance degradation in the scroll handler(s) as a result will only compound the performance of scrolling overall. Instead it’s much better to use some form of a timer to check every X milliseconds OR to attach a scroll event and only run your code after a delay (or even after a given number of executions – and then a delay). (source)

Your screenshot shows that onloadwff.js is located at chrome-extension://hdokiejnpimakedhajhdlcegeplioahd which means it’s part of the LastPass extension — as seen below. So it’s probably not related to your performance issue.

screenshot

(archived screenshot)

Link - https://chrome.google.com/webstore/detail/lastpass-free-password-ma/hdokiejnpimakedhajhdlcegeplioahd

like image 151
Dennis T --Reinstate Monica-- Avatar answered Sep 20 '22 03:09

Dennis T --Reinstate Monica--