SlideShare uma empresa Scribd logo
A WEB MOBILE
!
OTIMIZAÇÕES E DESAFIOS
DE PERFORMANCE
@sergio_caelum
sergiolopes.org
sergiolopes.org
sergiolopes.org
74% DOS USUÁRIOS
FALAM QUE ABANDONAM O SITE
MOBILE DEPOIS DE 5s DE ESPERA
85% DOS USUÁRIOS
ESPERAM QUE UM SITE ABRA NO CELULAR
TÃO OU MAIS RÁPIDO QUE NO DESKTOP
OTIMIZAÇÕES WEB 101
OTIMIZAÇÕES WEB 101
CONCATENAR CSS / JS
OTIMIZAÇÕES WEB 101
MINIFICAR CSS / JS
CONCATENAR CSS / JS
OTIMIZAÇÕES WEB 101
CACHE / EXPIRES
MINIFICAR CSS / JS
CONCATENAR CSS / JS
OTIMIZAÇÕES WEB 101
CACHE / EXPIRES
MINIFICAR CSS / JS
SPRITES CONCATENAR CSS / JS
OTIMIZAÇÕES WEB 101
CACHE / EXPIRES
MINIFICAR CSS / JS
SPRITES CONCATENAR CSS / JS
JS EMBAIXO
OTIMIZAÇÕES WEB 101
CACHE / EXPIRES
MINIFICAR CSS / JS
SPRITES CONCATENAR CSS / JS
JS EMBAIXO
CSS NO TOPO
OTIMIZAÇÕES WEB 101
GZIP
CACHE / EXPIRES
MINIFICAR CSS / JS
SPRITES CONCATENAR CSS / JS
JS EMBAIXO
CSS NO TOPO
OTIMIZAÇÕES WEB 101
GZIP
CACHE / EXPIRES
MINIFICAR CSS / JS
SPRITES CONCATENAR CSS / JS
JS EMBAIXO
CSS NO TOPO
LAZY-LOAD
OTIMIZAÇÕES WEB 101
GZIP
CACHE / EXPIRES
MINIFICAR CSS / JS
SPRITES CONCATENAR CSS / JS
JS EMBAIXO
CSS NO TOPO
LAZY-LOAD ASSÍNCRONO
#mobileperf
GARGALOS
MOBILE
GARGALOS
MOBILE
GARGALOS
MOBILE
GARGALOS
MOBILE
GARGALOS
MOBILE
GARGALOS
MOBILE
REDE
largura de banda
&
latência (RTT)
NY
SP
NY
SP
7648km
NY
SP
7648km
299,792458km/ms
NY
SP
NY
SP
NY
SP
25,5 ms
NY
SP
NY
SP
RTT ideal = 51 ms
Otimizações de Performance Web: Desafios do Mundo Mobile
DNS
lookup
!
1 RTT
TCP
handshake
!
1 RTT
TLS
handshake
!
1-2 RTT
HTTP
request
!
> 1 RTT
latência de
redes móveis
Otimizações de Performance Web: Desafios do Mundo Mobile
Otimizações de Performance Web: Desafios do Mundo Mobile
Otimizações de Performance Web: Desafios do Mundo Mobile
Otimizações de Performance Web: Desafios do Mundo Mobile
Otimizações de Performance Web: Desafios do Mundo Mobile
WI-FI
Mac
WI-FI
celular
3G
quente
3G
frio
2G
quente
2G
frio
SP 12ms 38ms 88ms 212ms 472ms 622ms
NY 139ms 300ms
0
800
1600
2400
3200
1 Mbps 2 Mbps 3 Mbps 4 Mbps 5 Mbps 6 Mbps 7 Mbps 8 Mpbs 9 Mbps 10 Mbps
TEMPO DE CARREGAMENTO DA PÁGINA
vs LARGURA DE BANDA
0
1000
2000
3000
4000
240ms 220ms 200ms 180ms 160ms 140ms 120ms 100ms 80ms 60ms 40ms 20ms 0ms
TEMPO DE CARREGAMENTO DA PÁGINA
vs LATÊNCIA (RTT)
BATERIA
WI-FI - 30 ~200 mW
3G - 1000 ~ 3500 mW
RRCRadio Resource Controller
zzz
zzzidle
15 mW
zzzidle
15 mW
!!!!
zzzidle
15 mW
connected
1000 ~ 3500 mW
!!!!
DNS
lookup
!
1 RTT
TCP
handshake
!
1 RTT
TLS
handshake
!
1-2 RTT
HTTP
request
!
> 1 RTT
RRC
negociação
!
200 ~ 2500ms
DNS
lookup
!
1 RTT
TCP
handshake
!
1 RTT
TLS
handshake
!
1-2 RTT
HTTP
request
!
> 1 RTT
4G - LTE
3.5G -HSPA+
3G -UMTS,HSPA
2G -EDGE,GPRS
4G - 300 Mbit/s
3.5G -168 Mbit/s
3G -14 Mbit/s
2G -384 Kbit/s
4G - 5 Mbit/s
3.5G -1.5 Mbit/s
3G -0.5 Mbit/s
valores máximos em contrato dos
planos atuais da Vivo em SP*
4G - <100ms
3.5G -<100ms
3G -100 ~ 500 ms
2G -300 ~ 1000 ms
OTIMIZAÇÕES
conteúdo
mais próximo
do usuário
conteúdo
mais próximo
do usuário
CDNs
content delivery network
CDNs
content delivery network
DIMINUIR # REQUESTS
concatenar JS e CSS
usar sprites
cachear recursos
!(display:none em <img>)
SEM REDIRECTS
SEM REDIRECTS
POLLING
É DO MAL
LAZY-LOAD
JÁ ERA
PRELOAD
É O QUE HÁ
<link rel="prefetch" href="imagem.jpg">
<link rel="prefetch" href="imagem.jpg">
<link rel="dns-prefetch" 	
href="http://sergiolopes.org">
<link rel="prefetch" href="imagem.jpg">
<link rel="subresource" href="imagem.jpg">
<link rel="dns-prefetch" 	
href="http://sergiolopes.org">
<link rel="prefetch" href="imagem.jpg">
<link rel="subresource" href="imagem.jpg">
<link rel="prerender" href="/confirma/">	
<link rel="dns-prefetch" 	
href="http://sergiolopes.org">
por trás do TCP
browser server
SYN
browser server
SYN
SYN ACK
browser server
SYN
SYN ACK
ACK
GET /
browser server
SYN
SYN ACK
ACK
GET /
4x TCP seg.
browser server
processamento
SYN
SYN ACK
ACK
GET /
4x TCP seg. ~5.8 KB
browser server
processamento
SYN
SYN ACK
ACK
GET /
4x TCP seg.
4x ACK
~5.8 KB
browser server
processamento
SYN
SYN ACK
ACK
GET /
4x TCP seg.
4x ACK
8x ACK
8x TCP seg.
~5.8 KB
~11.6 KB
...
browser server
processamento
SYN
SYN ACK
ACK
GET /
4x TCP seg.
4x ACK
8x ACK
8x TCP seg.
~5.8 KB
~11.6 KB
...
browser server
processamento
Connection: Keep-Alive
SYN
SYN ACK
ACK
GET /
4x TCP seg.
4x ACK
8x ACK
8x TCP seg.
~5.8 KB
~11.6 KB
...
browser server
processamento
parado...
flush early
Java: response.flushBuffer();	
.NET: Response.Flush();	
PHP: <?php flush(); ?>
SYN
SYN ACK
ACK
GET /
4x TCP seg.
4x ACK
8x ACK
8x TCP seg.
~5.8 KB
~11.6 KB
...
browser server
processamento
cwnd AW10
10-packet TCP congestion window
http://bit.ly/1pspHaP
http://bit.ly/1pspHaP
http://bit.ly/1pspHaP
http://bit.ly/1pspHaP
http://bit.ly/1pspHaP
CRITICAL RENDERING PATH
Otimizações de Performance Web: Desafios do Mundo Mobile
NUNCA
ESCREVA JS QUE
BLOQUEIE RENDER
http://slidesha.re/1tuMgcs
<script src="script.js" async></script>
CSSTAMBÉM
BLOQUEIA
RENDERIZAÇÃO
Otimizações de Performance Web: Desafios do Mundo Mobile
Otimizações de Performance Web: Desafios do Mundo Mobile
~600px
~600px
~9000px
~600px
~9000px
ABOVE THE FOLD
(ATF)
1 RTT
ATF
RENDER
Otimizações de Performance Web: Desafios do Mundo Mobile
inline do CSS ATF
inline do CSS ATF
inline do JS ATF
inline do CSS ATF
inline do JS ATF
flush ATF
< 14 KB (cwnd aw10)
inline do CSS ATF
inline do JS ATF
flush ATF
< 14 KB (cwnd aw10)
inline do CSS ATF
inline do JS ATF
flush ATF
resto do CSS e JS tudo async
Otimizações de Performance Web: Desafios do Mundo Mobile
RENDERIZAÇÃO
EVITE
FRAMEWORKS
PESADOS
& SUBUTILIZADOS
QUEBRE
JS PESADO
setImmediate
requestAnimationFrame
Web Workers
setImmediate(function(){	
// pedaço de processo longo	
});
requestAnimationFrame(function(){	
// quadro de animação	
});
animações na
GPU com CSS3
.fadeout {	
opacity: 0;	
transition: opacity 2s ease;	
}
cuidado com
elementos caros
box-shadow / gradient / SVG / data-uri
TESTES,
ANÁLISES
&
TRADEOFFs
Otimizações de Performance Web: Desafios do Mundo Mobile
Otimizações de Performance Web: Desafios do Mundo Mobile
RUM
Real User Monitoring
Otimizações de Performance Web: Desafios do Mundo Mobile
BÔNUS:
INTERFACE
PERFORMÁTICA
delay de 300 ms no click
interface instantânea & sync em bg
LATÊNCIA
REDES MÓVEIS
HTTP
CRITICAL PATH
RENDERIZAÇÃO
TESTES
TRADEOFFS
A WEB MOBILE
!
OTIMIZAÇÕES E DESAFIOS
DE PERFORMANCE
OBRIGADO!
sergiolopes.org @sergio_caelum

