Enviar búsqueda
Cargar
Make your website 2 times faster
•
3 recomendaciones
•
882 vistas
Satoshi Kikuchi
Seguir
Web Directions East 09 Express. Web site performace slides
Leer menos
Leer más
Tecnología
Denunciar
Compartir
Denunciar
Compartir
1 de 57
Recomendados
Webmonkey
Webmonkey
isac Lagerblad
新 · 交互
新 · 交互
Sofish Lin
Basics of Front End Web Dev PowerPoint
Basics of Front End Web Dev PowerPoint
Sahil Gandhi
Lightning fast sass
Lightning fast sass
chriseppstein
FUSEe(β)で技術書プリティ化計画 公開版
FUSEe(β)で技術書プリティ化計画 公開版
Shunsuke Ito
Object oriented css graeme blackwood
Object oriented css graeme blackwood
drupalconf
Be nice to your designers
Be nice to your designers
Pai-Cheng Tao
The way to be a developer "What I Need"
The way to be a developer "What I Need"
egyappassiut
Recomendados
Webmonkey
Webmonkey
isac Lagerblad
新 · 交互
新 · 交互
Sofish Lin
Basics of Front End Web Dev PowerPoint
Basics of Front End Web Dev PowerPoint
Sahil Gandhi
Lightning fast sass
Lightning fast sass
chriseppstein
FUSEe(β)で技術書プリティ化計画 公開版
FUSEe(β)で技術書プリティ化計画 公開版
Shunsuke Ito
Object oriented css graeme blackwood
Object oriented css graeme blackwood
drupalconf
Be nice to your designers
Be nice to your designers
Pai-Cheng Tao
The way to be a developer "What I Need"
The way to be a developer "What I Need"
egyappassiut
Front End Web Development Basics
Front End Web Development Basics
Tahir Shahzad
Bootstrap Workout 2015
Bootstrap Workout 2015
Rob Davarnia
Just Your Type: Web Typography & You
Just Your Type: Web Typography & You
Mykl Roventine
ゆるく学ぼう!現在のフロントエンドまとめ
ゆるく学ぼう!現在のフロントエンドまとめ
将一 深見
Be German About Your Frontend
Be German About Your Frontend
Arush Sehgal
CSS Best practice
CSS Best practice
Russ Weakley
Cssbestpracticesjstyleguidejandtips 150830184202-lva1-app6892
Cssbestpracticesjstyleguidejandtips 150830184202-lva1-app6892
Deepak Sharma
Managing responsive websites with css preprocessors.
Managing responsive websites with css preprocessors.
The University of Akron
HTML5+CSS3 (入門編)
HTML5+CSS3 (入門編)
博史 高木
Efficient, maintainable CSS
Efficient, maintainable CSS
Russ Weakley
Html5
Html5
Satoshi Kikuchi
Css best practices style guide and tips
Css best practices style guide and tips
Chris Love
Sass: The Future of Stylesheets
Sass: The Future of Stylesheets
chriseppstein
Css
Css
Sumit Gupta
Understanding CSS and the Debugging Console
Understanding CSS and the Debugging Console
Jessica Reilley
Developing Your Ultimate Package
Developing Your Ultimate Package
Simon Collison
CSS Reset
CSS Reset
Russ Weakley
Implementing Awesome: An HTML5/CSS3 Workshop
Implementing Awesome: An HTML5/CSS3 Workshop
Shoshi Roberts
網頁程式設計
網頁程式設計
傳錡 蕭
CSS Systems
CSS Systems
Natalie Downe
Slow kinda sucks
Slow kinda sucks
Tim Wright
CSS and image optimization
CSS and image optimization
Stoyan Stefanov
Más contenido relacionado
La actualidad más candente
Front End Web Development Basics
Front End Web Development Basics
Tahir Shahzad
Bootstrap Workout 2015
Bootstrap Workout 2015
Rob Davarnia
Just Your Type: Web Typography & You
Just Your Type: Web Typography & You
Mykl Roventine
ゆるく学ぼう!現在のフロントエンドまとめ
ゆるく学ぼう!現在のフロントエンドまとめ
将一 深見
Be German About Your Frontend
Be German About Your Frontend
Arush Sehgal
CSS Best practice
CSS Best practice
Russ Weakley
Cssbestpracticesjstyleguidejandtips 150830184202-lva1-app6892
Cssbestpracticesjstyleguidejandtips 150830184202-lva1-app6892
Deepak Sharma
Managing responsive websites with css preprocessors.
Managing responsive websites with css preprocessors.
The University of Akron
HTML5+CSS3 (入門編)
HTML5+CSS3 (入門編)
博史 高木
Efficient, maintainable CSS
Efficient, maintainable CSS
Russ Weakley
Html5
Html5
Satoshi Kikuchi
Css best practices style guide and tips
Css best practices style guide and tips
Chris Love
Sass: The Future of Stylesheets
Sass: The Future of Stylesheets
chriseppstein
Css
Css
Sumit Gupta
Understanding CSS and the Debugging Console
Understanding CSS and the Debugging Console
Jessica Reilley
Developing Your Ultimate Package
Developing Your Ultimate Package
Simon Collison
CSS Reset
CSS Reset
Russ Weakley
Implementing Awesome: An HTML5/CSS3 Workshop
Implementing Awesome: An HTML5/CSS3 Workshop
Shoshi Roberts
網頁程式設計
網頁程式設計
傳錡 蕭
CSS Systems
CSS Systems
Natalie Downe
La actualidad más candente
(20)
Front End Web Development Basics
Front End Web Development Basics
Bootstrap Workout 2015
Bootstrap Workout 2015
Just Your Type: Web Typography & You
Just Your Type: Web Typography & You
ゆるく学ぼう!現在のフロントエンドまとめ
ゆるく学ぼう!現在のフロントエンドまとめ
Be German About Your Frontend
Be German About Your Frontend
CSS Best practice
CSS Best practice
Cssbestpracticesjstyleguidejandtips 150830184202-lva1-app6892
Cssbestpracticesjstyleguidejandtips 150830184202-lva1-app6892
Managing responsive websites with css preprocessors.
Managing responsive websites with css preprocessors.
HTML5+CSS3 (入門編)
HTML5+CSS3 (入門編)
Efficient, maintainable CSS
Efficient, maintainable CSS
Html5
Html5
Css best practices style guide and tips
Css best practices style guide and tips
Sass: The Future of Stylesheets
Sass: The Future of Stylesheets
Css
Css
Understanding CSS and the Debugging Console
Understanding CSS and the Debugging Console
Developing Your Ultimate Package
Developing Your Ultimate Package
CSS Reset
CSS Reset
Implementing Awesome: An HTML5/CSS3 Workshop
Implementing Awesome: An HTML5/CSS3 Workshop
網頁程式設計
網頁程式設計
CSS Systems
CSS Systems
Similar a Make your website 2 times faster
Slow kinda sucks
Slow kinda sucks
Tim Wright
CSS and image optimization
CSS and image optimization
Stoyan Stefanov
Progressive downloads and rendering (Stoyan Stefanov)
Progressive downloads and rendering (Stoyan Stefanov)
Ontico
Frontend django, Django Web 前端探索
Frontend django, Django Web 前端探索
Tim (文昌)
快速开发Css
快速开发Css
tbmallf2e
About Best friends - HTML, CSS and JS
About Best friends - HTML, CSS and JS
Naga Harish M
Build Better Responsive websites. Hrvoje Jurišić
Build Better Responsive websites. Hrvoje Jurišić
MeetMagentoNY2014
디자인 패턴과 YUI를 이용해 Rich UI 빠르게 구현하기
디자인 패턴과 YUI를 이용해 Rich UI 빠르게 구현하기
Jinho Jung
EscConf - Deep Dive Frontend Optimization
EscConf - Deep Dive Frontend Optimization
Jonathan Klein
Progressive Downloads and Rendering
Progressive Downloads and Rendering
Stoyan Stefanov
Walk on the Client Side - Chris Mountford
Walk on the Client Side - Chris Mountford
Atlassian
HTML5 and CSS3 Techniques You Can Use Today
HTML5 and CSS3 Techniques You Can Use Today
Todd Anglin
建立前端開發團隊 - 2011 中華電信訓練所版
建立前端開發團隊 - 2011 中華電信訓練所版
Joseph Chiang
HTML5: Introduction
HTML5: Introduction
Guillermo Paz
Responsive content
Responsive content
honzie
面向测试的前端知识
面向测试的前端知识
chencheng 云谦
Html5 public
Html5 public
doodlemoonch
[heweb11] HTML5 Makeover
[heweb11] HTML5 Makeover
Christopher Schmitt
IBM Connect 2016 - AD1548 - Building Responsive XPages Applications
IBM Connect 2016 - AD1548 - Building Responsive XPages Applications
beglee
A High-Performance Solution To Microservices UI Composition
A High-Performance Solution To Microservices UI Composition
Alexey Gravanov
Similar a Make your website 2 times faster
(20)
Slow kinda sucks
Slow kinda sucks
CSS and image optimization
CSS and image optimization
Progressive downloads and rendering (Stoyan Stefanov)
Progressive downloads and rendering (Stoyan Stefanov)
Frontend django, Django Web 前端探索
Frontend django, Django Web 前端探索
快速开发Css
快速开发Css
About Best friends - HTML, CSS and JS
About Best friends - HTML, CSS and JS
Build Better Responsive websites. Hrvoje Jurišić
Build Better Responsive websites. Hrvoje Jurišić
디자인 패턴과 YUI를 이용해 Rich UI 빠르게 구현하기
디자인 패턴과 YUI를 이용해 Rich UI 빠르게 구현하기
EscConf - Deep Dive Frontend Optimization
EscConf - Deep Dive Frontend Optimization
Progressive Downloads and Rendering
Progressive Downloads and Rendering
Walk on the Client Side - Chris Mountford
Walk on the Client Side - Chris Mountford
HTML5 and CSS3 Techniques You Can Use Today
HTML5 and CSS3 Techniques You Can Use Today
建立前端開發團隊 - 2011 中華電信訓練所版
建立前端開發團隊 - 2011 中華電信訓練所版
HTML5: Introduction
HTML5: Introduction
Responsive content
Responsive content
面向测试的前端知识
面向测试的前端知识
Html5 public
Html5 public
[heweb11] HTML5 Makeover
[heweb11] HTML5 Makeover
IBM Connect 2016 - AD1548 - Building Responsive XPages Applications
IBM Connect 2016 - AD1548 - Building Responsive XPages Applications
A High-Performance Solution To Microservices UI Composition
A High-Performance Solution To Microservices UI Composition
Más de Satoshi Kikuchi
Foresee 見極めること
Foresee 見極めること
Satoshi Kikuchi
Responsive Web Design HTML5勉強会
Responsive Web Design HTML5勉強会
Satoshi Kikuchi
The State of Web Development
The State of Web Development
Satoshi Kikuchi
The State Of Web Development (data only)
The State Of Web Development (data only)
Satoshi Kikuchi
Html5 wh
Html5 wh
Satoshi Kikuchi
サルでもできるWebデザイン:SwapSkills
サルでもできるWebデザイン:SwapSkills
Satoshi Kikuchi
サルでもできるウェブデザイン : SwapSkills 2010 Vol01
サルでもできるウェブデザイン : SwapSkills 2010 Vol01
Satoshi Kikuchi
Html5 Loading
Html5 Loading
Satoshi Kikuchi
WDE08 State of the web
WDE08 State of the web
Satoshi Kikuchi
WDE08 BULLETPROOF A to Z
WDE08 BULLETPROOF A to Z
Satoshi Kikuchi
WDE08 Designing for interaction with Ajax
WDE08 Designing for interaction with Ajax
Satoshi Kikuchi
WDE08 Visualizing Web of Data
WDE08 Visualizing Web of Data
Satoshi Kikuchi
WDE09 State of The Web Japanese version
WDE09 State of The Web Japanese version
Satoshi Kikuchi
WDE09 state of the web panel discussion
WDE09 state of the web panel discussion
Satoshi Kikuchi
SwapSkills css3
SwapSkills css3
Satoshi Kikuchi
WDE09 The usability for Japan and overseas
WDE09 The usability for Japan and overseas
Satoshi Kikuchi
WDE08 CSS Reloaded Ja
WDE08 CSS Reloaded Ja
Satoshi Kikuchi
Más de Satoshi Kikuchi
(17)
Foresee 見極めること
Foresee 見極めること
Responsive Web Design HTML5勉強会
Responsive Web Design HTML5勉強会
The State of Web Development
The State of Web Development
The State Of Web Development (data only)
The State Of Web Development (data only)
Html5 wh
Html5 wh
サルでもできるWebデザイン:SwapSkills
サルでもできるWebデザイン:SwapSkills
サルでもできるウェブデザイン : SwapSkills 2010 Vol01
サルでもできるウェブデザイン : SwapSkills 2010 Vol01
Html5 Loading
Html5 Loading
WDE08 State of the web
WDE08 State of the web
WDE08 BULLETPROOF A to Z
WDE08 BULLETPROOF A to Z
WDE08 Designing for interaction with Ajax
WDE08 Designing for interaction with Ajax
WDE08 Visualizing Web of Data
WDE08 Visualizing Web of Data
WDE09 State of The Web Japanese version
WDE09 State of The Web Japanese version
WDE09 state of the web panel discussion
WDE09 state of the web panel discussion
SwapSkills css3
SwapSkills css3
WDE09 The usability for Japan and overseas
WDE09 The usability for Japan and overseas
WDE08 CSS Reloaded Ja
WDE08 CSS Reloaded Ja
Último
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
Rafal Los
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
Pixlogix Infotech
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
ThousandEyes
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Alan Dix
Slack Application Development 101 Slides
Slack Application Development 101 Slides
praypatel2
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptx
OnBoard
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
giselly40
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024
Scott Keck-Warren
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
naman860154
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
Ridwan Fadjar
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
shyamraj55
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
Results
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
Sinan KOZAK
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
Gabriella Davis
Google AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAG
Sujit Pal
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
Malak Abu Hammad
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
hans926745
How to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
naman860154
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
Delhi Call girls
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Miguel Araújo
Último
(20)
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
Understanding the Laravel MVC Architecture
Understanding the Laravel MVC Architecture
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Swan(sea) Song – personal research during my six years at Swansea ... and bey...
Slack Application Development 101 Slides
Slack Application Development 101 Slides
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptx
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
My Hashitalk Indonesia April 2024 Presentation
My Hashitalk Indonesia April 2024 Presentation
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
A Call to Action for Generative AI in 2024
A Call to Action for Generative AI in 2024
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
Google AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAG
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
How to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Make your website 2 times faster
1.
6 10
10 Apple Store Shinsaibashi
2.
3.
AOL Money &
Finance
4.
AOL Shopping
5.
Bing 50ms 200ms
-0.3% -0.4% 500 500ms -0.6% -1.2% -1.0% -0.9% 1200 1000ms -0.7% -0.9% -2.8% -1.9% -1.6% 1900 2000ms -1.8% -2.1% -4.3% -4.4% -3.8% 3100
6.
Google • • • UX •
Velocity09 Merissa Mayer
7.
Google
8.
shopzilla.com • 2.5 3.5sUP •
7 12%UP • PV 25%UP
9.
10.
6 1. 2. 3. httpRequest 4. Js
CSS 5. CSS 6.
11.
•
12.
Punyping
13.
Punyping
14.
Punyping 80KB
15.
Punyping
16.
Punyping
80KB 56KB
17.
Js CSS
18.
Js CSS
300ms <head> <link rel="stylesheet" type="text/css" href="stylesheet1.css" /> <script type="text/javascript" src="scriptfile1.js" /> <script type="text/javascript" src="scriptfile2.js" /> <link rel="stylesheet" type="text/css" href="stylesheet2.css" /> <link rel="stylesheet" type="text/css" href="stylesheet3.css" /> </head>
19.
Js CSS
200ms <head> <link rel="stylesheet" type="text/css" href="stylesheet1.css" /> <link rel="stylesheet" type="text/css" href="stylesheet2.css" /> <link rel="stylesheet" type="text/css" href="stylesheet3.css" /> <script type="text/javascript" src="scriptfile1.js" /> <script type="text/javascript" src="scriptfile2.js" /> </head>
20.
http • CSS Sprite •
Data URI • CSS
21.
CSS Sprite • background-position •
Http • Sprite
22.
CSS Sprite
23.
CSS Sprite
24.
CSS Sprite
25.
CSS Sprite http://ja.spritegen.website-performance.org/
26.
CSS Sprite
27.
CSS Sprite
28.
Data URI data
URI(RFC2397) inline image URI http IE6,7
29.
Data URI <img class=”data-uri” src=”data:image/ png;base64,....R0lGO” alt=””
/>
30.
Data URI <!--[if lt
IE 8]> <img src=”logo.png” alt=”” /> <![endif]--> <img class=”data-uri” src=”data:image/gif;base64,R0lGO” alt=”” />
31.
Webfonts
32.
Webfont @font-face {
font-family: Makiba; src: url(MakibaFont13.eot); /* IE */ src: local("Makiba"), /* webkit*/ url(MakibaFont13.ttf) format("truetype"); }
33.
Data URI
34.
CSS • ul li
a{......} • li a{......} • a{.......}
35.
CSS • ul li
a{......} • li a{......} • a{.......}
36.
CSS • ul li
a{......} • li a{......} • a{.......}
37.
CSS • ul#gloabal-navigation li
a{display:block;} • ul#footer-navigation li a{display:block;} • .navigation-link{display:block;}
38.
CSS
39.
CSS • •
40.
OOCSS
41.
OOCSS
CSS YUI Grid CSS OOCSS Grid CSS Nicole Sullivan Facebook
42.
OOCSS
43.
OOCSS unit line sizeXofY
44.
OOCSS OOCSS
45.
OOCSS
46.
47.
• Yslow !
- Firebug plugin • Google Page Speed - Firebug plugin • MS Fiddler - • AOL modsconcat - Apach • W3C linkchecker -
48.
49.
Yslow!
50.
W3C Link cheker
51.
52.
-moz-image-rendaring
53.
-moz-image-rendaring •Firefox 3.6 •auto •optimizeQuality •optimizeSpeed •-moz-crisp-edges
54.
-moz-image-rendaring img
{ image-rendering: optimizeSpeed; /* Firefox, (Gecko 1.9.2) */ -ms-interpolation-mode: nearest- neighbor; /* Internet Explorer 7.0+ */ } ‣IE7 ‣Firefox 3.6
55.
-moz-image-rendaring img[src$=".gif"]
{ image-rendering: -moz-crisp-edges; /* Fx, (Gecko 1.9.2) */ -ms-interpolation-mode: nearest- neighbor; /* IE 7+ */ }
56.
57.
11
11 13 OOCSS Nicole Sullivan