SlideShare uma empresa Scribd logo
1 de 38
Baixar para ler offline
FRONT-END
PERFORMANCE
DE 9 A 4 SEGUNDOS
André Tagliati
Mineiro criado no ES
perdido em São Paulo
PHP,Ruby,JS e mais...
Aquele que vos fala...
http://www.flickr.com/photos/buehlerphoto/4697025627/
http://www.flickr.com/photos/42931449@N07/6812481635/
O que temos pra hoje?
Chegando ao Front
Problemas
Soluções
Futuro
TIME IS MONEY
http://www.flickr.com/photos/76657755@N04/7214596024/
De frente com o front...
http://www.flickr.com/photos/sladesma/236604698/sizes/l/
O primeiro vilão...
http://www.flickr.com/photos/voorhorst/1422493685/
PAGE LOAD
Javascript benchmark
CSS & DOM Performance
Chega disso...
ESTA IMAGEM FOI CENSURADA POIS O AUTOR DA FOTO CONSIDEROU
SEU USO COMO SENDO COMERCIAL
Precisa disso tudo?
http://www.flickr.com/photos/75905404@N00/7126146307/sizes/h/in/photostream/
Pixels
Imagens
Html
Só o necessário...
http://www.flickr.com/photos/carsten_tb/8487467262/
Limpeza
http://www.flickr.com/photos/nevilzaveri/11836667816/
http://www.flickr.com/photos/26096026@N00/94012449
Espremer...
http://www.flickr.com/photos/antigavin/6072956388/
...automaticamente
CDN
http://www.flickr.com/photos/varresa/4153804623/
Suricato
Reorganizando
http://www.flickr.com/photos/acaben/62925785/
$.live
Mensurando
http://www.flickr.com/photos/filmingilman/5882785
Front end performance - dos 9 aos 4 segundos - Dafiti Tech Conference
https://docs.newrelic.com/docs/features/real-user-monitoring
Browser Trace
Front end performance - dos 9 aos 4 segundos - Dafiti Tech Conference
Front end performance - dos 9 aos 4 segundos - Dafiti Tech Conference
Front end performance - dos 9 aos 4 segundos - Dafiti Tech Conference
Controle de alterações
Estamos de olho
http://www.flickr.com/photos/91036147@N03/8271454655
Equipe
http://www.flickr.com/photos/goldberg/354577319/
Resultados
http://www.flickr.com/photos/umpcportal/3507739892/
Aos poucos
http://www.flickr.com/photos/carmyarmyofme/4657547742/
Planejamento
http://www.flickr.com/photos/malloy/195204215
Front end performance - dos 9 aos 4 segundos - Dafiti Tech Conference
rumo aos 2s
http://www.flickr.com/photos/giando/539618607/
HTML minificado
http://www.flickr.com/photos/marcovdz/4520986339/
inline CSS
https://www.flickr.com/photos/garon/2771991432/
http://www.flickr.com/photos/rich701/8110191369/
e muito mais
IE8 e sua performance:
http://www.tomshardware.com/reviews/windows-xp-web-browser-performance,3167-6.html
https://www.webkit.org/perf/sunspider-1.0.2/sunspider-1.0.2/driver.html
http://pivotal.github.io/jasmine/
https://developers.google.com/speed/
http://pivotal.github.io/jasmine/
https://docs.newrelic.com/docs/
http://glinden.blogspot.com.br/2006/11/marissa-mayer-at-web-20.html
Referências
Contatos
andre.tagliati@dafiti.com.br
@tagliati
http://www.flickr.com/photos/35237092540@N01/188700129/

Mais conteúdo relacionado

Destaque

BarCamp 2007 - CodeIgniter e OncologiaPediátrica.org
BarCamp 2007 - CodeIgniter e OncologiaPediátrica.orgBarCamp 2007 - CodeIgniter e OncologiaPediátrica.org
BarCamp 2007 - CodeIgniter e OncologiaPediátrica.orgjqrd
 