Mais conteúdo relacionado

Mais procurados

Como Perder Peso (no browser)
Como Perder Peso (no browser)Como Perder Peso (no browser)
Como Perder Peso (no browser)
Zeno Rocha
 
SASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-endSASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-end
Anderson Aguiar
 
Frontend (Rails For Kids)
Frontend (Rails For Kids)Frontend (Rails For Kids)
Frontend (Rails For Kids)
Daniel Lopes
 
Performance e boas_praticas_de_web
Performance e boas_praticas_de_webPerformance e boas_praticas_de_web
Performance e boas_praticas_de_web
Thiago Verly
 
Vue.js
Vue.jsVue.js
Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Performance - Acelere seu site! Na web tempo é mais que dinheiro.Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Gustavo Corrêa Alves
 
[JS EXPERIENCE 2018] Gerenciando o fluxo assincrono de operações Javascript -...
[JS EXPERIENCE 2018] Gerenciando o fluxo assincrono de operações Javascript -...[JS EXPERIENCE 2018] Gerenciando o fluxo assincrono de operações Javascript -...
[JS EXPERIENCE 2018] Gerenciando o fluxo assincrono de operações Javascript -...
iMasters
 
Novidades do ASP.NET Core 2.1
Novidades do ASP.NET Core 2.1Novidades do ASP.NET Core 2.1
Novidades do ASP.NET Core 2.1
Rodrigo Kono
 
