SlideShare uma empresa Scribd logo
1 de 96
Baixar para ler offline
SEGREDOS NÃO
DITOS DE PWA
M U I TO A L É M D O W E B A P P M A N I F E S T
OI,
EU SOU
O E D U
@eduardojmatos
a maior plataforma de contratação
de serviços do Brasil
D E V N A E S T R A D A . C O M . B R
H T T P : / / D I V E R S I D A D E .T E C H
H T T P S : / / G I T H U B . C O M / F R O N T E N D B R
OK, PWA O QUÊ?
Segredos não ditos de PWA - muito além do Web App Manifest
Public Work Administrations era uma agência do governo dos EUA pra cuidar de
grandes construções públicas na década de 30/40.
Só de curiosidade mesmo.
Progressive Web Apps é um 

conjunto de conceitos:

Rapidez, Integridade, Confiabilidade e
Engajamento.
Como uma “agência”, PWA contém algumas
“auditorias” pra certificar que estamos
seguindo esses conceitos.
PWA É SÓ
FRONT-END?
NÃO
BACK-END E DEVOPS
TAMBÉM ESTÃO NO JOGO
MUITAS COISAS ANTES DO FRONT-END
PRECISAM DE CUIDADO
SERVER SIDE
PWA ❤ BACK-END
GZIP
SEVOCÊ AINDA NÃO ESTÁ
USANDO, BEM…
Nginx, Node, Apache, IIS.

Todos têm possibilidade de enviar conteúdo 

comprimido com GZIP
GZIP
NGINX
# Enable gzip compression.

gzip on;
# Compression level (1-9)
# 5 is a perfect compromise between size and CPU usage

gzip_comp_level 5;
# Don't compress anything that's already small and unlikely to shrink much

gzip_min_length 256;
npm install compression --save
const compression = require('compression');
const express = require('express');
const app = express();
app.use(compression());
GZIP
NODE
IMAGE COMPRESSION
IMAGENS NA WEB NÃO PRECISAM TER 100% DE QUALIDADE
34KB 11KB
IMAGE COMPRESSION
FERRAMENTAS PARA OTIMIZAÇÃO
jpegoptim
SVGOpngquant 2
Gifsicle
AUTOMATIZE
imagemin-webpack-plugin
gulp-imagemin
middleman-imageoptim
imagemin
USE FERRAMENTAS NO BUILD DO PROJETO PRA COMPRESSÃO
TODAS USAM QUASE AS MESMAS LIBS DE OTIMIZAÇÃO
TIME TO FIRST BYTE
O TEMPO PRA QUE O PRIMEIRO BYTE CHEGUE NO CLIENT
TIME TO FIRST BYTE
• Tempo pra envio da requisição HTTP;
• Tempo para o servidor processar a requisição;
• Tempo para o servidor responder o primeiro byte;
TIME TO FIRST BYTE
http://bytecheck.com/
TIME TO FIRST BYTE
TEMPO DE SERVIDOR, REQUEST TIME…
• Aqui não tem jeito: precisa melhorar o tempo
de resposta do servidor;
• Dá pra usar cache na frente pra amenizar
(Varnish, ou outra tecnologia);
• Ou uma CDN (veremos logo mais).
TIME TO FIRST BYTE É IMPORTANTE
PARA A PRIMEIRA EXPERIÊNCIA DO PWA.
SENSAÇÃO DEVELOCIDADE É UM DOS
ASPECTOS MAIS IMPORTANTES NUM WEB APP.
SINCRONIA DE DADOS
SUPORTE OFFLINE NO BROWSER,
E SINCRONIA COM BACK-END
SINCRONIA DE DADOS
POUCHDB É UMA IMPLEMENTAÇÃO COM JAVASCRIPT DO COUCHDB. O OBJETIVO
É EMULAR O COUCHDB RODANDO NO BROWSER OU ATÉ MESMO NO NODEJS
const PouchDB = require('pouchdb');
// sample === database name
const db = new PouchDB('http://localhost:5984/sample');
const myUser = {
_id: 'Edu-v1',
name: 'Eduardo Matos',
email: 'eduardoj.matos@gmail.com',
company_name: 'GetNinjas',
};
db.find({ selector: { _id: myUser._id } })
.then((result) => {
db.put(myUser)
.then(doc => console.log('created:', doc))
.catch((err) => {
const updatedUser = Object.assign({
_rev: result.docs[0]._rev
}, myUser);
if (err.name === 'conflict') {
db.put(updatedUser).then((user) => {
console.log('putted =>', user);
});
}
});
});
SINCRONIA DE DADOS
const PouchDB = require('pouchdb');
// sample === database name
const db = new PouchDB('sample');
db.sync('http://localhost:5984/sample', {
live: true, retry: true
});
VERSÃO “NO-BRAINER”
SINCRONIA DE DADOS
POUCHDB É BUILT-IN EM DIVERSOS ENVIRONMENTS
DEVOPS
PWA ❤ DEVOPS
PAGESPEED
MÓDULO DE OTIMIZAÇÃO PARA NGINX E APACHE
PAGESPEED
MAIS DE 40 FILTROS DE OTIMIZAÇÃO
Combine CSS
Combine JS
Filters and Options 

