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

WebPagetest in 5 minutes

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for t32k t32k
October 30, 2013
Design
12
2.7k

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
3.1k
スタンドアロンAMPのすゝめ
Avatar for t32k t32k
3
13k
Evaluating your stylesheets
Avatar for t32k t32k
0
840
Evaluating CSS
Avatar for t32k t32k
10
2.3k
Modern Development Workflow with Grunt
Avatar for t32k t32k
22
37k
Introduction to Sass Compass for Sencha Touch
Avatar for t32k t32k
6
2k
var Gurator = Gist + Curator;
Avatar for t32k t32k
0
400
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
240

Other Decks in Design

See All in Design
Treasure_Hunting
Avatar for Sol Metts solmetts
0
320
ドルちゃん
Avatar for ドルちゃん design_dolphins
0
580
社員の意識を高めたブランド浸透施策の裏側！
Avatar for MIXI DESIGN mixi_design
PRO
0
110
アイデアを加速させる！Firefly ボードで発想の幅を広げよう
Avatar for コネクリ connecre
1
350
Ralph Penel Portfolio
Avatar for ralphpenel ralphpenel
0
360
公開スライド）熊本市様-電子申請中級編
Avatar for @Garyuten garyuten
0
1.1k
絵や写真から学ぶ、要素がもたらす副作用
Avatar for keigo kspace
0
230
2026年、デザイナーはなにに賭ける？
Avatar for Kazuhiro Tobita 0b1tk
0
520
デザインを信じていますか
Avatar for sekig(ojiee) sekiguchiy
1
1.1k
研修担当者が一番伸びた　熊本市役所✕AI『泥臭いAI研修』のワークショップ設計について
Avatar for @Garyuten garyuten
2
320
kintone_aroma
Avatar for kintone kintone
0
1.7k
Crisp Code inc.｜ブランドガイドライン - Brand guidelines
Avatar for So Kotani / Crisp Code inc. CEO so_kotani
1
340

Featured

See All Featured
Building Experiences: Design Systems, User Experience, and Full Site Editing
Avatar for Michelle Schulp Hunt marktimemedia
0
450
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
31
3.1k
Odyssey Design
Avatar for Ryan Kendrick rkendrick25
PRO
2
550
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.1k
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
Avatar for UX Y'all uxyall
0
220
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
100
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.4k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
210
24k
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
0
260
What the history of the web can teach us about the future of AI
Avatar for Ines Montani inesmontani
PRO
1
480
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.6k
Building the Perfect Custom Keyboard
Avatar for Naoto Takai takai
2
720

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