AMP におけるパフォーマンス改善 | Recruit Tech Blog
はじめまして、ホットペッパービューティーコスメ(以下 HPBC) の Web フロントエンドエンジニアとして学生アルバイトをしている三島です。3 ヶ月間のアルバイト期間で、案件に関わる機能開発や SEO 施策の検討と実装、パフォーマンス改善など様々な業務に取り組ませていただきました。本記事ではその中でも、私が取り組んだ HPBC におけるパフォーマンス改善について紹介します。 目次 1. はじめに 2. 想定読者 3. AMP とは 4. パフォーマンス改善の前提知識 5. 現状計測 6. 問題特定 7. 問題解決 8. 今後 9. まとめ はじめに HPBC の開発プロジェクトでは、Web ページを閲覧してくれるユーザーにとってページが完全に表示されるまでのスピード、つまり「パフォーマンスが大事である」という認識をチーム全体で共有しています。Web サービスのプロダクトは、機能の追加・改
Webページを監視して表示崩れが起きていないか検出できるE2Eテストを実装しました | PSYENCE:MEDIA
お世話になります、フロントエンド担当をしている小原正大です。Webページの表示を監視して差異があった場合、どのページで表示の変化が起きているかを知ることが出来るプログラムを実装したのでそのことについて書こうと思います。 何につかったの？ 僕がフロントエンドを担当しているサービス『料理サプリ』で大規模なフロントエンドコードのリファクタリング行う際に表示テストを自動化するために作成しました。『料理サプリ』はPC・スマホ合わせて大体350-400ページの表示パターンが存在する比較的規模の大きいサイトです。全ページに影響を与えるような作業は大規模な回収となり、今回のリファクタリングでは表示テストの計画などの段取りが必要でした。従来の人手によるQAでは細かいバグを見過ごしたり時間がかかり効率が悪いので、可能な限り自動化しようと考え実装しました。 実装の概要 この監視のシステムは以下の２つ実装を組合わ
【フロントエンド】新規 Web アプリケーション開発案件をふりかえってみた | PSYENCE:MEDIA
4 ヶ月あまり続いた新規開発案件がようやく落ち着きを見せたので、ここらで振り返りをしてみたいとします1)リリースまでに巻き取れなかった不具合や未実装箇所が幾つか残っているので、まだ気持ち的には終われていないのですが…。 サービスのおおまかなアウトライン コンシューマ ( 一般ユーザー ) 向けサービス ブラウザで動く Web アプリケーション ワンソースによるレスポンシブレイアウト サポートするブラウザは IE9 以降や Android4.x 以降のモダンブラウザのみ Ruby on Rails 多言語対応あり SEO 対策はそれなりに必要 わりとフワッとしか要件が決まっていないままスタートしたので、TRY & ERROR を繰り返しながらの開発 すごく大雑把ですが、だいたいこんな感じの Web アプリケーションです。これを踏まえてフロントエンドをどのように開発していくかを設計していきまし
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