Desempenho web
Desempenho webDesempenho web
PhantomJS - O Fantasminha Camarada
PhantomJS - O Fantasminha CamaradaPhantomJS - O Fantasminha Camarada
PhantomJS - O Fantasminha Camarada
Henrique Gogó
 
Frontline - Rails3.1
Frontline - Rails3.1Frontline - Rails3.1
Frontline - Rails3.1
Daniel Lopes
 
Segredos não ditos de PWA - muito além do Web App Manifest
Segredos não ditos de PWA - muito além do Web App ManifestSegredos não ditos de PWA - muito além do Web App Manifest
Segredos não ditos de PWA - muito além do Web App Manifest
Eduardo Matos
 
Object width
Object widthObject width
Object width
Joao Ferreira
 
Aprendendo a Aprender
Aprendendo a AprenderAprendendo a Aprender
Aprendendo a Aprender
Alexandre Gomes
 
Aplicações Web TV no Meo
Aplicações Web TV no MeoAplicações Web TV no Meo
Aplicações Web TV no Meo
codebits
 
Vue.js Summit 2018 - Do Server-Side Rendering ao Nuxt
Vue.js Summit 2018 - Do Server-Side Rendering ao NuxtVue.js Summit 2018 - Do Server-Side Rendering ao Nuxt
Vue.js Summit 2018 - Do Server-Side Rendering ao Nuxt
Erick Petrucelli
 
Frontend (RailsMG)
Frontend (RailsMG)Frontend (RailsMG)
Frontend (RailsMG)
Daniel Lopes
 
Vue.js - o framework progressivo
Vue.js - o framework progressivoVue.js - o framework progressivo
Vue.js - o framework progressivo
Vinicius Reis
 
Jdk
JdkJdk
It's Javascript Time
It's Javascript TimeIt's Javascript Time
It's Javascript Time
Davidson Fellipe
 

Mais procurados (20)

Como Perder Peso (no browser)
Como Perder Peso (no browser)Como Perder Peso (no browser)
Como Perder Peso (no browser)
 
SASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-endSASS + COMPASS - Alta Produtividade no Front-end
SASS + COMPASS - Alta Produtividade no Front-end
 
Frontend (Rails For Kids)
Frontend (Rails For Kids)Frontend (Rails For Kids)
Frontend (Rails For Kids)
 
Performance e boas_praticas_de_web
Performance e boas_praticas_de_webPerformance e boas_praticas_de_web
Performance e boas_praticas_de_web
 
Vue.js
Vue.jsVue.js
Vue.js
 
Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Performance - Acelere seu site! Na web tempo é mais que dinheiro.Performance - Acelere seu site! Na web tempo é mais que dinheiro.
Performance - Acelere seu site! Na web tempo é mais que dinheiro.
 
[JS EXPERIENCE 2018] Gerenciando o fluxo assincrono de operações Javascript -...
[JS EXPERIENCE 2018] Gerenciando o fluxo assincrono de operações Javascript -...[JS EXPERIENCE 2018] Gerenciando o fluxo assincrono de operações Javascript -...
[JS EXPERIENCE 2018] Gerenciando o fluxo assincrono de operações Javascript -...
 
Novidades do ASP.NET Core 2.1
Novidades do ASP.NET Core 2.1Novidades do ASP.NET Core 2.1
Novidades do ASP.NET Core 2.1
 
Desempenho web
Desempenho webDesempenho web
Desempenho web
 
PhantomJS - O Fantasminha Camarada
PhantomJS - O Fantasminha CamaradaPhantomJS - O Fantasminha Camarada
PhantomJS - O Fantasminha Camarada
 
Frontline - Rails3.1
Frontline - Rails3.1Frontline - Rails3.1
Frontline - Rails3.1
 
Segredos não ditos de PWA - muito além do Web App Manifest
Segredos não ditos de PWA - muito além do Web App ManifestSegredos não ditos de PWA - muito além do Web App Manifest
Segredos não ditos de PWA - muito além do Web App Manifest
 
Object width
Object widthObject width
Object width
 
Aprendendo a Aprender
Aprendendo a AprenderAprendendo a Aprender
Aprendendo a Aprender
 
Aplicações Web TV no Meo
Aplicações Web TV no MeoAplicações Web TV no Meo
Aplicações Web TV no Meo
 
