📝 週刊Bubble | Bubble公式からWorkloadの最適化マニュアルが公開!

Bubble公式からWorkloadの最適化マニュアルが公開されました。その他、Bubbleアプリで公開されているメタデータなどの情報に注意、表示速度改善Tips、Bubble事例など

Bubble Weekly Newsletterへようこそ!

先週1週間のBubbleのホットニュースやForumトピックをピックアップし日本語でお届けします。このニュースレターを読むとBubbleの動向をつかめる内容になっています!

Bubble好きがおくるBubbleがもっと楽しくなるニュースレター!

今週もスタートです!!

この記事は5分程で読める内容になっています。

by Bubble

今までWorkloadの最適化についてはBubbler個人やBubble開発企業からの情報が主でした。今回Bubble公式から実践的な戦略を含めたマニュアルが公開されました。

<Workloadについて重要なこと>

Workloadは使用されるべきリソースでありゼロにしてアプリを運用することはほぼ不可能です。ユーザー体験とWorkloadの使用量のバランスを取ることが重要です。(ユーザー体験を向上させるとWorkloadが増える場合があるため)メリットデメリットを知り適切なバランスを取ることがゴールです。


セクション毎に内容がまとめられています。一気に読むのが難しければ、まずは 1.の「Workload測定の基礎理解」と 3.の「ページ読み込み時に発生するWorkload」を読むことをおすすめします。

ページ読み込み時はWorkloadが大量に消費される傾向にあります。ダッシュボードやデータの一覧表示にはDo a search for が多用され統計などでサーバー負荷も上がります。これをページの読み込み毎に全ユーザーに対し行うことになるので検討が必要です。対策としては検索の最適化や初期のデータロードを制限するなどが考えられます。

  1. Workloadの計算を理解する

  2. Do a search for (検索)の注意点

  3. Page load (ページ読み込み) に発生するWorkload

  4. WorkflowとAction数がWUにどのように影響するか

  5. Backend workflow の最適化

Workload計算の基本的考え方↓

テーマパークを例に出しBubbleのWorkloadも入場料と各アトラクションに料金がかかることを説明しています↓

上記図のMake changes to は4つの Workloadコストがかかります。

・Make changes to a thing に 0.5 (入場料)
・Search for Statisticをして first itemを返す に 0.3(アトラクション1)
・Search for Usersをしてcount数を返す に 0.2(アトラクション2)
・結果の変更ををNumber of usersに入れるに 1 文字あたり 0.000003(アトラクション3)
*検索するデータ量によって追加コストがかかります

Make changes to 一つを例にとって、これだけの部分にWorkloadがかかることが理解できたと思います。

<その他>
Worklodとはサーバーの作業に関するものです。言い換えれば、クライアント側で起こっていることは、サーバーからの作業が関与しない限り、Workload数にまったく影響を与えません。

😃 Workloadsを抑えた開発は今後ますますBubbleエンジニアの必須能力の一つとなっていきます。仕様通り&デザイン通りに構築できるBubbleエンジニアから更にWorkloadを抑えた組み方や設計ができるBubbleエンジニアへ。

Bubble公式のマニュアルにはWorkloadを抑える代替手段も書かれています。Bubbleエンジニアはもれなく時間がある時に目を通すようにしましょう!

Workloadの使用が増えがちな「統計的データを表示させるページ」や「eコマースのトップページ」のWorkloadを抑えるヒントはPage loadに関するページに載っています。とても参考になります。

あなたが知らない…Bubbleアプリの一部が公開されているかもしれないこと

12月7日にForum「Tips」に掲載された内容です。
Bubbleのアプリからは以下のデータに容易にアクセスができるため扱いに注意が必要という投稿です。