for Optimizing Images
Prioritize Critical CSS
Lazily Load Images
Remove Quotes
Move CSS to Head
Inline Preview Images
Inline Google Fonts API CSSHint Resource Preloading
PAGESPEED
MAIS DE 40 FILTROS DE OTIMIZAÇÃO
pagespeed on;
pagespeed FileCachePath /var/ngx_pagespeed_cache;
pagespeed LogDir /var/log/pagespeed;
# config
pagespeed LowercaseHtmlNames on;
pagespeed EnableFilters remove_comments;
pagespeed EnableFilters collapse_whitespace;
pagespeed EnableFilters remove_quotes;
pagespeed EnableFilters elide_attributes;
SEUS AMIGUINHOS DA PERFORMANCE
DNS-PREFETCH, PRECONNECT,
E PRELOAD
DNS-PREFETCH
OLHA SÓ,VAIVIR ALGO DESSE DOMÍNIO
DNS-Prefetch
Notifica o cliente que há assets que vão ser
baixados dentro de um domínio, assim que o
browser resolver o DNS do mesmo.
DNS-PREFETCH
OLHA SÓ,VAIVIR ALGO DESSE DOMÍNIO
<link rel="dns-prefetch" href="//abs-0.twimg.com">
DNS-PREFETCH
OLHA SÓ,VAIVIR ALGO DESSE DOMÍNIO
dns lookup | connect | ssl
<link rel="dns-prefetch" href="//abs-0.twimg.com">
DNS-PREFETCH
OLHA SÓ,VAIVIR ALGO DESSE DOMÍNIO
connect | ssl
<link rel="dns-prefetch" href="//abs-0.twimg.com">
PRECONNECT
EI! JÁ CONECTA AÍ!
Preconnect
Parecido com o dns-prefetch, o preconnect faz o
hand-shake e negociação de TLS de forma
opcional.
PRECONNECT
EI! JÁ CONECTA AÍ!
sem dns lookup, connect e ssl!
<link rel="preconnect" href="//abs-0.twimg.com">
PRECONNECT
BÔNUS!
<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin>
PRA FAZER O PRECONNECT COM A API DO GOOGLE FONTS E
EVITAR O HAND-SHAKE ;)
Preload
Faz o download de um asset, independente do
browser achar que precisa ou não.
PRELOAD
JÁ BAIXA AÍ, POR FAVOR
PRELOAD
JÁ BAIXA AÍ, POR FAVOR
<link rel="preload" href="style.css" as="style">
<link rel="preload" href="main.js" as="script">
O “as” suporta:

audio, document, embed, fetch, font, 

image, object, script, style, track, worker, video
PRELOAD
JÁ BAIXA AÍ, POR FAVOR
em 0.6 segundos, já iniciou o
download, e em 149ms respondeu
<link
rel="preload"
as="script" 

crossorigin="anonymous" 

href="https://abs-0.twimg.com/runtime.bfc3890d94f2bd96.js" />
CDN
DISTRIBUINDO SEUS ASSETS RAPIDAMENTE,
COM CACHE E POR REGIÕES
CDN
DISTRIBUINDO SEUS ASSETS RAPIDAMENTE,
COM CACHE E POR REGIÕES
HTTP/2
A CAMADA DE TRANSPORTE
MODERNA E ÁGIL
HTTP/2
REQUESTS PARALELOS E NÃO BLOCANTES
HTTP/2
HEADER COMPRESSION
HTTP/2
HPACK
Quase 88% de redução no tamanho do request
FRONT-END
FRONT PIRA NO PWA
IMAGENS NO TAMANHO CERTO
40X40? NÃO USE UMA DE 50X50
resolução tamanho natural
display size
(CSS px)
Pixels desnecessários
bytes 

