スマホでサイトが読み込めない件

Question

前提・実現したいこと

サイトが重いためか、スマホでサイトが表示できない。
PCでは、表示できます。
楽天ゴールドのサイトです。
mp3が多数組み込まれています。HTMLもとても長いです。
サイトを表示できるようにしたいです。

発生している問題・エラーメッセージ

読み込みできず、【URLで問題が繰り返し起きました。】になる。

試したこと

■Google PageSpeed Insights
・過大なDOMサイズの回避>>>合計DOM要素数11,000
・メインスレッド処理の最小化>>>Parse HTML & CSS　17,000 ms（かかった時間）

Google PageSpeed Insightsの見方もあまりわからないのですが、
この辺を改善したらよいのかな？と考えています。

表示できない原因がHTMLの長さなのか？
mp3が多すぎて重いのか？
わからないのですが、出来る限りmp3の数を変更せず、改善できないか？と考えています。

Comments

[Lhankor_Mhy]

こんにちは。
2点補足願います。

テストは複数のデバイスで行いましたか？
問題が起きるデバイスのOSと機種を列挙することはできますか？

[yuchi03]

ありがとうございます。
アンドロイドでは表示できました。
iphoneですと、機種関わらずsafari,chrome,edgeで表示できません。

[Lhankor_Mhy]

OSはいかがでしたでしょうか？ 14.4ですか？

[yuchi03]

ありがとうございます。
14.4です。

[Lhankor_Mhy]

iOS14.4の複数のデバイスで問題が見られ、その他のデバイスには影響がなかったということですね。
つまり、iOSの問題という理解で合っていますか？

[yuchi03]

言葉足らずですみません。
はい。そうです。

[satokei]

> 表示できない原因がHTMLの長さなのか？
> mp3が多すぎて重いのか？
> わからないのですが、出来る限りmp3の数を変更せず、改善できないか？と考えています。

問題の切り分けのために、mp3をなくしたり、HTMLを短くしてみては？

[yuchi03]

ありがとうございます。
さっそくHTMLを短くしてみました。
無事、読み込めました。
だだ出来ればHTMLの量をこのままでいきたいのでmp3の軽量化をしてみます。