Vue.js Summit 2018 - Do Server-Side Rendering ao Nuxt
Vue.js Summit 2018 - Do Server-Side Rendering ao NuxtVue.js Summit 2018 - Do Server-Side Rendering ao Nuxt
Vue.js Summit 2018 - Do Server-Side Rendering ao Nuxt
 
Frontend (RailsMG)
Frontend (RailsMG)Frontend (RailsMG)
Frontend (RailsMG)
 
Vue.js - o framework progressivo
Vue.js - o framework progressivoVue.js - o framework progressivo
Vue.js - o framework progressivo
 
Jdk
JdkJdk
Jdk
 
It's Javascript Time
It's Javascript TimeIt's Javascript Time
It's Javascript Time
 

Destaque

Wsrest 2013
Wsrest 2013Wsrest 2013
Wsrest 2013
Caelum
 
Performance Web além do carregamento
Performance Web além do carregamentoPerformance Web além do carregamento
Performance Web além do carregamento
Caelum
 
Porque você deveria usar CDI nos seus projetos Java! - JavaOne LA 2012 - Sérg...
Porque você deveria usar CDI nos seus projetos Java! - JavaOne LA 2012 - Sérg...Porque você deveria usar CDI nos seus projetos Java! - JavaOne LA 2012 - Sérg...
Porque você deveria usar CDI nos seus projetos Java! - JavaOne LA 2012 - Sérg...
Caelum
 
All you need to know about JavaScript loading and execution in the browser - ...
All you need to know about JavaScript loading and execution in the browser - ...All you need to know about JavaScript loading and execution in the browser - ...
All you need to know about JavaScript loading and execution in the browser - ...
Caelum
 
Otimizando o time to market - do zero a produção em poucas iterações
Otimizando o time to market - do zero a produção em poucas iteraçõesOtimizando o time to market - do zero a produção em poucas iterações
Otimizando o time to market - do zero a produção em poucas iterações
Caelum
 
Design Responsivo por uma Web única
Design Responsivo por uma Web únicaDesign Responsivo por uma Web única
Design Responsivo por uma Web única
Caelum
 
Os Caminhos de uma Estratégia Mobile
Os Caminhos de uma Estratégia MobileOs Caminhos de uma Estratégia Mobile
Os Caminhos de uma Estratégia Mobile
Caelum
 
Desafios de Performance Web - BrazilJS
Desafios de Performance Web - BrazilJSDesafios de Performance Web - BrazilJS
Desafios de Performance Web - BrazilJS
Caelum
 
Performance na web: o modelo RAIL e outras novidades
Performance na web: o modelo RAIL e outras novidadesPerformance na web: o modelo RAIL e outras novidades
Performance na web: o modelo RAIL e outras novidades
Caelum
 
[QCon 2011] Por uma web mais rápida: técnicas de otimização de Sites
[QCon 2011] Por uma web mais rápida: técnicas de otimização de Sites[QCon 2011] Por uma web mais rápida: técnicas de otimização de Sites
[QCon 2011] Por uma web mais rápida: técnicas de otimização de Sites
Caelum
 

Destaque (10)

Wsrest 2013
Wsrest 2013Wsrest 2013
Wsrest 2013
 
Performance Web além do carregamento
Performance Web além do carregamentoPerformance Web além do carregamento
Performance Web além do carregamento
 
Porque você deveria usar CDI nos seus projetos Java! - JavaOne LA 2012 - Sérg...
Porque você deveria usar CDI nos seus projetos Java! - JavaOne LA 2012 - Sérg...Porque você deveria usar CDI nos seus projetos Java! - JavaOne LA 2012 - Sérg...
Porque você deveria usar CDI nos seus projetos Java! - JavaOne LA 2012 - Sérg...
 
All you need to know about JavaScript loading and execution in the browser - ...
All you need to know about JavaScript loading and execution in the browser - ...All you need to know about JavaScript loading and execution in the browser - ...
All you need to know about JavaScript loading and execution in the browser - ...
 
Otimizando o time to market - do zero a produção em poucas iterações
Otimizando o time to market - do zero a produção em poucas iteraçõesOtimizando o time to market - do zero a produção em poucas iterações
Otimizando o time to market - do zero a produção em poucas iterações
 
Design Responsivo por uma Web única
Design Responsivo por uma Web únicaDesign Responsivo por uma Web única
Design Responsivo por uma Web única
 
Os Caminhos de uma Estratégia Mobile
Os Caminhos de uma Estratégia MobileOs Caminhos de uma Estratégia Mobile
Os Caminhos de uma Estratégia Mobile
 
Desafios de Performance Web - BrazilJS
Desafios de Performance Web - BrazilJSDesafios de Performance Web - BrazilJS
Desafios de Performance Web - BrazilJS
 
Performance na web: o modelo RAIL e outras novidades
Performance na web: o modelo RAIL e outras novidadesPerformance na web: o modelo RAIL e outras novidades
Performance na web: o modelo RAIL e outras novidades
 
[QCon 2011] Por uma web mais rápida: técnicas de otimização de Sites
[QCon 2011] Por uma web mais rápida: técnicas de otimização de Sites[QCon 2011] Por uma web mais rápida: técnicas de otimização de Sites
[QCon 2011] Por uma web mais rápida: técnicas de otimização de Sites
 

Semelhante a Otimizações de Performance Web: Desafios do Mundo Mobile

Web Performance Client Side
Web Performance Client SideWeb Performance Client Side
Web Performance Client Side
Levy Carneiro Jr.
 
