HTML5 NIGHT 08. Web × パフォーマンス技術
- 1. HTML5 NIGHT 「08. Web × パフォーマンス技術」 パフォーマンス部 部長 竹洞 陽一郎 2014年6月5日
- 3. 計測条件 • 対象ブラウザ • IE 9.0 （GPU Accelerator On） • Firefox 14.0.1 （SPDY On） • Chrome 31.0.1650.63 （SPDY On） • 計測ISP • NTT • KDDI • 計測間隔 • 15分に1回、しかし、間隔はランダム化されているので、 きっかり15分ではない。
- 4. 散布図 ― Scatter Plot (6/7 〜 6/14)
- 7. IEでのエラー
- 8. 統計データ要約 平均 標準偏差 IQR 0% 25% 50% 75% 100% サンプル数 Chrome 1.695211 1.575961 0.367 0.966 1.204 1.3445 1.571 31.532 1148 Firefox 1.970859 1.613145 0.60525 0.011 1.44575 1.6415 2.051 42.229 932 Internet Explorer 1.651217 1.259629 0.5125 0.949 1.18125 1.371 1.69375 23.071 1338 Firefoxユーザーは、25%の確率で、ページのダウンロードに、 2秒以上かかる
- 9. 箱ひげ図 ― Boxplot chart IE9 （SPDYなし） Firefox14.0.1 （SPDYあり） Chrome31.0.1650.63 （SPDYあり）
- 10. Object Trending - IE Facebook Twitter Google+Facebook
- 11. IEで遅い(19.075秒)事例 DNS Lookup 18秒 緑の線はFirst Paint、赤い線はTime to Interactive
- 12. Object Trending - Firefox Facebook Facebook
- 13. Firefoxで遅い(42.491秒)事例 Facebook First Byte Download 41.8秒 緑の線はFirst Paint、赤い線はTime to Interactive
- 14. Object Trending - Chrome Twitter Hatena
- 15. Chromeで遅い(33.444秒)事例 緑の線はFirst Paint、赤い線はTime to Interactive はてな First Byte Download 30.6秒
- 16. Connection View - IE Total number of resources: 32 Total number of domains: 17 Total number of IP addresses: 14 Total number of connections: 24 余分なコネクション数＝コネクション数－ドメイン数 24-17＝7
- 17. Connection View - Firefox Total number of resources: 45 Total number of domains: 22 Total number of IP addresses: 18 Total number of connections: 30 余分なコネクション数＝コネクション数－ドメイン数 30-22＝8
- 18. Connection View - Chrome Total number of resources: 33 Total number of domains: 17 Total number of IP addresses: 15 Total number of connections: 20 余分なコネクション数＝コネクション数－ドメイン数 20-17＝3
- 20. 帯域はそれほど使っていない • デスクトップブラウザであっても、実質、250KB/秒 （2Mbps）ぐらいしか使っていない。 • TCP/IP ３way handshakeの影響 • TCP Slow Startの影響 • 云わば、通信の「Context Switch」のオーバーヘッド
- 21. SNSのボタンを張り付けると… • あっという間に、ドメイン数が増える • ドメイン数が増えると、SPDYの利点が失われる • HTTP2.0の仕様策定について、最近、SPDY反対派 が増え始める
- 22. IEでのドメイン増加数～16 • Facebook – 6 domains • www.facebook.com • www.facebook.com • connect.facebook.net • s-static.ak.facebook.com • static.ak.facebook.com • static.ak.fbcdn.net • Twitter – 3 domains • twitter.com • cdn.api.twitter.com • platform.twitter.com • Google+ – 4 domains • accounts.google.com • apis.google.com • oauth.googleusercontent.co m • ssl.gstatic.com • はてな – 3 domains • b.st-hatena.com • cdn-ak.b.st-hatena.com • cdn.api.b.hatena.ne.jp 赤字は、HTTPSでの配信
- 23. Firefoxでのドメイン増加数～21 • Facebook – 7 domains • www.facebook.com • www.facebook.com • connect.facebook.net • s-static.ak.facebook.com • static.ak.facebook.com • static.ak.fbcdn.net • fbstatic-a.akamaihd.net • Twitter – 3 domains • twitter.com • cdn.api.twitter.com • platform.twitter.com • Google+ – 5 domains • accounts.google.com • apis.google.com • oauth.googleusercontent.com • ssl.gstatic.com • clients1.google.com • はてな – 3 domains • b.st-hatena.com • cdn-ak.b.st-hatena.com • cdn.api.b.hatena.ne.jp • その他 – 3 domains • evsecure-ocsp.verisign.com • gtglobal-ocsp.geotrust.com • ocsp.digicert.com 赤字は、HTTPSでの配信
- 24. Chromeでのドメイン増加数～16 • Facebook – 6 domains • www.facebook.com • www.facebook.com • connect.facebook.net • s-static.ak.facebook.com • static.ak.facebook.com • fbstatic-a.akamaihd.net • Twitter – 3 domains • twitter.com • cdn.api.twitter.com • platform.twitter.com • Google+ – 4 domains • accounts.google.com • apis.google.com • oauth.googleusercontent.com • ssl.gstatic.com • はてな – 3 domains • b.st-hatena.com • cdn-ak.b.st-hatena.com • cdn.api.b.hatena.ne.jp 赤字は、HTTPSでの配信
- 26. 「技術」ではなく、「人」の問題 • 実際は、技術的には解決可能であっても、人の問 題で解決できない事の方が多い。 • パフォーマンス部のサイトでは、わざとSNSのボタンを 貼って、３ｒｄ Party Contentsの影響を計測。 • 皆さんのサイトから、SNSのボタンを外せるのか? • 人の意思決定が絡む問題 • 技術的にしろ、ビジネス的にしろ「制約」があるから こそ、人は考える。 • 日本のWebパフォーマンスの遅延の問題の原因 • 日本のインターネット環境を過信した幻想が生み出した「通信 速度の制約の無い世界」 • 「見える化しない慣習」
- 30. エンジニアの使命 • ハードウェアの進化、通信環境の進化を当てにし て、パフォーマンス上の制約が将来消えるなどと 思ってはいけない。 • 我々が、ハードウェアの進化を相殺してどうする? • 我々は、制約のある世界で知恵を絞るからこそ、 知識労働者としてのエンジニアなのだ。
- 31. ご静聴ありがとうございました。