世界約50カ国の国と地域から集まったPayPayグループの個性豊かなプロダクトメンバーたちの声を通して、モノづくりへの姿勢や雰囲気をダイレクトにお伝えするTech Talksシリーズ。
今回は、ミニアプリの速度改善に携わったPayPayカード アプリエンジニアのChenさんに、取り組みの詳細や開発を通じて感じる成長などについて伺いました。
Fangjian Chen
PayPayカード グロースプロダクト本部 第7チーム マネージャー
中国出身のChenです。2015年に来日し、SIerを経てアプリエンジニアとして大手ECサイトで速度改善に従事しました。ずっと愛用していたPayPayカードの速度改善に貢献したいと思い、2024年7月にPayPayカードに入社しました。
「自分ならミニアプリの速度を改善できる」と確信
現在担当している役割とミッションを教えてください
PayPayカードのグロースプロダクト本部に所属し、PayPayアプリ内にあるPayPayカードミニアプリの速度改善に取り組んでいます。アーキテクチャの見直しやリファクタリング、性能改善などを通じてミニアプリの表示速度を大幅に改善させ、ユーザー体験を向上させることがミッションです。また、現在は並行してエンジニアリングマネージャーも担当しており、メンバーの成長をサポートすることもミッションです。
PayPayカード入社までのキャリアは？
2015年に来日し、SIerとしてキャリアをスタートしました。toBではなくtoCサービスに携わりたいと思い、ECサイトを運営するメガベンチャーへ転職しました。前職ではネットスーパーの速度改善を担当し、一定の成果を出せたと自負しています。
一方、ユーザーとして愛用していたのはPayPay関連のサービスで、ヘビーユーザーでした。特に、自分にとって初めてのクレジットカードであるPayPayカードには強い思い入れもありました。ですが、PayPayカードは、ユーザー目線でミニアプリの表示速度が遅いという課題を抱えていました。「どうしてこんなに速度が遅いの？」と疑問を抱くと同時に、自分なら過去の経験を活かして速度改善を実現できるとも思い、応募を決意しました。
面接で速度改善への想いを伝えたところ、面接官を務めていた現在の上長からも「ぜひ取り組んでほしい」と前向きなメッセージをもらいました。「アプリ起動からトップページが1秒以内に表示されること」をゴールに、速度改善へ取り組み始めました。
スプリントで速度改善を推進し、30％以上の高速化を実現
速度改善はどのように推進していきましたか？
入社早々に担当したプロジェクトだったため、最初の1か月はオンボーディングと開発環境の構築に専念しました。期間中、上長や周りのメンバーがアイスブレイクや気軽な1on1の場を細かくセットしてくれたことで、開発に欠かせないメンバーとの関係構築もスムーズに進められました。
翌月からは、現状把握を徹底しました。ユーザーとして、ミニアプリを立ち上げて画面が表示されるまでに6〜7秒、操作するたび追加で2〜3秒かかる感覚だったにもかかわらず、PayPayカード側では1.5〜2秒程度で済んでいるという認識でした。原因を分析すると、秒数計測の方法に問題があることがわかりました。
具体的には、良好なネット環境かつ、全データがキャッシュ済みの状態での計測が行われており、計測も手動で数値にブレがありました。ユーザーはミニアプリを外出先や回線品質の悪い環境で開くことも多く、毎日のようにミニアプリを起動してキャッシュを取得しているわけではないため、速度に乖離が生まれる要因が多かったのです。実際のユーザー環境に近い条件を再現し、計測者によって数値にブレが生じないよう、自動計測の仕組みを導入しました。
続いて、速度低下の原因を分析したところ、静的リソースのダウンロードと動的リソースの取得に予想以上の時間がかかっていると判明しました。また、プロダクトメンバーが共通して利用するデザインコンポーネント自体にも改善余地があるとわかり、仮説ベースでパッケージサイズ減少による改善の効果を訴え、所管部署と連携しながら改善にあたりました。
改善の成果を教えてください
不要なリソースの削除やファイルサイズの圧縮、API統合を中心とした一部遷移方式のSPA化などに対応した結果、約4か月間で70％以上の静的リソース削減に成功し、十数本あったAPIも1本に統合しました。デザインコンポーネントのサイズも60％以上圧縮し、トップページの表示時間が33％減少しました。目標としていた1秒切りに近い数値を記録しています。
ですが、スピードアップに終わりはなく、今回やり残した改善も多いです。時間はかかるが大きな成果が見込める、ミニアプリのアーキテクチャレベルでの根本改善や、ハイスキルなフロントエンジニアが中心となり開発を進められる環境の整備などにも注力していきたいです。
プロジェクト内で一番チャレンジングだったことは？
改善したい内容の多さと、少しでも早く目に見える改善を達成したい気持ちのバランスを取ることでした。超短期間で改善を図るため、工数と優先順位を整理し、着手する施策とそうでない施策を線引きしていきました。施策が決まった後は、スプリントを活用してひたすらトライアル＆エラーを繰り返しながら開発を進め、徐々にリリースしていきました。
スピード感をもって改善を進めるうえでは、とにかく躊躇せず、手を動かすことを意識しました。複数の改善を同時並行で進めつつ、品質を担保するためのレビューも実行していく。トップページの速度改善に並行処理を実装したのと同じ意識で、自分自身のタスクも並行処理するよう心がけました。
また、チーム間での細かい連携やナレッジシェアが求められるため、他チームのプロダクトやカルチャーの把握にも注力しました。日本人メンバーも多い環境ではありましたが、速度改善を会話の糸口と考え、できるだけ多くのメンバーとコミュニケーションを図りました。PayPayカードのメンバーが国籍や言語を超えて私の挑戦を後押ししてくれたこともあり、速度改善に繋がる多くの知見を得られました。
プロジェクトを通じて感じた成長は？
エンジニアとして、一段階レベルアップできたように感じます。今までは課題を誰かから与えられ、それを解決するだけの「課題解決者」に甘んじている面もありました。ですが、今回のプロジェクトでは仮説をベースに自ら検証を重ね、改善を実現できたことで、課題発見から組織に貢献できる「課題発見者」へ近づいていると実感できました。
最後に、読者へのメッセージをお願いします
PayPayカードは、短期的な収益に直接繋がるわけではないパフォーマンス改善のような取り組みにも、しっかりと価値を見出してくれる会社です。また、急成長中の会社のため高頻度な機能リリースが可能で、ユーザー体験の向上に繋がる取り組みなら自分の裁量でチャレンジできます。自動化も進んでいるため、自分の本質的な役割にフォーカスすることも可能です。
私は、エンジニアにとって最大のやりがいは、難しい課題を発見し、解決する過程で自身の成長を実感できることだと考えています。プロダクトの改善にチャレンジするエンジニアが正しく評価され、大切にされる環境で成長を実感したい方には、ぜひPayPayカードの仲間になっていただきたいです。
※募集状況、社員の所属等は取材当時のものです。