【個人開発】実際にアプリを使っているところを見て気づいたこと｜SKILLDO

今日はミューチャを知人に紹介したときに触っているところを隣で見ていて感じたことを書いていこうと思います。

知り合いに触ってもらった

実際に合う機会があった人にミューチャを紹介すると、友だち登録をして開くところまではスムーズにいくのですが、ページを開いたときに読み込みの時間が長く、我慢できずに連続でタップしてしまったり閉じてしまったりしていました。

また、別の人に触ってもらって感想を聞いたところ、読み込みに時間がかかるので早くしてほしいという要望をもらいました。

もちろん動作確認は自分の環境でしていて、長いときに表示まで大体読み込みに2 ~ 3秒かかっていました。体感的に許容範囲だと思っていました。

ただ、自分が動作確認をしていたのは自分の家で Wifi が通っていて、動作する端末もIpone 14 pro と限りなく完璧に近い環境で行っていました。

実際に読み込みに時間がかかるといっていた知り合いの端末は Iphone SE でさらに格安SIMという環境でした。

また、実際に開くところを見せてもらったのですが、測ってないので体感ですが 5 s くらいかかっていて僕も遅いと強く感じました。

ユーザーはリマインドを外の Wifi が通っていない、電波の悪いところで開くこともありえるのでそこを考える必要があるなと感じました。

現状、Mucha のログインに関するアーキテクチャーは以下のようになっています。(わかりやすくするために簡略化しています)

このログインの処理は大きく２つに分けることができます。

この内②の処理がかなりボトルネックになっていました。

ただ、ログインをしないと当然リマインドを設定することはできません。

そこで、①の処理が終わったタイミングで、ログインしなくても表示できるところ表示してユーザーはリマインドの入力ができるようにしておきました。

そして、入力中にバックグランドでログイン処理を行い、ユーザーが登録ボタンを押すころにはログインができている状態にするということをしました。

これにより、きちんと測定はしなかったのですが体感2倍以上高速に表示することができるようになりました。

最初はユーザー情報をブラウザにキャッシュすることも考えました。SPA でブラウザのキャッシュを使うには基本的にローカルストレージになると思っていて、これを使う場合 XSS などの攻撃に対する耐性が低くなります。

ミューチャの場合、キャッシュにトークンを持たせておく必要があるので、認証情報であるトークンをブラウザに持たせるのはセキュリティー的に危険と考えてこの方法は採用しなかったです。

スマホで使うアプリの場合は、ユーザーが外出中に使うことを想定して、ネットワークがつながりにくい状態で動作確認するということをやったほうがいいということが分かりました。

下が今開発しているミューチャです！
友だち登録してトーク画面のメニューからリマインドの設定ができます。よければぜひ使ってみてください。