desnecessários
1x 110 x 110 100 x 100 110 x 110 - 100 x 100 = 2100
2100 x 4 / 1024 = 

8 KB
1x 410 x 410 400 x 400 410 x 410 - 400 x 400 = 8100
8100 x 4 / 1024 = 

31.6 KB
1x 810 x 810 800 x 800 810 x 810 - 800 x 800 = 16100
16100 x 4 / 1024 =

62.9 KB
2x 220 x 220 100 x 100 210 x 210 - (2 x 100) x (2 x 100) = 8400
8400 x 4 / 1024 =

32.8 KB
2x 820 x 820 400 x 400 820 x 820 - (2 x 400) x (2 x 400) = 32400
32400 x 4 / 1024 =

126.5 KB
2x 1620 x 1620 800 x 800
1620 x 1620 - (2 x 800) x (2 x 800)
= 64400
64400 x 4 / 1024 =

251.6 KB
SOBRE FONTES… 

USE MENOS!
• MAIS QUE 2 FAMÍLIAS DE FONTES NUM WEB APP… PARECE ESTRANHO!
• FONTES SÃO BLOCANTES;
• CAUSAM FOIT (FLASH OF INVISIBLETEXT);
PRA EVITAR FOIT
FONT FACE OBSERVER
<html class="default-font">
<style>
.default-font {
font-family: Arial, sans-serif;
}
</style>
var fonts = [
{ name: 'Lato', weight: 400 },
{ name: 'Lato', weight: 700 },
{ name: 'Lato', weight: 900 }
];
fonts.forEach(function(font, index) {
fonts[index].observer = new FontFaceObserver(font.name, { 

weight: font.weight 

});
});
Promise
.all(fonts.map(function(font) {
return font.observer.load();
}))
.then(() => document.body.classList.remove("default-font") );
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 Manifest
Segredos não ditos de PWA - muito além do Web App Manifest
INPUT LATENCYSENSAÇÃO DEVELOCIDADE NO INPUT DO USUÁRIO
• O ideal é a interação de input ser menor
que 100ms.
• Digitar, Clicar, Mover sobre hover, etc.
Mais que 100ms, repense muito!
UM SIMPLES EFEITO
DE HOVER COM 2S…
GPU
mouseover
com transition
e animation
Paint, Recalculate Style
document.addEventListener(
'touchstart',
onTouchStartHandler,
{ passive: true });
TOUCH MOVE, START, ETC., SEM O
DOUBLE CHECK DE “TOUCH OR SCROLL"
TOUCH PASSIVE
https://www.youtube.com/watch?v=65VMej8n23A
TOUCH PASSIVE
PRIORIZANDO O ESSENCIAL PRO USUÁRIO
CRITICAL PATH
above the fold
CSS INLINE
CRITICAL PATH
CRITICAL PATH
ATENÇÃO! MUITO INLINE PREJUDICA O TTFB!
QUANDO O USUÁRIOVAI COMEÇAR AVER SUA PÁGINA DEVERDADE
FIRST MEANINGFUL PAINT
LEMBRA DO PREFETCH E PRELOAD? POIS É!
FIRST MEANINGFUL PAINT
NÃO É ESSENCIAL DE INÍCIO? CARREGA DEPOIS!
JAVASCRIPT NÃO BLOCANTE
<!doctype html>
<html>
<head>
<title>Testing</title>
</head>
<body>
<script src="main.js" async></script>
<script src="page.js" async></script>
</body>
</html>
NÃO É ESSENCIAL DE INÍCIO? CARREGA DEPOIS!
JAVASCRIPT NÃO BLOCANTE
Com async, o JavaScript é carregado enquanto o DOM é construído.
Asim que carregado ele já é executado.
NÃO É ESSENCIAL DE INÍCIO? CARREGA DEPOIS!
JAVASCRIPT NÃO BLOCANTE
Com defer, o JavaScript é carregado enquanto o DOM é construído
também, mas só é carregado quando o DOM está 100% pronto.
NÃO É ESSENCIAL DE INÍCIO? CARREGA DEPOIS!
JAVASCRIPT NÃO BLOCANTE
USE ESTRATÉGIAS DE CACHE COM
SERVICE WORKERS
Como o Service Workers funciona
O QUE É SERVICE WORKERS?
// index.html
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/js/sw.js')
.then(reg => {
if(reg.active) {
console.log('Service worker active');
}
}).catch(error => {
console.error('Registration failed with', error);
});
};
O QUE É SERVICE WORKERS?
// js/sw.js
self.addEventListener('install', event => {
event.waitUntil(
caches.open('v1').then(cache => {
return cache.addAll([
'/index.html',
'/js/app.js',
'/css/styles.css',
'/images/avatar/profile/01.jpg'
]);
})
);
});
O QUE É SERVICE WORKERS?
// js/sw.js

