boblauer / react-onclickout

An ES6-friendly on-click-outside React component.
MIT License
92 stars 14 forks source link

Support for `passive` flag? #20

Open prayerslayer opened 6 years ago

prayerslayer commented 6 years ago

Hi, thanks a ton for this component.

I'm seeing perf warnings in my Chrome because of the non-passive event handler on touchmove. MDN says the passive flag is basically a promise from the developer to the browser to never call preventDefault in the handler.

How would you feel about a passive boolean property on the ClickOutside component that's passed down to addEventListener?

boblauer commented 6 years ago

Thanks for the link, I wasn't aware of the passive flag.

Out of curiosity, what version of Chrome are you using? The reason I ask is because MDN says the passive flag is defaulted to true starting in Chrome 56 on touchstart and touchmove events.

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Improving_scrolling_performance_with_passive_listeners

prayerslayer commented 6 years ago

Hm, I'm running Version 61.0.3163.100 (Official Build) (64-bit). I couldn't find a source for passive flag being true if not provided in Chrome, the best I got is this. So apparently it's only sometimes true by default? Maybe the "enabled by default" just means the Chrome feature flag?

Dunno if we care about IE or Edge 15, but those don't support passive event listeners, and providing an option argument to them would be detrimental.