Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

ネイルブックでのWEB高速化の取り組み

2.931 Aufrufe

Veröffentlicht am

dot.さんのイベント「Think Startup Career Night #02」でお話させていただいたときの資料になります。

Veröffentlicht in: Technologie

ネイルブックでのWEB高速化の取り組み

  1. 1. ネイルブックでの WEB高速化の取り組み Think Startup Career Night #02 株式会社スピカ 國府田勲
  2. 2. Copyright © Spika Inc. 2016 all rights reserved. 2 自己紹介 國府田勲 株式会社スピカ http://spika.co.jp 代表取締役 プロダクトオーナー インフラエンジニア 13万人 20人 4人 http://qiita.com/kou
  3. 3. Copyright © Spika Inc. 2016 all rights reserved. 3 株式会社スピカの紹介 2014年4月に設立された スタートアップ ネイルサービス 「ネイルブック」を運用 メンバーの半分がエンジニア メンバーの半分が女性50%
  4. 4. Copyright © Spika Inc. 2016 all rights reserved. 4 ネイルブックのご紹介 毎月100万人の女性が利用する 日本最大のネイル情報サービス https://nailbook.jp
  5. 5. Copyright © Spika Inc. 2016 all rights reserved. 5 サービス利⽤の流れ 検索 情報チェック 予約 来店 ネイル写真から気になるサロンを検索 詳細情報を確認後、オンラインで予約を完結 ネイリストが投稿した写 真から⾃分好みのデザイ ンを検索 ギャラリーや詳細情報を チェック メニューと来店希望⽇時 をチェックし、仮予約 来店し、予約時に選択 したメニューを施術 イメージとのズレなく 思い通りの仕上がり
  6. 6. Copyright © Spika Inc. 2016 all rights reserved. ネイルブックでの WEB高速化の取り組み 第一部 6
  7. 7. Copyright © Spika Inc. 2016 all rights reserved. • 利用者を増やすことができる – サイトの離脱を防ぐことができます • コンバージョンを高めることができる – 回遊率が高まります 7 WEB高速化の効能 高速化はエンジニアだけで サービスの成長に大きく貢献できる部分
  8. 8. Copyright © Spika Inc. 2016 all rights reserved. • 初期リリースから5年以上が経過し、技術的 負債がたまっていた • スタートアップに機能追加を止めてリファクタ する余裕はない 8 WEB高速化の障害 技術的負債を段階的に返済 返済時に利息(高速化)をつける
  9. 9. Copyright © Spika Inc. 2016 all rights reserved. 9 WEB高速化結果 項目 2015年12月 2016年11月 レスポンスタイム 167ms 90ms ロードタイム 5.11sec 2.82sec サーバコスト $8148 $6014 性能が向上し、コスト削減にも成功
  10. 10. Copyright © Spika Inc. 2016 all rights reserved. 取り組みの一部をご紹介します • 機能のスリム化 • フレームワーク最新化 • 検索エンジン全面導入 • 静的リソース最適化 • インフラ最適化 • 非同期処理化 10 取り組み
  11. 11. Copyright © Spika Inc. 2016 all rights reserved. • ビジネス側と調整して機能を削減 – 重要度の低くなった機能の廃止 – 使っていないコード・テーブルの整理 11 機能のスリム化 項目 2015年12月 2016年12月 ファイル数 3944 ファイル 2058 ファイル テーブル数 163テーブル 94テーブル
  12. 12. Copyright © Spika Inc. 2016 all rights reserved. • 古いシステムではやる気にならないので最新に 載せ替え 1. DjangoをPython2系で対応している1.6まで上げる 2. Pythonを3系にあげる 3. Djangoを最新にする 12 フレームワーク最新化 項目 2015年12月 2016年12月 Python 2.6 3.5 Django 1.2 1.10
  13. 13. Copyright © Spika Inc. 2016 all rights reserved. • 処理で大きな時間が割かれていたサロン検 索をDBからElasticsearchに移行 • 同時にESをAWSのマネージドに載せ替え 13 検索エンジン全面導入 処理時間短縮とインフラ削減に貢献 アプリケーションサーバ ESサーバ データ投入 サーバDB アプリケーションサーバ ESサーバ DB
  14. 14. Copyright © Spika Inc. 2016 all rights reserved. • トラフィックの多くを占めていた静的リソース の配信を最適化 – CDN経由での配信 – クライアントキャッシュの活用 – CSSスプライト化 – 独自WEBフォント化 14 静的リソース最適化
  15. 15. Copyright © Spika Inc. 2016 all rights reserved. • クライアントキャッシュの活用 – ブラウザには7日以上キャッシュさせるのが望ま しい – 静的リソース変更時に反映されない可能性があ る – 自動でバージョン番号を付与する仕組みを用意 15 静的リソース最適化 https://cdn.nailbook.jp/p/alternative/image s/white_icon.png?v=35c0b07a93528a09ac3 a4f30e98c1ba8ab41b287
  16. 16. Copyright © Spika Inc. 2016 all rights reserved. • CSSスプライト化 – 複数の画像を1枚の画像に合成して配信 • アイコンWEBフォント化 – サイトでよく使うアイコンをフォント化して配布 16 静的リソース最適化
  17. 17. Copyright © Spika Inc. 2016 all rights reserved. • この半年で実施した内容をご紹介 – HTTP圧縮 – mod_wsgiデーモン化 – 全面SSL化 – CDN全面導入 – MySQLバージョンアップ – MemcachedからRedis移行 17 インフラ最適化
  18. 18. Copyright © Spika Inc. 2016 all rights reserved. • 実行コストが高くリアルタイム性が不要な処 理を非同期処理化 – タスクキューとしてCeleryを導入 18 非同期処理化
  19. 19. Copyright © Spika Inc. 2016 all rights reserved. • ご紹介した以外にも様々な取り組みしてます – デプロイチェーン見直し – SQLチューニング – 管理画面の独自言語実装 – Swagger導入 – 画像合成サーバ – Dockerでの開発環境 – リアルなテストデータ生成 – アプリ開発でのChatOps 19 最後に 詳細はご面談で!
  20. 20. Copyright © Spika Inc. 2016 all rights reserved. あなたに合った スタートアップ診断 第二部 20
  21. 21. Copyright © Spika Inc. 2016 all rights reserved. 21 スタートアップのステージ スタートアップの成長段階区分 シード アーリー ミドル レイター 各ステージで求められるエンジニア像、 得られる経験、悩みが異なります
  22. 22. Copyright © Spika Inc. 2016 all rights reserved. 22 シード期 立ち上げの準備段階 会社の状況 プロダクト 企画しかない 収益 夢だけ膨らむ 組織 なに、それ?おいしいの? エンジニアの状況 まだ作るものがないので、やることなし シード アーリー ミドル レイター
  23. 23. Copyright © Spika Inc. 2016 all rights reserved. 23 アーリー期 プロダクトを世に出してユーザ定着に尽力 会社の状況 プロダクト リリース済み アーリーアダプターが使い出す 収益 収入なし 大きく赤字 組織 2-3人程度なのでスピード感ある シード アーリー ミドル レイター
  24. 24. Copyright © Spika Inc. 2016 all rights reserved. 24 アーリー期 プロダクトを世に出してユーザ定着に尽力 エンジニアの状況 開発スタイル 1人開発 求められる エンジニア像 • 何でもやるという気持ちのある人 • 一人で調べて進められる人 得られる経験 • 幅広いスキルが身につく • 自分で全てコントロールできる 悩み これで本当にいいのかわからない シード アーリー ミドル レイター
  25. 25. Copyright © Spika Inc. 2016 all rights reserved. 25 ミドル(グロース)期 プロダクトが受け入れられ、伸ばしていくフェーズ 会社の状況 プロダクト ユーザグロースの取り組みはじまる 収益 収益モデル検証がはじまる 組織 複数チームができつつある シード アーリー ミドル レイター
  26. 26. Copyright © Spika Inc. 2016 all rights reserved. 26 ミドル(グロース)期 プロダクトが受け入れられ、伸ばしていくフェーズ エンジニアの状況 開発スタイル チーム開発 求められる エンジニア像 • こだわりよりもスピード重視 • まわりとコミュニケーションをとって 進められる人 得られる経験 • 他のメンバーと切磋琢磨できる • 自分たちで開発スタイルを作れる 悩み 時間がなくてこだわりが発揮できない シード アーリー ミドル レイター
  27. 27. Copyright © Spika Inc. 2016 all rights reserved. 27 レイター期 収益モデルが完成した 会社の状況 プロダクト ユーザ目線から顧客目線に移りつつある 収益 単月黒字、累損解消 組織 組織が確立し、分業がはじまる シード アーリー ミドル レイター
  28. 28. Copyright © Spika Inc. 2016 all rights reserved. 28 レイター期 収益モデルが完成した エンジニアの状況 開発スタイル 組織開発 求められる エンジニア像 • 与えられた役割を精度良くこなせる • 効率化・標準化が得意 得られる経験 担当分野のスキル・経験の深掘り 悩み • 担当が決まっていて新しいスキル 獲得ができない • 営業がうるさくてリスクのある新し いことに挑戦できない シード アーリー ミドル レイター
  29. 29. Copyright © Spika Inc. 2016 all rights reserved. 29 適性診断 失敗してもいいのでひと山当てたい アーリーステージへ みんなが知ってるサービスに関わりたい 伸びていく勢いを感じたい ミドルステージへ レイターステージへ

×