self.addEventListener('fetch', (event) => {
event.respondWith(
caches.open('v1').then((cache) => {
return cache.match(event.request).then((response) => {
if (response) {
return response.clone();
}
throw Error('Response cached missing');
}).catch((error) => {
return fetch(event.request.url); //fallback para online
});
})
);
});
Segredos não ditos de PWA - muito além do Web App Manifest
NETWORK FIRST? CACHE FIRST? SW-PRECACHE PRA CRIAR O ARQUIVO DO SW
USE ESTRATÉGIAS DE CACHE COM
SERVICE WORKERS
NETWORK FIRST? CACHE FIRST? SW-PRECACHE PRA CRIAR O ARQUIVO DO SW
USE ESTRATÉGIAS DE CACHE COM
SERVICE WORKERS
npm i sw-precache -g
sw-precache
—config=precache-config.js
--verbose
module.exports = {
staticFileGlobs: [
'app/css/**.css',
'app/**.html',
'app/images/**.*',
'app/js/**.js'
],
stripPrefix: 'app/',
runtimeCaching: [{
handler: 'cacheFirst'
}]
};
PASSE UMA “AUDITORIA”
NO SEU WEB APP
https://github.com/GoogleChrome/lighthouse/
TAVA BOM, NÃO TAVA MUITO BOM,
TAVA MEIO RUIM TAMBÉM,
AGORA PARECE QUE PIOROU
WEB APPS CONTINUAM
SENDO COMPLEXAS…
PWA SÓ ADICIONOU
“AUDITORIAS” PRA AVALIAR
SEU WEB APP
CTZ QUEVÃO ME XINGAR
A MAIORIA DOS
PADRÕES DO PWA JÁ
EXISTIAM
RESUMINDO…
HÁ MUITO POR TRÁS DE
APENAS UM WEB APP
MANIFESTO COM ÍCONE DE
APP E INSTALAÇÃO NO DEVICE
BACK-END
DEVOPS
FRONT-END
PWA NÃO É SÓ A
RESPONSA DE UMA ÁREA
EM TECNOLOGIA
DÁ PRA USAR
ESSAS DICAS MESMO
NÃO CONSTRUINDO
UM PWA
E NÃO, OS APPS
NATIVOS NÃO VÃO
MORRER TÃO CEDO ;)
CTZ QUEVÃO ME XINGAR [2]
@eduardojmatos
http://eduardomatos.me
eduardoj.matos@gmail.com
OBRIGADO ;)

Mais conteúdo relacionado

Mais procurados

Melhorando A Performance Da Sua Aplicação Web
Melhorando A Performance Da Sua Aplicação WebMelhorando A Performance Da Sua Aplicação Web
Melhorando A Performance Da Sua Aplicação WebMaurício Linhares
 
Criando um Web Service Restful com Jersey, Eclipse, JBoss, Tomcat, WebSphere
Criando um Web Service Restful com Jersey, Eclipse, JBoss, Tomcat, WebSphereCriando um Web Service Restful com Jersey, Eclipse, JBoss, Tomcat, WebSphere
Criando um Web Service Restful com Jersey, Eclipse, JBoss, Tomcat, WebSphereJuliano Martins
 
MobileConf 2013: PhoneGap
MobileConf 2013: PhoneGapMobileConf 2013: PhoneGap
MobileConf 2013: PhoneGapLoiane Groner
 
Como Dominar seu Fluxo de Desenvolvimento com TDD
Como Dominar seu Fluxo de Desenvolvimento com TDDComo Dominar seu Fluxo de Desenvolvimento com TDD
Como Dominar seu Fluxo de Desenvolvimento com TDDRachid Calazans
 
FAESA Computação Móvel: Introducao a Phonegap e Cordova
FAESA Computação Móvel: Introducao a Phonegap e CordovaFAESA Computação Móvel: Introducao a Phonegap e Cordova
FAESA Computação Móvel: Introducao a Phonegap e CordovaLoiane Groner
 
