Highcharts: デモページを開くとAndroidChromeがクラッシュする

ピクセル3でも同じ、android chrome 78.0.3904.62

ウェブサイト全体にたくさんのチャートがあり、それらにアクセスできず、UXに大きな悪影響を与えるため、これは実際には非常に緊急の問題です。

この問題を報告していただきありがとうございます。

Android v9.0でテスト済み：

• v76.0.3809.132-問題なし
• v77.0.3865.116-問題なし

Androidv9.1でテスト済み

• v78.0.3904.62-冷凍Chrome

更新はありますか？

BrowserStackにはまだv78がありませんが、開発者（@ jon-a-nygaardおよび@oysteinmoseng ）は現在、物理デバイスでデバッグしています。

これまでの調査から、Android Chromev78.0.3904.62での複雑なSVGのレンダリングのパフォーマンスが低下しているようです。 この例では、ストロークが大きいパスです。

問題をいくつかの要素を持つ比較的単純なsvgに切り分けました。ここでは、要素の変換属性の1つが高速間隔で更新されます。
以下のショーページをAndroidChrome v78.0.3904.62で開くと、しばらくの間フリーズしてから、追いついて正常に動作することがあります。 以前のバージョンでは、最初からスムーズに実行されます。

• JSFiddleの例
• ショーページの例

この問題をGoogleChromeサポートに報告しました。問題を解決できるか、問題の原因についてさらに洞察を提供できることを願っています。

@ jon-a-nygaard Google Chromeからのフィードバックはありますか？
問題レポートへのリンクを追加できますか？ どうも

こんにちは@ anki247 、

残念ながら、Google Chromeサポートからのフィードバックはありません。残念ながら、問題のレポートは公開されていません。

幸いなことに、今日、この問題はChromiumでも再現できることがわかり、ChromiumProjectsに報告しました。 この問題レポートは、 https：//bugs.chromium.org/p/chromium/issues/detail？id = 1022314で入手できます

Chromiumでのテストに関心のある方は、Androidアプリをhttps://download-chromium.appspot.com/からダウンロードでき

@ jon-a-nygaard
plsはそれらのデモを見て、まったく同じチャートがエラーなしでレンダリングされているページを偶然見つけました。
何時間も費やした後、いくつかのHTML構造とCSSクラス/ルールが何らかの影響を与えることがわかりました。

• JSFiddleの例
• ショーページの例

このJSFiddleと例との唯一の違いは、グラフの前のCSS部分とこのHTMLです。 しかし、ここではそれはアンドロイドクロームで完全に動作します：-S
`` `` ``

ありがとう@ anki247 、

それは興味深い観察です！ これが技術的に何を意味するのかはわかりませんが、これが彼らの進歩に役立つことを期待して、 Chromiumプロジェクトに

@ anki247すごい。 チャートが存在するページの背景と同じ色でこれを配置しただけで、問題が修正されたようです。 今のところ素晴らしい回避策

@ anki247クラッシュしていることを示す

@baerrach
クラッシュ：

• https://jsfiddle.net/jon_a_nygaard/1c7Lpefm/
• https://jsfiddle.net/jon_a_nygaard/1c7Lpefm/show

「回避策」:(実際には回避策を意図したものではありませんでした。もっとデモ^^）

• https://jsfiddle.net/6w59qaod/11/
• https://jsfiddle.net/6w59qaod/11/show

上で述べたように、それらの違いはただ

• CSS部分
• チャートの上のHTML部分に続く
  `` `` ``
  

詳細と回避策をありがとうございます！

こんにちはhighchartsチーム！

この問題に関する最新情報はありますか？ Chromeチームから何か反応はありましたか？ SVGを使用するアプリケーションを開発しましたが、 Chrome @Androidでもまったく同じ問題が発生してい

報告された問題は引き続き有効です。 ケースの現在のステータスは、 https ： ます。

この問題は、グラフ化しようとしているほぼすべてのデータセットで発生します。 これは明らかにGoogleのロングランナーであるため、上記の@ anki247の調査結果（この場合は機能しないようです）よりも多くの既知の回避策がありますか？ 異なるチャートタイプ？ サンプルの最大数？

Highcharts Boostを使用すると、特にモバイルデバイスで役立ちます。

データポイントの密度を下げることも役立ちます。 1ページにレンダリングする必要のあるシリーズとチャートの数にもよりますが、ほとんどのデバイスでは、シリーズごとに最大500のデータポイントがスムーズにレンダリングされるようです。 画面幅に応じてデータポイントの量を設定できます。