Upgrade to Pro — share decks privately, control downloads, hide ads and more …

WebPagetest in 5 minutes

Avatar for t32k t32k
October 30, 2013
Design
12
2.6k

WebPagetest in 5 minutes

Introduction to "Speed Index" of awesome tool WebPagetest.
http://www.webpagetest.org/ #frontrend

Avatar for t32k

t32k

October 30, 2013
Tweet

More Decks by t32k

See All by t32k
なぜプレイドにデザインエンジニアが必要だったのか？
Avatar for t32k t32k
0
560
スタンドアロンAMPのすゝめ
Avatar for t32k t32k
3
13k
Evaluating your stylesheets
Avatar for t32k t32k
0
790
Evaluating CSS
Avatar for t32k t32k
10
2.2k
Modern Development Workflow with Grunt
Avatar for t32k t32k
22
36k
Introduction to Sass Compass for Sencha Touch
Avatar for t32k t32k
6
1.9k
var Gurator = Gist + Curator;
Avatar for t32k t32k
0
360
Sublime Text and Grunt for Titanium Development
Avatar for t32k t32k
5
3.3k
3 secrets for optimizing Web application
Avatar for t32k t32k
6
210

Other Decks in Design

See All in Design
[2025.6.30 もがく中堅デザイナー、キャリアの分岐点] なんでもやる系デザイナーのもがきかた
Avatar for Takahiro Hayashi taka_piya
1
1.4k
ビジネスアナリシスはビジネス”分析”じゃないよ！～システム人材が価値を生むための基盤スキルとしてのビジネスアナリシス～
Avatar for BPStudy bpstudy
0
570
株式会社ログラス - 会社説明資料【デザイナー】/ Loglass Designer
Avatar for 株式会社ログラス loglass2019
1
810
数理的アプローチで挑むスマホUIのデザイン改善：タップ成功率推定ツール「Tappy」の社内活用事例 / Improving Smartphone UI Design with a Mathematical Approach: In-house Use Case of the Tap Success Rate Estimation Tool "Tappy"
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
640
プロジェクト内でデザイナーができること 日経電子版アプリ機能開発「For You」#nikkei_tech_talk
Avatar for 日本経済新聞社 エンジニア採用事務局 nikkei_engineer_recruiting
8
4.2k
Kid Cowboy 103
Avatar for Marilu Molina marilutwin
0
280
A Platform Connecting Brand Philosophy and Assets: "LY Corporation Design Hub"
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
290
【最新】マズロー安達の弟子実績（1期-4期の26人分）
Avatar for マズロー安達 maslow_akkun
0
720
デザインから開発まで一貫したデザインシステムを構築するベストプラクティス / Best Practices for Building a Consistent Design System from Design to Development
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
370
文字コントラストを改めて考える / Reevaluating Text Contrast
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
360
Memory Man v3 (WIP)
Avatar for Chad Welson storybychad
PRO
0
2.2k
Yahoo!フリマ：生成AI利用機能ならではのインターフェース設計について / Yahoo! JAPAN Flea Market: Interface Design Specific to Generative AI Utilization Features
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
330

Featured

See All Featured
No one is an island. Learnings from fostering a developers community.
Avatar for Antonio thoeni
21
3.4k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
8
370
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
126
17k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
134
9.4k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
140
7k
Improving Core Web Vitals using Speculation Rules API
Avatar for Sergey Chernyshev sergeychernyshev
18
1k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
130
19k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
86
4.8k
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
54
11k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
181
54k
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
96
6.1k

Transcript

  1. Frontrend x Chrome Tech Talk Night Extended, October 30, 2013

    5 WebPagetest minutes in

  2. +KojiIshimoto

  3. Web Performance Warrior I’m a... www.flickr.com/photos/soldiersmediacenter/5349439407

  4. PageSpeed Insights WebPagetest

  5. WebPagetest

  6. None
  7. None
  8. None

  9. First Byte Start Render DOM Elements Document Compete Fully Loaded

    Load Time Waterfall View Connection View Screen Shot Filmstrip View Watch Video Scripted Test Waterfall Opacity Export HTTP Archive
  10. None
  11. None

  12. Speed Index

  13. None
  14. None

  15. Speed Index = end 0 1 ― 100 VC ∫

    ― ― ― end = End time in milliseconds VC = % (Visually Complete)

  16. Let’s Improve Performance

  17. None

  18. Before 80 PageSpeed Insight Score

  19. Remove it!

  20. After 93 PageSpeed Insight Score

  21. None

  22. WebPagetest

  23. WebPagetest

  24. 3105 WebPagetest

  25. None

  26. ―@maccaw Speed is the second biggest engagement driver on the

    Internet. Just after perceived speed.

  27. Private Instance for Ameba

  28. None

  29. Under Development

  30. Thanks! +KojiIshimoto