Infoeste 2014 - Desenvolvimento de um CMS com Codeigniter Framework(PHP)
Infoeste 2014 - Desenvolvimento de um CMS com Codeigniter Framework(PHP)Infoeste 2014 - Desenvolvimento de um CMS com Codeigniter Framework(PHP)
Infoeste 2014 - Desenvolvimento de um CMS com Codeigniter Framework(PHP)Rafael Oliveira
 
CodeIgniter - PHP MVC Framework by silicongulf.com
CodeIgniter - PHP MVC Framework by silicongulf.comCodeIgniter - PHP MVC Framework by silicongulf.com
CodeIgniter - PHP MVC Framework by silicongulf.comChristopher Cubos
 
Desenvolvimento web com CodeIgniter
Desenvolvimento web com CodeIgniterDesenvolvimento web com CodeIgniter
Desenvolvimento web com CodeIgniterPedro Junior
 
Apresentação: Pacotes de Serviços de Marketing Digital
 Apresentação: Pacotes de Serviços de Marketing Digital Apresentação: Pacotes de Serviços de Marketing Digital
Apresentação: Pacotes de Serviços de Marketing DigitalResultados Digitais
 
O que é inbound marketing?
O que é inbound marketing?O que é inbound marketing?
O que é inbound marketing?Rodrigo Souto
 
Internet das coisas - A revolução já começou
Internet das coisas - A revolução já começouInternet das coisas - A revolução já começou
Internet das coisas - A revolução já começouJose Wilker
 
Code Igniter & Zend Framework - Uma união de sucesso
Code Igniter & Zend Framework - Uma união de sucessoCode Igniter & Zend Framework - Uma união de sucesso
Code Igniter & Zend Framework - Uma união de sucessoJose Wilker
 

Destaque (9)

BarCamp 2007 - CodeIgniter e OncologiaPediátrica.org
BarCamp 2007 - CodeIgniter e OncologiaPediátrica.orgBarCamp 2007 - CodeIgniter e OncologiaPediátrica.org
BarCamp 2007 - CodeIgniter e OncologiaPediátrica.org
 
Infoeste 2014 - Desenvolvimento de um CMS com Codeigniter Framework(PHP)
Infoeste 2014 - Desenvolvimento de um CMS com Codeigniter Framework(PHP)Infoeste 2014 - Desenvolvimento de um CMS com Codeigniter Framework(PHP)
Infoeste 2014 - Desenvolvimento de um CMS com Codeigniter Framework(PHP)
 
CodeIgniter - PHP MVC Framework by silicongulf.com
CodeIgniter - PHP MVC Framework by silicongulf.comCodeIgniter - PHP MVC Framework by silicongulf.com
CodeIgniter - PHP MVC Framework by silicongulf.com
 
Desenvolvimento web com CodeIgniter
Desenvolvimento web com CodeIgniterDesenvolvimento web com CodeIgniter
Desenvolvimento web com CodeIgniter
 
Apresentação: Pacotes de Serviços de Marketing Digital
 Apresentação: Pacotes de Serviços de Marketing Digital Apresentação: Pacotes de Serviços de Marketing Digital
Apresentação: Pacotes de Serviços de Marketing Digital
 
Template: Inbound Marketing
Template: Inbound MarketingTemplate: Inbound Marketing
Template: Inbound Marketing
 
O que é inbound marketing?
O que é inbound marketing?O que é inbound marketing?
O que é inbound marketing?
 
Internet das coisas - A revolução já começou
Internet das coisas - A revolução já começouInternet das coisas - A revolução já começou
Internet das coisas - A revolução já começou
 
Code Igniter & Zend Framework - Uma união de sucesso
Code Igniter & Zend Framework - Uma união de sucessoCode Igniter & Zend Framework - Uma união de sucesso
Code Igniter & Zend Framework - Uma união de sucesso
 

Semelhante a Front end performance - dos 9 aos 4 segundos - Dafiti Tech Conference

