# リスト表示の速度改善について

**URL:** <https://www.nocode-faq.com/t/topic/4128>\
**Category:** bubble\
**Created:** [2024 年 2 月 2 日午後 2:21 UTC](https://www.nocode-faq.com/t/topic/4128 "2024-02-02T14:21:27Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ikejapa](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/ikejapa/32/9031_2.png) [@Ikejapa](https://www.nocode-faq.com/u/Ikejapa)\
**Post date:** [2024 年 2 月 2 日午後 2:21 UTC](https://www.nocode-faq.com/t/topic/4128/1 "2024-02-02T14:21:28Z")

</div>

先日、ちょこバイスというサービス([https://chocovice.spovisor.com](https://chocovice.spovisor.com))のリリースをNoCodeCampでアナウンスさせていただきました。  
そのサービスでまだユーザー数が数十人しかいないにもかかわらず、ユーザーリストを表示するページのロードが遅いです。  
リリース前にいくつか対策を講じていたのですが、何か他に取れる策があればアドバイスを頂きたいです。

### 1.前提条件

・ページ表示時にユーザーのリストを表示（Repeating Groupにて表示）  
・データは一括で全員分を取得（pagenationというpluginを使ってページ送りを実装しているため）

### 2.発生している問題

・ユーザーリストの表示に時間がかかっている

### 4.実装したい機能

・表示速度の改善

### 5.スクリーンショット

添付のような形でユーザの名前、自己紹介、登録いただいたスキルや業界などを表示しています。

 ![image](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/0/0e1afb9b348589152f0e9242a5d8c7ed383ee5a1.png)

### 6.試したこと

・画面全体としてデータベースへの問合せを減らしています。  
（初期の読み込みは発生します）

＜検索時＞  
・画面に見えない形でリピーティンググループを配置してそこにずっとデータを格納する形でそのデータを使って検索などを実施する形で検索スピードの改善を図っています。

＜他＞  
・SPA化してトップ画面と同居する形で裏でデータを読み込んでおく対応を使用と思っています。  
ただ、それでもアプリ全体をSPAにすると非常に大変なのでトップページと検索ページ（ユーザー一覧）のみを同居する形を考えています。  
その場合は、トップページからの遷移時は表示が早くなりますが、それ以外は表示のもっさりさが残ってしまいます。

### 7.補足情報 （調べたURL/参考になりそうな事例）

以下のパフォーマンス改善の動画を見て対策を講じています。

[![](https://us1.discourse-cdn.com/flex020/uploads/ncc_forum/original/2X/2/2b48f67c9f1e7e91ccb8623fb7851d249c9e026d.jpeg "Bubbleパフォーマンス改善") ](https://www.youtube.com/watch?v=ddF9Yna1BBQ)

---

<div class="post-metadata">

**Author:** ![john03tgck01a](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/john03tgck01a/32/4558_2.png) [@john03tgck01a](https://www.nocode-faq.com/u/john03tgck01a)\
**Post date:** [2024 年 2 月 5 日午前 5:03 UTC](https://www.nocode-faq.com/t/topic/4128/2 "2024-02-05T05:03:57Z")

</div>

参考になるかわかりませんが、実際に作成したことのある機能ですと、外部データベース（Xano）を使い、〇〇万件のデータからページネーションにて、60件ずつデータを取得するという機能を実装しました。

参考URL：

> **[External Paging](https://docs.xano.com/working-with-data/functions/database-requests/query-all-records/external-query-manipulation/external-paging)**

---

<div class="post-metadata">

**Author:** ![Ikejapa](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/ikejapa/32/9031_2.png) [@Ikejapa](https://www.nocode-faq.com/u/Ikejapa)\
**Post date:** [2024 年 2 月 5 日午前 6:27 UTC](https://www.nocode-faq.com/t/topic/4128/3 "2024-02-05T06:27:58Z")

</div>

ありがとうございます！みてみます。  
そして60件もデータがないのにもっさりしているという感じなのでどうしたものか、、

---

<div class="post-metadata">

**Author:** ![Turtle01](https://avatars.discourse-cdn.com/v4/letter/t/96bed5/32.png) [@Turtle01](https://www.nocode-faq.com/u/Turtle01)\
**Post date:** [2024 年 2 月 5 日午前 7:23 UTC](https://www.nocode-faq.com/t/topic/4128/4 "2024-02-05T07:23:22Z")

</div>

こんにちは、横から失礼します。  
FAQ読んだだけなので断定できないですが、プラグインと現行システム間で何かしらの処理がコンフリクトしてるのでは？と思いました。

ページネーションをプラグインではなく、CustomStateとリピーティンググループ、もしくはToolboxで作成してみるのはどうでしょうか？

こちらが参考になるかと思います。  
CutomStateでの作り方: [Page count with Repeating Groups - Question - Bubble Forum](https://forum.bubble.io/t/page-count-with-repeating-groups/73204)  
ToolBoxでの作り方: [https://youtu.be/FMkNV8\_1tSk](https://youtu.be/FMkNV8_1tSk)

---

<div class="post-metadata">

**Author:** ![Ikejapa](https://sea2.discourse-cdn.com/flex020/user_avatar/www.nocode-faq.com/ikejapa/32/9031_2.png) [@Ikejapa](https://www.nocode-faq.com/u/Ikejapa)\
**Post date:** [2024 年 2 月 5 日午前 7:48 UTC](https://www.nocode-faq.com/t/topic/4128/5 "2024-02-05T07:48:49Z")

</div>

@Turtle01 さん、  
ありがとうございます。  
いろいろといじっていますが、pagenationのpluginではうまく動作しない（変な表示になる）こともあり、困っていましたのでToolboxで作ってみます。  
参考のリンクをシェアしていただきありがとうございます！