Dicas para Turbinar o servidor de Aplicações JBoss 7
Dicas para Turbinar o servidor de Aplicações JBoss 7Dicas para Turbinar o servidor de Aplicações JBoss 7
Dicas para Turbinar o servidor de Aplicações JBoss 7
Claudio Miranda
 
Performance Front-end
Performance Front-endPerformance Front-end
Performance Front-end
Descomplica
 
Aplicações web realtime
Aplicações web realtimeAplicações web realtime
Aplicações web realtime
Fabio Janiszevski
 
Hacking em consoles webs de security appliances, h2hc-rev-2
Hacking em consoles webs de security appliances, h2hc-rev-2Hacking em consoles webs de security appliances, h2hc-rev-2
Hacking em consoles webs de security appliances, h2hc-rev-2
William Costa
 
Hibernate efetivo (IA-2014 / Disturbing the Mind)
Hibernate efetivo (IA-2014 / Disturbing the Mind)Hibernate efetivo (IA-2014 / Disturbing the Mind)
Hibernate efetivo (IA-2014 / Disturbing the Mind)
Rafael Ponte
 
Rest Teoria E Pratica
Rest Teoria E PraticaRest Teoria E Pratica
Rest Teoria E Pratica
Sergio Azevedo
 
VRaptor - Ciclo CASIN 2011
VRaptor - Ciclo CASIN 2011VRaptor - Ciclo CASIN 2011
VRaptor - Ciclo CASIN 2011
Daniel Kist
 
Arquiteturas de referência MySQL
Arquiteturas de referência MySQLArquiteturas de referência MySQL
Arquiteturas de referência MySQL
MySQL Brasil
 
o nome disso é performance
o nome disso é performanceo nome disso é performance
o nome disso é performance
Pedro Polisenso
 
Jee6
Jee6Jee6
Do Rest Ao Restfull - Rio Jug
Do Rest Ao Restfull - Rio JugDo Rest Ao Restfull - Rio Jug
Do Rest Ao Restfull - Rio Jug
Sergio Azevedo
 
Projetos Webs Complexos - Como funciona os sites de E-commerce Americanas.Com...
Projetos Webs Complexos - Como funciona os sites de E-commerce Americanas.Com...Projetos Webs Complexos - Como funciona os sites de E-commerce Americanas.Com...
Projetos Webs Complexos - Como funciona os sites de E-commerce Americanas.Com...
Dell Technologies
 
Webstandards - Melhores práticas para construção de páginas web
Webstandards - Melhores práticas para construção de páginas webWebstandards - Melhores práticas para construção de páginas web
Webstandards - Melhores práticas para construção de páginas web
Cleo Morgause
 
Html5
Html5Html5
Portando sua aplicação web para iphone
Portando sua aplicação web para iphonePortando sua aplicação web para iphone
Portando sua aplicação web para iphone
Renato Nitta
 
InterCon 2017 - Segredos não ditos de PWA - muito além do Web App Manifest - ...
InterCon 2017 - Segredos não ditos de PWA - muito além do Web App Manifest - ...InterCon 2017 - Segredos não ditos de PWA - muito além do Web App Manifest - ...
InterCon 2017 - Segredos não ditos de PWA - muito além do Web App Manifest - ...
iMasters
 
Speed up! Critical css to the rescue
Speed up! Critical css to the rescueSpeed up! Critical css to the rescue
Speed up! Critical css to the rescue
melidevelopers
 
Conheça o Sass, mehor amigo do seu CSS - Nayara Felix
Conheça o Sass, mehor amigo do seu CSS - Nayara FelixConheça o Sass, mehor amigo do seu CSS - Nayara Felix
Conheça o Sass, mehor amigo do seu CSS - Nayara Felix
Nayara Felix
 
Por que investir em performance Front-End?
Por que investir em performance Front-End?Por que investir em performance Front-End?
Por que investir em performance Front-End?
Luiz Oliveira
 

Semelhante a Otimizações de Performance Web: Desafios do Mundo Mobile (20)

Web Performance Client Side
Web Performance Client SideWeb Performance Client Side
Web Performance Client Side
 
Dicas para Turbinar o servidor de Aplicações JBoss 7
Dicas para Turbinar o servidor de Aplicações JBoss 7Dicas para Turbinar o servidor de Aplicações JBoss 7
Dicas para Turbinar o servidor de Aplicações JBoss 7
 
Performance Front-end
Performance Front-endPerformance Front-end
Performance Front-end
 
Aplicações web realtime
Aplicações web realtimeAplicações web realtime
Aplicações web realtime
 
Hacking em consoles webs de security appliances, h2hc-rev-2
Hacking em consoles webs de security appliances, h2hc-rev-2Hacking em consoles webs de security appliances, h2hc-rev-2
Hacking em consoles webs de security appliances, h2hc-rev-2
 
Hibernate efetivo (IA-2014 / Disturbing the Mind)
Hibernate efetivo (IA-2014 / Disturbing the Mind)Hibernate efetivo (IA-2014 / Disturbing the Mind)
Hibernate efetivo (IA-2014 / Disturbing the Mind)
 
Rest Teoria E Pratica
Rest Teoria E PraticaRest Teoria E Pratica
Rest Teoria E Pratica
 
VRaptor - Ciclo CASIN 2011
VRaptor - Ciclo CASIN 2011VRaptor - Ciclo CASIN 2011
VRaptor - Ciclo CASIN 2011
 