In It Together: Co-Creating Your Content Strategy
In It Together: Co-Creating Your Content StrategyIn It Together: Co-Creating Your Content Strategy
In It Together: Co-Creating Your Content StrategySara Wachter-Boettcher
 
Creating User Friendly Joomla! Websites and Forms | Joomla! Day Deutschland
Creating User Friendly Joomla! Websites and Forms | Joomla! Day DeutschlandCreating User Friendly Joomla! Websites and Forms | Joomla! Day Deutschland
Creating User Friendly Joomla! Websites and Forms | Joomla! Day DeutschlandThemePartner
 
Don't be a Digital Dinosaur - Design for the Space Between
Don't be a Digital Dinosaur - Design for the Space BetweenDon't be a Digital Dinosaur - Design for the Space Between
Don't be a Digital Dinosaur - Design for the Space BetweenSamantha Starmer
 
Creating User Friendly Joomla! Websites and Forms [English]
Creating User Friendly Joomla! Websites and Forms [English]Creating User Friendly Joomla! Websites and Forms [English]
Creating User Friendly Joomla! Websites and Forms [English]ThemePartner
 
Eliminating barriers: No More Us vs. Them
Eliminating barriers: No More Us vs. ThemEliminating barriers: No More Us vs. Them
Eliminating barriers: No More Us vs. ThemAllison Pollard
 
The Future of Design is Not Just the Web - Web Visions Workshop 2011
The Future of Design is Not Just the Web - Web Visions Workshop 2011The Future of Design is Not Just the Web - Web Visions Workshop 2011
The Future of Design is Not Just the Web - Web Visions Workshop 2011Samantha Starmer
 
How To Demo Like A Demon
How To Demo Like A DemonHow To Demo Like A Demon
How To Demo Like A DemonDavid Crow
 
Fix price fix scope fix date-pecha_kuchas-journeeagile2014
Fix price fix scope fix date-pecha_kuchas-journeeagile2014Fix price fix scope fix date-pecha_kuchas-journeeagile2014
Fix price fix scope fix date-pecha_kuchas-journeeagile2014Gilles Scokart
 
Designing Cross Channel Experiences - MX 2011
Designing Cross Channel Experiences - MX 2011Designing Cross Channel Experiences - MX 2011
Designing Cross Channel Experiences - MX 2011Samantha Starmer
 
Arduino Project - Ciclo de palestras CEET Vasco Coutinho
Arduino Project - Ciclo de palestras CEET Vasco CoutinhoArduino Project - Ciclo de palestras CEET Vasco Coutinho
Arduino Project - Ciclo de palestras CEET Vasco CoutinhoAlmir Mendes
 
Rockstars & Consultants - who needs 'em
Rockstars & Consultants - who needs 'emRockstars & Consultants - who needs 'em
Rockstars & Consultants - who needs 'emLori Olson
 
JavaScript with Adobe applications - Acceleration web development!
JavaScript with Adobe applications - Acceleration web development!JavaScript with Adobe applications - Acceleration web development!
JavaScript with Adobe applications - Acceleration web development!shinobu tsutsui
 
Up close and personal - Future of Digital 2010
Up close and personal - Future of Digital 2010Up close and personal - Future of Digital 2010
Up close and personal - Future of Digital 2010Rob Manson
 
Designing for the Teenage Market
Designing for the Teenage MarketDesigning for the Teenage Market
Designing for the Teenage MarketJack Franklin
 
It's Business Time: Givin' User Experience Love with CSS3
It's Business Time: Givin' User Experience Love with CSS3It's Business Time: Givin' User Experience Love with CSS3
It's Business Time: Givin' User Experience Love with CSS3Denise Jacobs
 
Make Stuff People Can Use - Agile Alliance 2010
Make Stuff People Can Use - Agile Alliance 2010Make Stuff People Can Use - Agile Alliance 2010
Make Stuff People Can Use - Agile Alliance 2010Samantha Starmer
 
Presentation Design and Delivery Tips
Presentation Design and Delivery TipsPresentation Design and Delivery Tips
Presentation Design and Delivery Tipssdeherder
 