Flávio Almeida MEAN Stack "to be or not to be mean"
Flávio Almeida MEAN Stack "to be or not to be mean"Flávio Almeida MEAN Stack "to be or not to be mean"
Flávio Almeida MEAN Stack "to be or not to be mean"flaviohalmeida
 
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014Celso Fernandes
 

Mais procurados (7)

Melhorando A Performance Da Sua Aplicação Web
Melhorando A Performance Da Sua Aplicação WebMelhorando A Performance Da Sua Aplicação Web
Melhorando A Performance Da Sua Aplicação Web
 
Criando um Web Service Restful com Jersey, Eclipse, JBoss, Tomcat, WebSphere
Criando um Web Service Restful com Jersey, Eclipse, JBoss, Tomcat, WebSphereCriando um Web Service Restful com Jersey, Eclipse, JBoss, Tomcat, WebSphere
Criando um Web Service Restful com Jersey, Eclipse, JBoss, Tomcat, WebSphere
 
MobileConf 2013: PhoneGap
MobileConf 2013: PhoneGapMobileConf 2013: PhoneGap
MobileConf 2013: PhoneGap
 
Como Dominar seu Fluxo de Desenvolvimento com TDD
Como Dominar seu Fluxo de Desenvolvimento com TDDComo Dominar seu Fluxo de Desenvolvimento com TDD
Como Dominar seu Fluxo de Desenvolvimento com TDD
 
FAESA Computação Móvel: Introducao a Phonegap e Cordova
FAESA Computação Móvel: Introducao a Phonegap e CordovaFAESA Computação Móvel: Introducao a Phonegap e Cordova
FAESA Computação Móvel: Introducao a Phonegap e Cordova
 
Flávio Almeida MEAN Stack "to be or not to be mean"
Flávio Almeida MEAN Stack "to be or not to be mean"Flávio Almeida MEAN Stack "to be or not to be mean"
Flávio Almeida MEAN Stack "to be or not to be mean"
 
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
Reduzindo Tempo de Resposta do Servidor - WordCamp BH 2014
 

Semelhante a Segredos não ditos de PWA - muito além do Web App Manifest

Big Data, Performance, Posix, RTB no mercado de publicidade online
Big Data, Performance, Posix, RTB no mercado de publicidade onlineBig Data, Performance, Posix, RTB no mercado de publicidade online
Big Data, Performance, Posix, RTB no mercado de publicidade onlineTiago Peczenyj
 
JS Experience 2017 - Otimizando o front end
JS Experience 2017 - Otimizando o front endJS Experience 2017 - Otimizando o front end
JS Experience 2017 - Otimizando o front endiMasters
 
Performance Front-end
Performance Front-endPerformance Front-end
Performance Front-endDescomplica
 
Ux for Developers - Build Better Products
Ux for Developers - Build Better ProductsUx for Developers - Build Better Products
Ux for Developers - Build Better ProductsPedro Marques
 
Apresentação Minas - Desenvolvendo Sites
Apresentação Minas - Desenvolvendo SitesApresentação Minas - Desenvolvendo Sites
Apresentação Minas - Desenvolvendo Sitesthiagolima
 
Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Rodrigo Kono
 
PHP Papa-Léguas: Performance em PHP
PHP Papa-Léguas: Performance em PHPPHP Papa-Léguas: Performance em PHP
PHP Papa-Léguas: Performance em PHPFlávio Lisboa
 
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 rescuemelidevelopers
 
Progressive Web Apps
Progressive Web AppsProgressive Web Apps
Progressive Web AppsToninho Sousa
 
Qualidade no Desenvolvimento utilizando WordPress
Qualidade no Desenvolvimento utilizando WordPressQualidade no Desenvolvimento utilizando WordPress
Qualidade no Desenvolvimento utilizando WordPressLorain Pazzetto
 
Alta Performance em Aplicações Web
Alta Performance em Aplicações WebAlta Performance em Aplicações Web
Alta Performance em Aplicações WebAnderson Aguiar
 
CORE WEB VITALS E WORDPRESS
CORE WEB VITALS E WORDPRESSCORE WEB VITALS E WORDPRESS
CORE WEB VITALS E WORDPRESSDaniel Paz
 
WordCamp Floripa 2021 - Daniel - Core web vitals e WordPress
WordCamp Floripa 2021 - Daniel  - Core web vitals e WordPressWordCamp Floripa 2021 - Daniel  - Core web vitals e WordPress
WordCamp Floripa 2021 - Daniel - Core web vitals e WordPressWordCamp Floripa
 
