chocotakaの日記

日々技術的な事で学んだ小さな事をを自分なりに書いていきます

Passive Event設定によるスクロールイベントの改善

javascriptイベントハンドラevent.preventDefault()スクロールを止めてしまう事があります。

なのでイベントハンドラの処理が完了するまでスクロールする事ができずに、ユーザビリティのて低下につながってしまいます。。

document.addEventListener('touchstart', handler, {passive: true});

Passive eventはブラウザのスクロールを止めません。

上記で記述したようにpassive: trueで設定されたイベントハンドラは、処理が完了をするまで待つ事がなく、ユーザビリティの低下を防ぐ事ができます。

追記

ここで掲載されている動画で比較されています。 developers.google.com