[Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive
[Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive
In this post i am going to discuss about how to remove a jQuery violation "[Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive" from chrome console.
Basically user can remove all the basic violations from just changing the type of log from "Verbose" to "Info".
But what if user want to remove above violation from "Verbose" log Type ?
So Here is the solution.
Problem :
The above violation is occur because e.preventDefault() will take much time and it will not passively load the component or we can say DOM.
So to remove that please include below code on top of your javascript.
Solution :
{passive:true}
// To remove the violation jquery-1.11.1.min.js:3 [Violation] Added non-passive event listener to a scroll-blocking 'touchstart' event. Consider marking event handler as 'passive' to make the page more responsive.
jQuery.event.special.touchstart = {
setup: function( _, ns, handle ){
if ( ns.includes("noPreventDefault") ) {
this.addEventListener("touchstart", handle, { passive: false });
} else {
this.addEventListener("touchstart", handle, { passive: true });
}
}
};
//Remove violation code End
So now run your application and above violation will not appear into console.
Cheers...!!!Enjoy...!!!
Feel free to comment below your experience with above approach and If you still find any problem with above steps Let me know I would love to help you to resolve your problem.
I hope this article will provided you solution which you are expecting. If you want to know more about Javascript check out Javascript World
If you want to take your Technological Knowledge to the Next Level and For More Technological information Stay tuned to Visionfortech
and angular 2 ?
ReplyDeleteGood. Thanks for fix!
ReplyDeletewaht about the mousewheel event, tried this and didnt work
ReplyDeletejust do the same for the other events that you want. Here it works!
Deletefor angular 6 ????
ReplyDeleteThanks.
DeleteSurelly i will do that for Angular6 and will post it soon.
Stay tunned to http://www.visionfortech.com