Semelhante a Front end performance - dos 9 aos 4 segundos - Dafiti Tech Conference (20)

In It Together: Co-Creating Your Content Strategy
In It Together: Co-Creating Your Content StrategyIn It Together: Co-Creating Your Content Strategy
In It Together: Co-Creating Your Content Strategy
 
Creating User Friendly Joomla! Websites and Forms | Joomla! Day Deutschland
Creating User Friendly Joomla! Websites and Forms | Joomla! Day DeutschlandCreating User Friendly Joomla! Websites and Forms | Joomla! Day Deutschland
Creating User Friendly Joomla! Websites and Forms | Joomla! Day Deutschland
 
Don't be a Digital Dinosaur - Design for the Space Between
Don't be a Digital Dinosaur - Design for the Space BetweenDon't be a Digital Dinosaur - Design for the Space Between
Don't be a Digital Dinosaur - Design for the Space Between
 
Creating User Friendly Joomla! Websites and Forms [English]
Creating User Friendly Joomla! Websites and Forms [English]Creating User Friendly Joomla! Websites and Forms [English]
Creating User Friendly Joomla! Websites and Forms [English]
 
Eliminating barriers: No More Us vs. Them
Eliminating barriers: No More Us vs. ThemEliminating barriers: No More Us vs. Them
Eliminating barriers: No More Us vs. Them
 
The Future of Design is Not Just the Web - Web Visions Workshop 2011
The Future of Design is Not Just the Web - Web Visions Workshop 2011The Future of Design is Not Just the Web - Web Visions Workshop 2011
The Future of Design is Not Just the Web - Web Visions Workshop 2011
 
How To Demo Like A Demon
How To Demo Like A DemonHow To Demo Like A Demon
How To Demo Like A Demon
 
Fix price fix scope fix date-pecha_kuchas-journeeagile2014
Fix price fix scope fix date-pecha_kuchas-journeeagile2014Fix price fix scope fix date-pecha_kuchas-journeeagile2014
Fix price fix scope fix date-pecha_kuchas-journeeagile2014
 
Designing Cross Channel Experiences - MX 2011
Designing Cross Channel Experiences - MX 2011Designing Cross Channel Experiences - MX 2011
Designing Cross Channel Experiences - MX 2011
 
Arduino Project
Arduino ProjectArduino Project
Arduino Project
 
Arduino Project - Ciclo de palestras CEET Vasco Coutinho
Arduino Project - Ciclo de palestras CEET Vasco CoutinhoArduino Project - Ciclo de palestras CEET Vasco Coutinho
Arduino Project - Ciclo de palestras CEET Vasco Coutinho
 
Rockstars & Consultants - who needs 'em
Rockstars & Consultants - who needs 'emRockstars & Consultants - who needs 'em
Rockstars & Consultants - who needs 'em
 
JavaScript with Adobe applications - Acceleration web development!
JavaScript with Adobe applications - Acceleration web development!JavaScript with Adobe applications - Acceleration web development!
JavaScript with Adobe applications - Acceleration web development!
 
Up close and personal - Future of Digital 2010
Up close and personal - Future of Digital 2010Up close and personal - Future of Digital 2010
Up close and personal - Future of Digital 2010
 
Designing for the Teenage Market
Designing for the Teenage MarketDesigning for the Teenage Market
Designing for the Teenage Market
 
Technical Introduction to YDN
Technical Introduction to YDNTechnical Introduction to YDN
Technical Introduction to YDN
 
It's Business Time: Givin' User Experience Love with CSS3
It's Business Time: Givin' User Experience Love with CSS3It's Business Time: Givin' User Experience Love with CSS3
It's Business Time: Givin' User Experience Love with CSS3
 
Bestpracticeforux
BestpracticeforuxBestpracticeforux
Bestpracticeforux
 