<公開される主な内容>

  • メタデータ
    以下のURLからアプリに関する構造、機能、内容を見ることができます。(データの中身ではありません
    https://自分のドメイン/api/1.1/meta

  • GETデータ
    Dataにプライバシールールを設定していない場合は以下のURLから全てのデータへのアクセスが可能です。Data APIにチェックを入れかつプライバシールールを設定していない場合は致命的です。https://自分のドメイン/api/1.1/obj/データタイプ名

  • POSTデータ
    バックエンドworkflowで 「Expose as a public API workflow」にチェックを入れている場合に「どのworkflowが認証なしで実行されるか」がわかります。つまり「This workflow can be run without authentication」がどれに対し設定しているかがわかり攻撃の対象にされる可能性があります。以下の設定が必須です。

  • データベース
    データベースの構造はField名も含め全て公開されます(実際のデータの中身はプライバシールールで保護できます。)

  • Option Sets
    これは過去に何度も色々な方からの注意喚起がありました。Option Setsの内容は保存したデータも含め全て公開されます。ページ読み込み時にすべてロードされます。Option Setsには機密情報を保存しないこと。また大量のデータを保存するとページ読み込みが遅くなる可能性があります。

  • API Connector
    すべての API 呼び出しは公開されます。ただしデータはPrivateにチェックが入っている場合は保護できます。また「Initialize call」時も公開されるので機密データは注意してください。

  • App Texts
    App Textsも全て公開されるので登録時に機密情報は保存しないこと。

  • 全てのページ
    わかりにくい名前のページにしたり、サイトマップを公開していない場合も見つけられる可能性はあります。公開したくないadminページなどページが読み込まれてもデータを表示させない等の対策は必要です。

ここまでを読んで怖くなった方もいるかもしれません。たまにBubbleはセキュリティーが弱いということを耳にしますが、Bubble自体が原因ではなく実際は開発者の知識不足が招いている場合がほとんどです。

💡 投稿者のgeorgecollierさんも書いていますが、理解した上で適切にデータを扱う必要があるということです!どこまでの情報が公開されるかを理解し保存するデータの選別やプライバシールールの設定が必須です。

Bubbleのプライバシー&セキュリティについて、以前こちらの記事にもまとめました。まだ読んだことが無い方は参考にどうぞ。

ページの表示速度改善Tips

By Airdev

複数タブがあるページの読み込み速度を向上させるために、表示をデフォルトで非表示に設定し、Conditionalで表示させるようにします

最初のレンダリング要素が少なくなり、ユーザーはページ上の初期コンテンツをより早く見ることができるようになります

💡 SPA (Single Page Application)で良く使われる手法です。Bubbleの開発のしやすさからデフォルトの方で visibleの方にチェックを入れ、Conditionalで非表示 (This element is visible のチェックを外す)というのをやりがちです。確かに読み込み速度は変わりますね。開発者は気をつけたいポイントです☝️

SNSやブログ、その他Bubbleのニュース!

👀 定期的にチェックしたいBubble公式が公開しているSHOWCASE - 事例一覧

by Bubble

本日紹介するのはBubbleのSHOWCASE。ここでBubbleの成功事例を沢山見ることができます。

Bubbleの事例、どんなものがありますか?とよく聞かれます。日本語で検索をして得られる情報は少し前の事例ばかり。最新事例はBubble公式のSHOWCASEが一番です。

例えば最近公開されたフィンテックの「Much」という金融サービス↓

Muchはフィンテックとコミュニティーを合わせたサービスです。ユーザーは借金を返済するだけでなく、その過程を共有し、途中でサポート ネットワークを構築することもできます。

創業者のCarmenは自身の57,000ドルの学生ローンを返済する過程で人々がより早く借金から抜け出す方法とサポートネットワークが一つになったアプリを思い付きました。

アイディアはアメリカのアクセラレータープログラムTechstarsに受け入れられました。コードを書いてアプリを作ると市場投入が遅くなるため解決策を探していたところにBubbleに出会いました。開発はわずか2ヶ月間。その後Techstarsから投資を受け、Visible Handsからの助成金を得ました。Brexクレジットカードとのパートナーシップを通じタイムズスクエアで広告配信までも獲得しました。

アイディアをすぐに形にし市場に出す〜投資を受けるまでのスピードを出せるのはBubbleだからこそ!資金調達後も問題なくBubbleで開発を続けることができます。「ユーザーのフィードバックに基づいて迅速にピボットできる」こともBubbleの強みです。

😃 このBubbleの強みをまだまだ日本国内で知らない人が多すぎます。来年はこの啓発も進めていきたいと思っています! 一緒に盛り上げていきたい方いたらぜひお声がけください🙌

 😃 みなさんからのレビューやコメント大歓迎です

  • 今回ためになったことや興味深かったこと

  • 次回はこんな内容を知りたい

  • Bubbleで困っていること

    こちらからご意見をお待ちしております。レビューは全て目を通しています。Twitterなどからの拡散も大変嬉しいです。励みになります^^

🐭 ニュースレターのパートナーも募集しています。詳細はお問い合わせください。

続きを読むには

登録は無料です。Bubbleの最新情報を日本語で!毎週お届けします。

Already a subscriber?Sign In.Not now