Arquiteturas de referência MySQL
Arquiteturas de referência MySQLArquiteturas de referência MySQL
Arquiteturas de referência MySQL
 
o nome disso é performance
o nome disso é performanceo nome disso é performance
o nome disso é performance
 
Jee6
Jee6Jee6
Jee6
 
Do Rest Ao Restfull - Rio Jug
Do Rest Ao Restfull - Rio JugDo Rest Ao Restfull - Rio Jug
Do Rest Ao Restfull - Rio Jug
 
Projetos Webs Complexos - Como funciona os sites de E-commerce Americanas.Com...
Projetos Webs Complexos - Como funciona os sites de E-commerce Americanas.Com...Projetos Webs Complexos - Como funciona os sites de E-commerce Americanas.Com...
Projetos Webs Complexos - Como funciona os sites de E-commerce Americanas.Com...
 
Webstandards - Melhores práticas para construção de páginas web
Webstandards - Melhores práticas para construção de páginas webWebstandards - Melhores práticas para construção de páginas web
Webstandards - Melhores práticas para construção de páginas web
 
Html5
Html5Html5
Html5
 
Portando sua aplicação web para iphone
Portando sua aplicação web para iphonePortando sua aplicação web para iphone
Portando sua aplicação web para iphone
 
InterCon 2017 - Segredos não ditos de PWA - muito além do Web App Manifest - ...
InterCon 2017 - Segredos não ditos de PWA - muito além do Web App Manifest - ...InterCon 2017 - Segredos não ditos de PWA - muito além do Web App Manifest - ...
InterCon 2017 - Segredos não ditos de PWA - muito além do Web App Manifest - ...
 
Speed up! Critical css to the rescue
Speed up! Critical css to the rescueSpeed up! Critical css to the rescue
Speed up! Critical css to the rescue
 
Conheça o Sass, mehor amigo do seu CSS - Nayara Felix
Conheça o Sass, mehor amigo do seu CSS - Nayara FelixConheça o Sass, mehor amigo do seu CSS - Nayara Felix
Conheça o Sass, mehor amigo do seu CSS - Nayara Felix
 
Por que investir em performance Front-End?
Por que investir em performance Front-End?Por que investir em performance Front-End?
Por que investir em performance Front-End?
 

Mais de Caelum

Progressive Web Apps: o melhor da Web appficada
Progressive Web Apps: o melhor da Web appficadaProgressive Web Apps: o melhor da Web appficada
Progressive Web Apps: o melhor da Web appficada
Caelum
 
Tudo que você precisa saber sobre picture e srcset
Tudo que você precisa saber sobre picture e srcsetTudo que você precisa saber sobre picture e srcset
Tudo que você precisa saber sobre picture e srcset
Caelum
 
Como o HTTP/2 vai mudar sua vida
Como o HTTP/2 vai mudar sua vidaComo o HTTP/2 vai mudar sua vida
Como o HTTP/2 vai mudar sua vida
Caelum
 
Métricas e a automatização do controle de qualidade
Métricas e a automatização do controle de qualidadeMétricas e a automatização do controle de qualidade
Métricas e a automatização do controle de qualidade
Caelum
 
HTTP/2, SPDY e Otimizações Web - Front In Maceió 2014 - Sérgio Lopes
HTTP/2, SPDY e Otimizações Web - Front In Maceió 2014 - Sérgio LopesHTTP/2, SPDY e Otimizações Web - Front In Maceió 2014 - Sérgio Lopes
HTTP/2, SPDY e Otimizações Web - Front In Maceió 2014 - Sérgio Lopes
Caelum
 
Design Responsivo - MobCamp 2014
Design Responsivo - MobCamp 2014Design Responsivo - MobCamp 2014
Design Responsivo - MobCamp 2014
Caelum
 
Além do responsive design: a mudança de paradigma do design adaptativo e os m...
Além do responsive design: a mudança de paradigma do design adaptativo e os m...Além do responsive design: a mudança de paradigma do design adaptativo e os m...
Além do responsive design: a mudança de paradigma do design adaptativo e os m...
Caelum
 
Por trás dos frameworks e além do reflection
Por trás dos frameworks e além do reflectionPor trás dos frameworks e além do reflection
Por trás dos frameworks e além do reflection
Caelum
 
Introducao a inteligencia artificial na educacao
Introducao a inteligencia artificial na educacaoIntroducao a inteligencia artificial na educacao
Introducao a inteligencia artificial na educacao
Caelum
 
[FrontInBH 2012] Por uma web mais rápida: técnicas de otimizações de sites - ...
[FrontInBH 2012] Por uma web mais rápida: técnicas de otimizações de sites - ...[FrontInBH 2012] Por uma web mais rápida: técnicas de otimizações de sites - ...
[FrontInBH 2012] Por uma web mais rápida: técnicas de otimizações de sites - ...
Caelum
 
Plataforma java: detalhes da JVM
Plataforma java: detalhes da JVMPlataforma java: detalhes da JVM
Plataforma java: detalhes da JVM
Caelum
 
CDI e as ideias pro futuro do VRaptor
CDI e as ideias pro futuro do VRaptorCDI e as ideias pro futuro do VRaptor
CDI e as ideias pro futuro do VRaptor
Caelum
 
Qualidade de código - a qualidade que faz a diferença
Qualidade de código - a qualidade que faz a diferençaQualidade de código - a qualidade que faz a diferença
Qualidade de código - a qualidade que faz a diferença
Caelum
 
