Added non-passive event listener to a scroll-blocking 'touchmove' event. Consider marking event handler as 'passive' to make the page more responsive
上記のようなメセージがChromeのデベロッパーツールのコンソールに出まくっています。
ググると下記のようなコードで解決するみたいなことが書いてあるのですがコードに含めても解決しません
document.addEventListener('wheel', event => {}, {passive: true});
document.addEventListener('mousewheel', event => {}, {passive: true});
document.addEventListener('touchstart', event => {}, {passive: true});
document.addEventListener('touchmove', event => {}, {passive: true});
プログラムはCSVデータを読み込んでアニメーションで棒グラフの棒を伸ばす、ただそれだけです。
ボタンなどのリスナーはひとつも設置してません。ブラウザの表示とともに棒グラフをアニメーションで表示するだけです。
for文でデータを1行づつ読み込み棒グラフの棒を伸ばします。その1行読み込むごとに上記のエラーが表示されます。
いろいろ試した結果、このメッセージはWordPress上に対象HTMLページを設置すると表示されます。
WordPressではなく適当なフォルダを作って設置すると表示されません。
WordPressに詳しい方何か解るでしょうか?
また、原因としてScroll Jankと言うものを知りましたが、そもそも上記に書いたようにイベント系のコードは一切含めていません。
おおまかなコードです
javascript
1var sl = () => new Promise(resolve => setTimeout(resolve, 50)); 2async function draw() { 3 for (let i = 0; i < data.length; i++) { 4 この中はsvgをいじっくて棒を伸ばす処理です。 5 イベントなどは一切はいっていません。 6 await sl(); 7 } 8}