Reddit の iOS アプリのエクスペリエンスが Web バージョンよりも優れていることがわかったので、データの読み込みが速い理由を調べてみようと思いました。以下は Reddit の iOS アプリの分解です。

以下にハイライトをいくつか紹介します。

• トークンベースの認証を使用します。
• 設定や実験から投稿情報まで、ほぼすべてに GraphQL API を使用します。
• w3-reporting という API を使用して、ユーザーが体験する API システムのパフォーマンスを監視します。
• ほとんどの GraphQL API 呼び出しでは、変数なしで操作名のみが渡されます。これは、フロントエンドから変数の構成を抽象化するためにミドルウェアを使用していると想定しています。バックエンド サービスは、操作名に基づいて情報を入力します。
• Reddit はライブコメント機能に Web Socket を使用します。

API 呼び出しの詳細な分解は、こちらにあります。Reddit の iOS アプリを傍受するためにRequestly のデスクトップ アプリを使用しました。セットアップ手順は、こちらで提供されています。

使用される技術

Redditアプリは

• Reddit の iOS アプリは、GraphQL API を使用してすべてのコンテンツを読み込みます。
• トークンベースの認証はユーザーの検証に使用されます。
• ユーザー側で API パフォーマンスを報告することによるパフォーマンス監視。
• ライブコメントは WebSocket を使用してサポートされます。
• 新しいバージョンを展開せずにアプリの動作をリモートで制御するための動的構成。
• 実験のステータスを変更するために新しいデプロイメントを必要とせず、実験をリモートで制御する動的実験。

プリロードによるUXの向上

私が抱いていた主な疑問は、アプリがなぜこんなに高速に動作するのかということでした。これは、 FeedPostDetailsByIds API の応答を確認することで解決しました。この API は、表示される投稿の ID とともにホーム画面で呼び出され、投稿をクリックした後に表示される詳細情報が付属しています。トップ投稿のこの事前読み込みにより、ローダーなしで投稿の詳細画面を即座に表示できるようになりました。

• プリロード中の投稿はフィードに表示されます。
• API の応答時間も非常に高速です。

GraphQL API セキュリティ

GraphQL クエリは、必要な応答のデータと構造で構成されます。操作名は通常オプションです。ほとんどの Reddit API では、クエリに操作名のみが含まれており、変数は、ホット投稿や最新投稿のオプションを含むフィードなどの画面上の変数/フィルターがある場合にのみ使用できます。

これにより、フロントエンド開発者が独自に変更を加えるための制御は少なくなりますが、ユーザー向けの API の後に不要なデータを取得するために API を誤用することに対する制御は強化されます。

遠隔制御実験

ネイティブ iOS アプリで実験を実行するのは難しく、実験を有効または無効にするには再デプロイが必要ですが、Reddit は実験をリモートで制御できるようにアプリを設定しました。すべての実験は、値とステータスとともに API に読み込まれます。アプリは、割り当てられた実験のバリアントを自動的にアクティブ化します。

フラグベースの機能制御

ユーザー、実験、機能が非常に多いため、リモートで制御する方がよいでしょう。Reddit はこれらの機能をリモートで制御するのに優れています。

アプリを起動するたびに、構成 API が呼び出され、400 を超える構成変数が読み込まれます。これらの変数に基づいて、さまざまな機能と機能のバリエーションが表示されます。

カルマの秘密

GetTopKarmaSubredditsという操作名の API は、各サブレディットで獲得したカルマ ポイントとともにトップ サブレディットのリストを取得します。この API は、各サブレディットでのアクティビティから獲得したコメント数と投稿カルマ数を明らかにします。Reddit の Web およびモバイル UI 内でこの情報を見つけることができませんでした。

改善の範囲

API を読んで、どのような種類のデータを取得するのか調べているときに、 SubredditFeedElements API は選択したサブレディットのフィードをロードしますが、各投稿にはサブレディットの詳細情報のネストされた JSON が含まれていることがわかりました。この情報は冗長であり、API のネットワーク負荷を軽減してパフォーマンスをさらに向上させるために削除できます。

注: SubredditFeedElements API はSubredditFeedSdui APIに置き換えられ、問題は修正されました。

AIを活用して洞察を得る

ChatGPT を使用して API から洞察を得ようとしました。そこで、すべての API とその curl および応答を含むファイルを作成しました。このファイルを CustomGPT にアップロードして、あらゆる種類のクエリを配置できるようにしました。API がどのような用途に使用できるか、応答の構造など、明らかな洞察が得られましたが、API が多すぎるためか、私がプロンプトの専門家ではないためか、多くの幻覚が見られました。AI によって得られた洞察の一部:

1. GetAllExperimentVariants API — 多くの実験には、 enabled 、 variant_1 、 control_model 、 one_feed_ph_bridge_new_usersなどのオプションを含む特定の「バリアント」名があります。このセグメンテーションは、Reddit が特定のユーザー セグメントで機能をテストして、その影響を判断していることを示しています。たとえば、実験d2x_avatar_in_comments_loggedinは、 loggedinとloggedoutの 2 つのバリアントがあり、ユーザー認証状態に基づいて機能をテストしている可能性があります。
2. GetAllExperimentVariants API — 実験には、ビデオ機能、広告配置、ユーザー インターフェースの強化、サードパーティ統合をカバーする幅広い機能テストを指すhybrid_video_rollout_android_v2 、 active_sales 、 gql_google_maps_integrationが含まれます。
3. GetAccountDetails API — API レスポンスには、 isSubredditCreationAllowed 、 isNameEditable 、 isPasswordSet 、ユーザーのモデレーターステータスなど、ユーザーのアカウントステータスの詳細を示すさまざまなフィールドが含まれています。さらに、アカウントが現在停止または制限されているかどうかを示すsuspensionExpiresAtとisSuspended含まれています。

API一覧

Reddit の仕組みを理解するために私が研究した GraphQL API のリストがあります。認証、レポートなどの他の API もいくつかありましたが、このリストには含めませんでした。

結論

この分解実験の結論として、いくつかの点を指摘したいと思います。

• Reddit の API はあまり高速ではありませんが、代わりにプリロードを使用してユーザー エクスペリエンスを向上させます。
• API の作業は決して完了することはなく、Reddit のエンジニアでさえ、それをさらに改善するために取り組むべき作業がいくつかあります。
• アプリと実験の構成をリモートで維持することで、ユーザー エクスペリエンスを適切に制御できます。
• Requestly のエンジニアは、GraphQL リクエストごとに操作名を表示するという素晴らしい仕事をし、開発者の作業を大幅に楽にしました。