Design de código: qualidade que faz a diferença, qcon 2011
Design de código: qualidade que faz a diferença, qcon 2011Design de código: qualidade que faz a diferença, qcon 2011
Design de código: qualidade que faz a diferença, qcon 2011
Caelum
 
Agile2011
Agile2011Agile2011
Agile2011
Caelum
 
Práticas para um Site Otimizado - CaelumDay in Rio 2011
Práticas para um Site Otimizado - CaelumDay in Rio 2011Práticas para um Site Otimizado - CaelumDay in Rio 2011
Práticas para um Site Otimizado - CaelumDay in Rio 2011
Caelum
 
Servlets 3: o contexto assíncrono - JavaOne 2010 - Paulo Silveira
Servlets 3: o contexto assíncrono - JavaOne 2010 - Paulo SilveiraServlets 3: o contexto assíncrono - JavaOne 2010 - Paulo Silveira
Servlets 3: o contexto assíncrono - JavaOne 2010 - Paulo Silveira
Caelum
 
Como fabricar dinheiro: Otimizações de Sites e porque isso vai deixá-lo rico ...
Como fabricar dinheiro: Otimizações de Sites e porque isso vai deixá-lo rico ...Como fabricar dinheiro: Otimizações de Sites e porque isso vai deixá-lo rico ...
Como fabricar dinheiro: Otimizações de Sites e porque isso vai deixá-lo rico ...
Caelum
 
Google Android - WTJatai
Google Android - WTJataiGoogle Android - WTJatai
Google Android - WTJatai
Caelum
 

Mais de Caelum (19)

Progressive Web Apps: o melhor da Web appficada
Progressive Web Apps: o melhor da Web appficadaProgressive Web Apps: o melhor da Web appficada
Progressive Web Apps: o melhor da Web appficada
 
Tudo que você precisa saber sobre picture e srcset
Tudo que você precisa saber sobre picture e srcsetTudo que você precisa saber sobre picture e srcset
Tudo que você precisa saber sobre picture e srcset
 
Como o HTTP/2 vai mudar sua vida
Como o HTTP/2 vai mudar sua vidaComo o HTTP/2 vai mudar sua vida
Como o HTTP/2 vai mudar sua vida
 
Métricas e a automatização do controle de qualidade
Métricas e a automatização do controle de qualidadeMétricas e a automatização do controle de qualidade
Métricas e a automatização do controle de qualidade
 
HTTP/2, SPDY e Otimizações Web - Front In Maceió 2014 - Sérgio Lopes
HTTP/2, SPDY e Otimizações Web - Front In Maceió 2014 - Sérgio LopesHTTP/2, SPDY e Otimizações Web - Front In Maceió 2014 - Sérgio Lopes
HTTP/2, SPDY e Otimizações Web - Front In Maceió 2014 - Sérgio Lopes
 
Design Responsivo - MobCamp 2014
Design Responsivo - MobCamp 2014Design Responsivo - MobCamp 2014
Design Responsivo - MobCamp 2014
 
Além do responsive design: a mudança de paradigma do design adaptativo e os m...
Além do responsive design: a mudança de paradigma do design adaptativo e os m...Além do responsive design: a mudança de paradigma do design adaptativo e os m...
Além do responsive design: a mudança de paradigma do design adaptativo e os m...
 
Por trás dos frameworks e além do reflection
Por trás dos frameworks e além do reflectionPor trás dos frameworks e além do reflection
Por trás dos frameworks e além do reflection
 
Introducao a inteligencia artificial na educacao
Introducao a inteligencia artificial na educacaoIntroducao a inteligencia artificial na educacao
Introducao a inteligencia artificial na educacao
 
[FrontInBH 2012] Por uma web mais rápida: técnicas de otimizações de sites - ...
[FrontInBH 2012] Por uma web mais rápida: técnicas de otimizações de sites - ...[FrontInBH 2012] Por uma web mais rápida: técnicas de otimizações de sites - ...
[FrontInBH 2012] Por uma web mais rápida: técnicas de otimizações de sites - ...
 
Plataforma java: detalhes da JVM
Plataforma java: detalhes da JVMPlataforma java: detalhes da JVM
Plataforma java: detalhes da JVM
 
CDI e as ideias pro futuro do VRaptor
CDI e as ideias pro futuro do VRaptorCDI e as ideias pro futuro do VRaptor
CDI e as ideias pro futuro do VRaptor
 
Qualidade de código - a qualidade que faz a diferença
Qualidade de código - a qualidade que faz a diferençaQualidade de código - a qualidade que faz a diferença
Qualidade de código - a qualidade que faz a diferença
 
Design de código: qualidade que faz a diferença, qcon 2011
Design de código: qualidade que faz a diferença, qcon 2011Design de código: qualidade que faz a diferença, qcon 2011
Design de código: qualidade que faz a diferença, qcon 2011
 
Agile2011
Agile2011Agile2011
Agile2011
 
Práticas para um Site Otimizado - CaelumDay in Rio 2011
Práticas para um Site Otimizado - CaelumDay in Rio 2011Práticas para um Site Otimizado - CaelumDay in Rio 2011
Práticas para um Site Otimizado - CaelumDay in Rio 2011
 
