Considere marcar o manipulador de eventos como 'passivo' para tornar a página mais responsiva

Estou usando o martelo para arrastar e está ficando irregular ao carregar outras coisas, como esta mensagem de aviso está me dizendo.

A manipulação do evento de entrada 'touchstart' foi atrasada por X ms devido ao segmento principal estar ocupado. Considere marcar o manipulador de eventos como 'passivo' para tornar a página mais responsiva.

Então eu tentei adicionar 'passivo' ao ouvinte assim

Hammer(element[0]).on("touchstart", function(ev) {
  // stuff
}, {
  passive: true
});

mas ainda estou recebendo esse aviso.

Para aqueles que recebem esse aviso pela primeira vez, isso se deve a um recurso de ponta chamado Passive Event Listeners que foi implementado nos navegadores recentemente (verão de 2016). Em https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md :

Os ouvintes de eventos passivos são um novo recurso na especificação do DOM que permite que os desenvolvedores optem por melhorar o desempenho da rolagem, eliminando a necessidade de rolagem para bloquear os ouvintes de eventos por toque e roda. Os desenvolvedores podem anotar ouvintes sensíveis ao toque e alternar com {passive: true} para indicar que eles nunca chamarão preventDefault. Esse recurso foi lançado no Chrome 51, Firefox 49 e desembarcou no WebKit. Para uma explicação oficial completa, leia mais aqui.

Veja também: O que são ouvintes de eventos passivos?

Pode ser necessário aguardar a biblioteca .js para implementar o suporte.

Se você estiver manipulando eventos indiretamente por meio de uma biblioteca JavaScript, poderá estar à mercê do suporte dessa biblioteca específica ao recurso. Em dezembro de 2019, não parece que nenhuma das principais bibliotecas tenha implementado suporte. Alguns exemplos:

• jQuery.js - problema em andamento: https://github.com/jquery/jquery/issues/2871
• React.js - problema em andamento: https://github.com/facebook/react/issues/6436
• Hammer.js - fechado devido a falta de acompanhamento: https://github.com/hammerjs/hammer.js/pull/987
• perfect-scrollbar - fechado: https://github.com/noraesae/perfect-scrollbar/issues/560
• AngularJS - fechado devido a não será corrigido: https://github.com/angular/angular.js/issues/15901

Isso oculta a mensagem de aviso:

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 });
    }
  }
};

Também encontre isso no plug-in suspenso select2 no Laravel. Alterando o valor conforme sugerido por Alfred Wallace de

this.element.addEventListener(t, e, !1)

para

this.element.addEventListener(t, e, { passive: true} )

resolve o problema. Por que ele tem voto negativo, eu não sei, mas funciona para mim.

Para aqueles que enfrentam problemas herdados, encontre a linha que lança o erro e adicione {passive: true}- por exemplo:

this.element.addEventListener(t, e, !1)

torna-se

this.element.addEventListener(t, e, { passive: true} )

Encontrei uma solução que funciona no jQuery 3.4.1 slim

Depois de desminificar, adicione {passive: true}à função addEventListener na linha 1567 da seguinte forma:

t.addEventListener(p, a, {passive: true}))

Nada quebra e as auditorias de farol não reclamam dos ouvintes.