Sabe o que é PWA?

Conhece o PWA?

[{"selector":"#anim-992e067f-f4a9-435d-a072-7b7b5bbf53a0","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-801e74d3-d997-4534-b7a6-28b5729d9e99","keyframes":{"transform":["translate3d(122.30484%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-c678778c-3bac-4131-92b2-f89977cda8e7","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-1e21f108-d5cb-4676-ab0e-cce7d3afb5a4","keyframes":{"transform":["translate3d(120.97901%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-4c38211f-5386-47ac-9b5c-b9b6d99329bc","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-00dfc497-bf6a-46db-aa2c-d354240d4e1c","keyframes":{"transform":["translate3d(-115.18988%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-90c87c97-3daf-468a-a8f4-6d73a85d5b29","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-7569afe3-fa9d-443c-ab89-1115a226c7d1","keyframes":{"transform":["translate3d(-116.29393%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}]

O PWA surgiu de um processo natural na forma do desenvolvimento web com os passar dos anos desde adoção do javascript até o html5.

[{"selector":"#anim-ffe9762c-de76-4daf-98e5-d2287e9743dd","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-4908cc4e-4f19-4850-9ce6-527d0370df8b","keyframes":{"transform":["translate3d(124.11348%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-c9524095-54d5-45e3-b8f8-82a160a1078c","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-6f7d6e39-1a95-49c3-99f1-a51508c84471","keyframes":{"transform":["translate3d(114.82649%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-2aecfaa3-0e5e-439d-8076-c307640730a1","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-783e4f27-b84b-4aa8-9362-7e609c4952dd","keyframes":{"transform":["translate3d(-115.09434%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-4079c83e-693f-489c-8144-689ef8dbc973","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-bf95df4c-3538-4cc6-a651-bb81cda5a596","keyframes":{"transform":["translate3d(-115.2381%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}]

Como funciona o PWA?

[{"selector":"#anim-8dc6e512-7c50-4157-8bf8-f8facf0d5d6e","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-3d7274d3-3dc3-4572-a0d6-79013900e0b0","keyframes":{"transform":["translate3d(115.43624%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-ae740dba-a28a-490d-bb2e-c5d47e4cdb0f","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-34124543-63af-4949-ad93-cdbf68ba56dc","keyframes":{"transform":["translate3d(115.43624%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-8400cda0-2ac7-415c-83ef-13880dec38de","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-370d2da6-0ced-4cac-975f-7d2c5ad5a2d0","keyframes":{"transform":["translate3d(-114.86069%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-b9cf782a-8bc8-4a9e-abc3-aca18c1272be","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-b6ac768f-ccf9-44f5-8081-d908046ba848","keyframes":{"transform":["translate3d(-114.76924%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] O PWA funciona como um aplicativo nativo pode ser executado offline, apesar de ser app web,tem notificações push executa em 2º plano, tem splash screen quando abrir o app.

Principais Características

[{"selector":"#anim-32a62872-46e1-4c30-a79f-55959fec95ab","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-8108f75e-a10c-46df-b7aa-d5cd52395917","keyframes":{"transform":["translate3d(-115.14196%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-50ea8b3b-2e1d-49b3-b9a8-d46864bb40b6","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-b6d0419a-8cb0-4692-b147-6f6c6fe810aa","keyframes":{"transform":["translate3d(-115.4088%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-e4fdbe59-a1a1-41e0-8550-1b23ac47c2aa","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-5ed6eabf-f800-460c-bc5c-0cf35eb48c21","keyframes":{"transform":["translate3d(115.50632%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-14c6a0bc-f255-439c-8ce4-2166dc610213","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-36010426-cd02-45ab-9822-cf42ecb2f248","keyframes":{"transform":["translate3d(115.50632%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-d384f0cc-3c15-482e-9895-0c4181b87901","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-311136ce-8f54-4fd9-b6c8-1f8270ce883d","keyframes":{"transform":["translate3d(0px, 1235.74972%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-835f08f1-dbc7-4c76-bfb2-9012c9a8b54c","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-2d477b2b-0060-4c7a-b877-98728622c1d7","keyframes":{"transform":["translate3d(0px, 1074.88016%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-e6e00920-47f8-40f7-a1e3-45352e8c8193","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-8e56a920-77e0-4f88-ae71-4e89b1fe87fb","keyframes":{"transform":["translate3d(0px, 961.83659%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-b63325a3-0e77-4251-a1ea-1e9e62677dfe","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-f14eaba5-80d0-4400-a797-afcb2f96ceae","keyframes":{"transform":["translate3d(0px, 827.05391%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-caf1e4ff-7952-476c-9b09-dd7e95d25f28","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-24a771c6-2a90-4e47-9d8b-c18fd17c0ac5","keyframes":{"transform":["translate3d(0px, 692.27096%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-bc72c648-6d59-496b-a590-35c937757c3f","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-5147f607-e6d0-45c5-9f24-8540431b125d","keyframes":{"transform":["translate3d(0px, 4864.45381%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-f9450776-45fc-46be-862e-a2e55af9e77b","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-db801b36-1f00-4569-9663-47c054a00052","keyframes":{"transform":["translate3d(0px, 4244.45282%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-47eb90ec-b873-4911-8eaf-280cd9aa3e57","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-928697b1-25ed-4748-a162-19d6f8d48e58","keyframes":{"transform":["translate3d(0px, 3624.45060%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-16ddd0fd-f851-48d2-a80f-a563d2e606ae","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-b692d19d-a7f8-49fc-bfee-000ae4a1b960","keyframes":{"transform":["translate3d(0px, 3004.44961%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-df485d31-5aec-486f-9fb1-985bcc45552c","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-7241d176-bef6-4b43-96ce-fd4944f9ba28","keyframes":{"transform":["translate3d(0px, 5484.45480%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-6746e840-b1a9-47e3-9873-b582f00f4057","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-783494e2-fe80-43d4-a4a9-d05f8ca84315","keyframes":{"transform":["translate3d(0px, 157.70796%, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] As principais característica do Progressive Web Application além do fato de se parecer com o um app nativo é são: Progressividade Responsividade Instalável Segurança Linkável

Performance

[{"selector":"#anim-21387658-a3d7-4ace-a9c8-6838eb6ae097","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-94e1a3a3-4cd3-4604-8679-29cba95160ff","keyframes":{"transform":["translate3d(172.31637%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-44dd8cc4-5db1-4ca2-a3fa-d346eee1dc03","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-cbcc5ce8-6465-46e1-b5af-909fdac08746","keyframes":{"transform":["translate3d(171.75140%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-8e113f50-57fb-4cc8-b168-136a04bf24fe","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-9ed454e2-23b5-4a9a-ab5c-cfccc9a10529","keyframes":{"transform":["translate3d(-115.09434%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-14e0f0d7-cec2-4e37-bcd5-551a5776f8ca","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-742e6ef9-90d7-4a8c-9d61-c3d60e3901d1","keyframes":{"transform":["translate3d(-115.09434%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] A performance sendo o aplicativo web a performance do app PWA costuma ser melhor do que o nativo com exceção nos casos dos apps que precisam fazer muitos cálculos como jogos.

[{"selector":"#anim-59fb2282-81cc-4d96-8d6b-e8ff09715808","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}] [{"selector":"#anim-bfd258b4-2531-4cc0-b88f-ebc20d875c9d","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(0.4, 0.4, 0.0, 1)","fill":"both"}] Esses é um pouco do que é o PWA como ele surgiu, alguma das características e permanence para saber mais informações por favor veja o poste completo no meu blog, veja no link abaixo. Post Completo

Conhece o PWA?

O PWA é uma forma de criar apps frontend que rodam diretamente no navegador sem precisar de loja de aplicativos.

O PWA surgiu de um processo natural na forma do desenvolvimento web com os passar dos anos desde adoção do javascript até o html5.

Como surgiu o PWA?

Como funciona o PWA?

Principais Características

Performance