メルカリShopsフロントエンドのパフォーマンスを可視化する | メルカリエンジニアリング

はじめに こんにちは！ソウゾウのSoftware engineerの@yosanです。 「メルカリShops [フライング] アドベントカレンダー2022」5日目を担当します。 今回はメルカリShopsで行っている、フロントエンドのパフォーマンスの可視化について説明したいと思います。 メルカリShopsにおけるフロントエンドのパフォーマンス可視化 メルカリShopsはWebベースのアプリケーションであり、大まかに次のような構成で運用されています。 iOSやAndroidのネイティブアプリケーションに中おいても、メルカリShopsの部分はWebViewによって提供されています。 この記事における「フロントエンドのパフォーマンス」とは、いわゆるWeb Vitalsになります。例えば、ユーザがサイトにアクセスしてからコンテンツが表示されるまでに何秒かかっているか、あるいは意図せず画面レイアウトが

[lovelymakichin]

“Web”