最近更新了ios11.3,專案上發現這麼一個問題，“我的”頁面和兩個列表頁的滾動出現了問題，滾動時候不僅滾動了希望滾動的部分，整體的頁面也跟隨者上下滾動，整個頁面非常卡頓。

1. 這兩個頁面都用了touch事件
2. 控制檯列印如下警告：

[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. 
See https://www.chromestatus.com/features/5093566007214080

解決辦法1：

在touch的事件監聽方法上繫結第三個引數{ passive: false }，
通過傳遞 passive 為 false 來明確告訴瀏覽器：事件處理程式呼叫 preventDefault 來阻止預設滑動行為。

elem.addEventListener(
  'touchstart',
  fn,
  { passive: false }
);

解決辦法2：

 * { touch-action: pan-y; } 
 使用全域性樣式樣式去掉

Passive event listeners

2016年Google I/O上提出的概念，目的是用來提升頁面滑動的流暢度。

For instance, in Chrome for Android 80% of the touch events that block scrolling never actually prevent it. 10% of these events add more than 100ms of delay to the start of scrolling, and a catastrophic delay of at least 500ms occurs in 1% of scrolls.

在 Android 版 Chrome 瀏覽器的 touch 事件監聽器的頁面中，80% 的頁面都不會呼叫 preventDefault 函式來阻止事件的預設行為。在滑動流暢度上，有 10% 的頁面增加至少 100ms 的延遲，1% 的頁面甚至增加 500ms 以上的延遲。

由於瀏覽器無法預先知道一個事件處理函式中會不會呼叫 preventDefault()，它需要等到事件處理函式執行完後，才能去執行預設行為，然而事件處理函式執行是要耗時的，這樣一來就會導致頁面卡頓，也就是說，當瀏覽器等待執行事件的預設行為時，大部分情況是白等了。

如果 Web 開發者能夠提前告訴瀏覽器：“我不呼叫 preventDefault 函式來阻止事件事件行為”，那麼瀏覽器就能快速生成事件，從而提升頁面效能，Passive event listeners 的提出就解決了這樣的問題。