Make Stuff People Can Use - Agile Alliance 2010
Make Stuff People Can Use - Agile Alliance 2010Make Stuff People Can Use - Agile Alliance 2010
Make Stuff People Can Use - Agile Alliance 2010
 
Presentation Design and Delivery Tips
Presentation Design and Delivery TipsPresentation Design and Delivery Tips
Presentation Design and Delivery Tips
 

Último

Check out the Free Landing Page Hosting in 2024
Check out the Free Landing Page Hosting in 2024Check out the Free Landing Page Hosting in 2024
Check out the Free Landing Page Hosting in 2024Shubham Pant
 
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASSLESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASSlesteraporado16
 
Introduction to ICANN and Fellowship program by Shreedeep Rayamajhi.pdf
Introduction to ICANN and Fellowship program  by Shreedeep Rayamajhi.pdfIntroduction to ICANN and Fellowship program  by Shreedeep Rayamajhi.pdf
Introduction to ICANN and Fellowship program by Shreedeep Rayamajhi.pdfShreedeep Rayamajhi
 
Computer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteComputer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteMavein
 
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced HorizonsVision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced HorizonsRoxana Stingu
 
Zero-day Vulnerabilities
Zero-day VulnerabilitiesZero-day Vulnerabilities
Zero-day Vulnerabilitiesalihassaah1994
 
Presentation2.pptx - JoyPress Wordpress
Presentation2.pptx -  JoyPress WordpressPresentation2.pptx -  JoyPress Wordpress
Presentation2.pptx - JoyPress Wordpressssuser166378
 
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...APNIC
 
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdfLESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdfmchristianalwyn
 
Bio Medical Waste Management Guideliness 2023 ppt.pptx
Bio Medical Waste Management Guideliness 2023 ppt.pptxBio Medical Waste Management Guideliness 2023 ppt.pptx
Bio Medical Waste Management Guideliness 2023 ppt.pptxnaveenithkrishnan
 
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDSTYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDSedrianrheine
 
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024Jan Löffler
 

Último (12)

Check out the Free Landing Page Hosting in 2024
Check out the Free Landing Page Hosting in 2024Check out the Free Landing Page Hosting in 2024
Check out the Free Landing Page Hosting in 2024
 
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASSLESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
LESSON 10/ GROUP 10/ ST. THOMAS AQUINASS
 
Introduction to ICANN and Fellowship program by Shreedeep Rayamajhi.pdf
Introduction to ICANN and Fellowship program  by Shreedeep Rayamajhi.pdfIntroduction to ICANN and Fellowship program  by Shreedeep Rayamajhi.pdf
Introduction to ICANN and Fellowship program by Shreedeep Rayamajhi.pdf
 
Computer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a WebsiteComputer 10 Lesson 8: Building a Website
Computer 10 Lesson 8: Building a Website
 
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced HorizonsVision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
Vision Forward: Tracing Image Search SEO From Its Roots To AI-Enhanced Horizons
 
Zero-day Vulnerabilities
Zero-day VulnerabilitiesZero-day Vulnerabilities
Zero-day Vulnerabilities
 
Presentation2.pptx - JoyPress Wordpress
Presentation2.pptx -  JoyPress WordpressPresentation2.pptx -  JoyPress Wordpress
Presentation2.pptx - JoyPress Wordpress
 
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
Benefits of doing Internet peering and running an Internet Exchange (IX) pres...
 
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdfLESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
LESSON 5 GROUP 10 ST. THOMAS AQUINAS.pdf
 
Bio Medical Waste Management Guideliness 2023 ppt.pptx
Bio Medical Waste Management Guideliness 2023 ppt.pptxBio Medical Waste Management Guideliness 2023 ppt.pptx
Bio Medical Waste Management Guideliness 2023 ppt.pptx
 
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDSTYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
TYPES AND DEFINITION OF ONLINE CRIMES AND HAZARDS
 
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
WordPress by the numbers - Jan Loeffler, CTO WebPros, CloudFest 2024
 

Front end performance - dos 9 aos 4 segundos - Dafiti Tech Conference