Servlets 3: o contexto assíncrono - JavaOne 2010 - Paulo Silveira
Servlets 3: o contexto assíncrono - JavaOne 2010 - Paulo SilveiraServlets 3: o contexto assíncrono - JavaOne 2010 - Paulo Silveira
Servlets 3: o contexto assíncrono - JavaOne 2010 - Paulo Silveira
 
Como fabricar dinheiro: Otimizações de Sites e porque isso vai deixá-lo rico ...
Como fabricar dinheiro: Otimizações de Sites e porque isso vai deixá-lo rico ...Como fabricar dinheiro: Otimizações de Sites e porque isso vai deixá-lo rico ...
Como fabricar dinheiro: Otimizações de Sites e porque isso vai deixá-lo rico ...
 
Google Android - WTJatai
Google Android - WTJataiGoogle Android - WTJatai
Google Android - WTJatai
 

Último

Ferramentas que irão te ajudar a entrar no mundo de DevOps/CLoud
Ferramentas que irão te ajudar a entrar no mundo de   DevOps/CLoudFerramentas que irão te ajudar a entrar no mundo de   DevOps/CLoud
Ferramentas que irão te ajudar a entrar no mundo de DevOps/CLoud
Ismael Ash
 
se38_layout_erro_xxxxxxxxxxxxxxxxxx.docx
se38_layout_erro_xxxxxxxxxxxxxxxxxx.docxse38_layout_erro_xxxxxxxxxxxxxxxxxx.docx
se38_layout_erro_xxxxxxxxxxxxxxxxxx.docx
ronaldos10
 
ExpoGestão 2024 - Desvendando um mundo em ebulição
ExpoGestão 2024 - Desvendando um mundo em ebuliçãoExpoGestão 2024 - Desvendando um mundo em ebulição
ExpoGestão 2024 - Desvendando um mundo em ebulição
ExpoGestão
 
INTELIGÊNCIA ARTIFICIAL + COMPUTAÇÃO QUÂNTICA = MAIOR REVOLUÇÃO TECNOLÓGICA D...
INTELIGÊNCIA ARTIFICIAL + COMPUTAÇÃO QUÂNTICA = MAIOR REVOLUÇÃO TECNOLÓGICA D...INTELIGÊNCIA ARTIFICIAL + COMPUTAÇÃO QUÂNTICA = MAIOR REVOLUÇÃO TECNOLÓGICA D...
INTELIGÊNCIA ARTIFICIAL + COMPUTAÇÃO QUÂNTICA = MAIOR REVOLUÇÃO TECNOLÓGICA D...
Faga1939
 
ExpoGestão 2024 - Inteligência Artificial – A revolução no mundo dos negócios
ExpoGestão 2024 - Inteligência Artificial – A revolução no mundo dos negóciosExpoGestão 2024 - Inteligência Artificial – A revolução no mundo dos negócios
ExpoGestão 2024 - Inteligência Artificial – A revolução no mundo dos negócios
ExpoGestão
 
Subindo uma aplicação WordPress em docker na AWS
Subindo uma aplicação WordPress em docker na AWSSubindo uma aplicação WordPress em docker na AWS
Subindo uma aplicação WordPress em docker na AWS
Ismael Ash
 

Último (6)

Ferramentas que irão te ajudar a entrar no mundo de DevOps/CLoud
Ferramentas que irão te ajudar a entrar no mundo de   DevOps/CLoudFerramentas que irão te ajudar a entrar no mundo de   DevOps/CLoud
Ferramentas que irão te ajudar a entrar no mundo de DevOps/CLoud
 
se38_layout_erro_xxxxxxxxxxxxxxxxxx.docx
se38_layout_erro_xxxxxxxxxxxxxxxxxx.docxse38_layout_erro_xxxxxxxxxxxxxxxxxx.docx
se38_layout_erro_xxxxxxxxxxxxxxxxxx.docx
 
ExpoGestão 2024 - Desvendando um mundo em ebulição
ExpoGestão 2024 - Desvendando um mundo em ebuliçãoExpoGestão 2024 - Desvendando um mundo em ebulição
ExpoGestão 2024 - Desvendando um mundo em ebulição
 
INTELIGÊNCIA ARTIFICIAL + COMPUTAÇÃO QUÂNTICA = MAIOR REVOLUÇÃO TECNOLÓGICA D...
INTELIGÊNCIA ARTIFICIAL + COMPUTAÇÃO QUÂNTICA = MAIOR REVOLUÇÃO TECNOLÓGICA D...INTELIGÊNCIA ARTIFICIAL + COMPUTAÇÃO QUÂNTICA = MAIOR REVOLUÇÃO TECNOLÓGICA D...
INTELIGÊNCIA ARTIFICIAL + COMPUTAÇÃO QUÂNTICA = MAIOR REVOLUÇÃO TECNOLÓGICA D...
 
ExpoGestão 2024 - Inteligência Artificial – A revolução no mundo dos negócios
ExpoGestão 2024 - Inteligência Artificial – A revolução no mundo dos negóciosExpoGestão 2024 - Inteligência Artificial – A revolução no mundo dos negócios
ExpoGestão 2024 - Inteligência Artificial – A revolução no mundo dos negócios
 
Subindo uma aplicação WordPress em docker na AWS
Subindo uma aplicação WordPress em docker na AWSSubindo uma aplicação WordPress em docker na AWS
Subindo uma aplicação WordPress em docker na AWS
 

Otimizações de Performance Web: Desafios do Mundo Mobile