# SPAをスマホで開いたときに若干重いときの対処法 **URL:** \ **Category:** bubble\ **Created:** [2022 年 4 月 13 日午前 9:27 UTC](https://www.nocode-faq.com/t/topic/2796 "2022-04-13T09:27:24Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![koyama](https://avatars.discourse-cdn.com/v4/letter/k/919ad9/32.png) [@koyama](https://www.nocode-faq.com/u/koyama)\ **Post date:** [2022 年 4 月 13 日午前 9:27 UTC](https://www.nocode-faq.com/t/topic/2796/1 "2022-04-13T09:27:24Z")
・悩み SPAだとかなり速度が上がりますが、スマホで重いページを表示させようとすると時間がかかってしまいます。また、スマホでやると画像やrepeating groupが完全に表示されるまで若干時間がかかることがあります。 マルチページならばローディング時のアニメーションをつけれるのであまり気にならないのですが、おそらくSPAでは最初以外アニメーションをつけるのは難しいですよね… ・聞きたいこと 上の悩みを解決するいい方法があれば是非教えていただきたいです。 漠然とした質問ですみません。画像をtinypngに通す等の高速化の対策しか思い付かず… よろしくお願いいたしますm(\_\_)m ---
**Author:** ![jansnap](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/jansnap/32/6599_2.png) [@jansnap](https://www.nocode-faq.com/u/jansnap)\ **Post date:** [2022 年 4 月 14 日午前 1:50 UTC](https://www.nocode-faq.com/t/topic/2796/2 "2022-04-14T01:50:05Z")
どこに時間がかかっているか分からないので、外しているかもしれませんが、 非表示のグループやエレメントを「This element is visible on page load」のチェックをはずし、必要な時だけconditionなどで表示するのはどうでしょう？ ---
**Author:** ![koyama](https://avatars.discourse-cdn.com/v4/letter/k/919ad9/32.png) [@koyama](https://www.nocode-faq.com/u/koyama)\ **Post date:** [2022 年 4 月 14 日午前 7:36 UTC](https://www.nocode-faq.com/t/topic/2796/3 "2022-04-14T07:36:27Z")
ご返信ありがとうございます！ 気をつけてみます！ すみませんこれに関連してなのですが、SPAでページ切り替え時のローディングのアニメーションをつけるのって可能ですかね… それが出来れば重さもあまり気にならなくなると思うのですが… ---
**Author:** ![jansnap](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/jansnap/32/6599_2.png) [@jansnap](https://www.nocode-faq.com/u/jansnap)\ **Post date:** [2022 年 4 月 15 日午前 1:39 UTC](https://www.nocode-faq.com/t/topic/2796/4 "2022-04-15T01:39:54Z")
うーん、ちょっとやり方が思いつかないですね。。。 どなたかアイデアをお持ちの方いらっしゃいませんか・・・😅？ ---
**Author:** ![yukikun](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/yukikun/32/3485_2.png) [@yukikun](https://www.nocode-faq.com/u/yukikun)\ **Post date:** [2022 年 4 月 15 日午前 10:27 UTC](https://www.nocode-faq.com/t/topic/2796/5 "2022-04-15T10:27:38Z")
試す必要はありますが、もともと非表示の要素の場合はentireフラグが取れるのではと思います。 entireフラグで処理できそうであれば、このフラグステータスによってローディング画面を描画するのが良さそうです。 これができない場合は、javascriptで画面に新規読み込みが発生した時にローディングアニメーションを描画するのが良さそうです。 ---
**Author:** ![koyama](https://avatars.discourse-cdn.com/v4/letter/k/919ad9/32.png) [@koyama](https://www.nocode-faq.com/u/koyama)\ **Post date:** [2022 年 4 月 15 日午後 12:37 UTC](https://www.nocode-faq.com/t/topic/2796/6 "2022-04-15T12:37:44Z")
ご返信ありがとうございます！ go to pageでurlに値を送ってページを変えているのですが、entireがnoのときに表示されるローディングアニメーションが出てこないんですよね… なので数秒固まってからページ遷移するかんじになってます… javascriptまだ勉強中なのでこれから頑張ります！ ありがとうございました ---
**Author:** ![yukikun](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/yukikun/32/3485_2.png) [@yukikun](https://www.nocode-faq.com/u/yukikun)\ **Post date:** [2022 年 4 月 16 日午前 9:09 UTC](https://www.nocode-faq.com/t/topic/2796/7 "2022-04-16T09:09:03Z")
SPAでページ切り替えで数秒固まるのは、そもそも設計にやや問題があるのではと思います。 SPAとして表示させる先のページでロードされるものを先読みするなどのデータロードに関する設計を改めると良いかもしれません。 ---
**Author:** ![koyama](https://avatars.discourse-cdn.com/v4/letter/k/919ad9/32.png) [@koyama](https://www.nocode-faq.com/u/koyama)\ **Post date:** [2022 年 4 月 16 日午前 11:49 UTC](https://www.nocode-faq.com/t/topic/2796/8 "2022-04-16T11:49:09Z")
なるほど！ありがとうございます！ ロードの設計のことあまり深く考えたことがなかったのでとてもありがたいです。 勉強不足ですみません。先読みする方法を教えていただくことは可能でしょうか。検索しても出てこず… もしロード設計に関して何かコツや参考になるサイトがあればぜひそれも教えていただきたいです。 勉強不足で何度も質問してしまいすみません。 いつもありがとうございます。 どうかよろしくお願いいたしますm(\_\_)m ---
**Author:** ![yukikun](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/yukikun/32/3485_2.png) [@yukikun](https://www.nocode-faq.com/u/yukikun)\ **Post date:** [2022 年 4 月 20 日午前 4:51 UTC](https://www.nocode-faq.com/t/topic/2796/9 "2022-04-20T04:51:29Z")
実装が少しややこしい可能性がある前提で、 - 検索に時間がかかる項目をあらかじめcustom stateに格納する - custom stateに格納する処理はpageの初期読み込み完了後から段階的に実行 - 読み込み前にspaのページが開かれる場合は、そちらの読み込みを優先して処理する などでしょうか・・・ 画面要素はさらに増える＋reusableなど駆使して作る必要もありますので、開発に慣れている＋設計ができるとなっていないと難しい実装になります。 ご参考までに。 ---
**Author:** ![koyama](https://avatars.discourse-cdn.com/v4/letter/k/919ad9/32.png) [@koyama](https://www.nocode-faq.com/u/koyama)\ **Post date:** [2022 年 4 月 23 日午後 3:12 UTC](https://www.nocode-faq.com/t/topic/2796/10 "2022-04-23T15:12:13Z")
ありがとうございます！！