Aprendendo a criar plugins para o Wordpress - Richard Barros
Aprendendo a criar plugins para o Wordpress - Richard BarrosAprendendo a criar plugins para o Wordpress - Richard Barros
Aprendendo a criar plugins para o Wordpress - Richard BarrosRichard Barros
 
COMO FAZER E-MAIL MARKETING EM HTML
COMO FAZER E-MAIL MARKETING EM HTMLCOMO FAZER E-MAIL MARKETING EM HTML
COMO FAZER E-MAIL MARKETING EM HTMLRenato Melo
 
Caipira agil automacao front end selenium
Caipira agil automacao front end seleniumCaipira agil automacao front end selenium
Caipira agil automacao front end seleniumQualister
 

Semelhante a Segredos não ditos de PWA - muito além do Web App Manifest (20)

Big Data, Performance, Posix, RTB no mercado de publicidade online
Big Data, Performance, Posix, RTB no mercado de publicidade onlineBig Data, Performance, Posix, RTB no mercado de publicidade online
Big Data, Performance, Posix, RTB no mercado de publicidade online
 
JS Experience 2017 - Otimizando o front end
JS Experience 2017 - Otimizando o front endJS Experience 2017 - Otimizando o front end
JS Experience 2017 - Otimizando o front end
 
Performance Front-end
Performance Front-endPerformance Front-end
Performance Front-end
 
Ux for Developers - Build Better Products
Ux for Developers - Build Better ProductsUx for Developers - Build Better Products
Ux for Developers - Build Better Products
 
Apresentação Minas - Desenvolvendo Sites
Apresentação Minas - Desenvolvendo SitesApresentação Minas - Desenvolvendo Sites
Apresentação Minas - Desenvolvendo Sites
 
Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3Surpreenda-se com o Silverlight 3
Surpreenda-se com o Silverlight 3
 
PHP Papa-Léguas: Performance em PHP
PHP Papa-Léguas: Performance em PHPPHP Papa-Léguas: Performance em PHP
PHP Papa-Léguas: Performance em PHP
 
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
 
Progressive Web Apps
Progressive Web AppsProgressive Web Apps
Progressive Web Apps
 
Qualidade no Desenvolvimento utilizando WordPress
Qualidade no Desenvolvimento utilizando WordPressQualidade no Desenvolvimento utilizando WordPress
Qualidade no Desenvolvimento utilizando WordPress
 
Alta Performance em Aplicações Web
Alta Performance em Aplicações WebAlta Performance em Aplicações Web
Alta Performance em Aplicações Web
 
CORE WEB VITALS E WORDPRESS
CORE WEB VITALS E WORDPRESSCORE WEB VITALS E WORDPRESS
CORE WEB VITALS E WORDPRESS
 
WordCamp Floripa 2021 - Daniel - Core web vitals e WordPress
WordCamp Floripa 2021 - Daniel  - Core web vitals e WordPressWordCamp Floripa 2021 - Daniel  - Core web vitals e WordPress
WordCamp Floripa 2021 - Daniel - Core web vitals e WordPress
 
Mini Curso Mashup Coreu
Mini Curso Mashup CoreuMini Curso Mashup Coreu
Mini Curso Mashup Coreu
 
Aprendendo a criar plugins para o Wordpress - Richard Barros
Aprendendo a criar plugins para o Wordpress - Richard BarrosAprendendo a criar plugins para o Wordpress - Richard Barros
Aprendendo a criar plugins para o Wordpress - Richard Barros
 
Abaas - Advanced Beer-as-a-Service
Abaas - Advanced Beer-as-a-ServiceAbaas - Advanced Beer-as-a-Service
Abaas - Advanced Beer-as-a-Service
 
Aplicações web realtime
Aplicações web realtimeAplicações web realtime
Aplicações web realtime
 
Google IO 2017 Extended - Cuiaba - Progressive Web Apps
Google IO 2017 Extended - Cuiaba - Progressive Web AppsGoogle IO 2017 Extended - Cuiaba - Progressive Web Apps
Google IO 2017 Extended - Cuiaba - Progressive Web Apps
 
COMO FAZER E-MAIL MARKETING EM HTML
COMO FAZER E-MAIL MARKETING EM HTMLCOMO FAZER E-MAIL MARKETING EM HTML
COMO FAZER E-MAIL MARKETING EM HTML
 
Caipira agil automacao front end selenium
Caipira agil automacao front end seleniumCaipira agil automacao front end selenium
Caipira agil automacao front end selenium
 

Segredos não ditos de PWA - muito além do Web App Manifest