Uma ferramenta extra para ajudar a equilibrar a rapidez e a atualidade ao servir seu app da Web.
O que foi enviado?
O stale-while-revalidate
ajuda
os desenvolvedores a equilibrar a urgência (carregar o conteúdo em cache imediatamente) e
a atualidade (garantindo que as atualizações do conteúdo em cache sejam usadas no futuro). Se
você mantém um serviço ou biblioteca da Web de terceiros que é atualizado regularmente
ou se os recursos próprios tendem a ter vida útil curta, o
stale-while-revalidate
pode ser uma adição útil às suas políticas de
armazenamento em cache atuais.
O suporte para definir stale-while-revalidate
com max-age
no cabeçalho de resposta Cache-Control
está disponível no Chrome 75
e no Firefox 68.
Os navegadores que não oferecem suporte a stale-while-revalidate
vão ignorar esse
valor de configuração e usar
max-age
,
como vou explicar em breve.
O que isso significa?
Vamos dividir stale-while-revalidate
em duas partes: a ideia de que uma resposta em cache
pode estar desatualizada e o processo de revalidação.
Primeiro, como o navegador sabe se uma resposta armazenada em cache está "desatualizada"? Um
cabeçalho de resposta Cache-Control
que contém stale-while-revalidate
também precisa conter
max-age
, e o número de segundos especificados por max-age
é o que determina
a validade. Qualquer resposta em cache mais recente que max-age
é considerada recente, e
as respostas em cache mais antigas são desatualizadas.
Se a resposta armazenada em cache local ainda estiver atualizada, ela poderá ser usada como está para
atender à solicitação de um navegador. Do ponto de vista de stale-while-revalidate
,
não há nada a ser feito nesse cenário.
No entanto, se a resposta armazenada em cache estiver desatualizada, outra verificação baseada na idade será realizada:
a idade da resposta armazenada em cache está dentro da janela de tempo adicional fornecida pela
configuração stale-while-revalidate
?
Se a idade de uma resposta desatualizada cair nessa janela, ela será usada para
atender à solicitação do navegador. Ao mesmo tempo, uma solicitação de "revalidação" será
feita contra a rede de uma forma que não atrase o uso da resposta em cache. A resposta retornada pode conter as mesmas informações que a
resposta em cache anterior ou pode ser diferente. De qualquer forma, a resposta da rede
é armazenada localmente, substituindo o que estava no cache e
redefinindo o timer de "novidade" usado em futuras comparações de max-age
.
No entanto, se a resposta armazenada em cache estiver desatualizada e for fora do
intervalo de tempo stale-while-revalidate
, ela não atenderá à solicitação
do navegador. Em vez disso, o navegador vai recuperar uma resposta da rede e usá-la
para atender à solicitação inicial e também preencher o cache local
com uma resposta nova.
Exemplo ao vivo
Confira abaixo um exemplo simples de uma API HTTP para retornar a hora atual, mais especificamente, o número atual de minutos após a hora.
Nesse cenário, o servidor da Web usa o cabeçalho Cache-Control
na resposta HTTP:
Cache-Control: max-age=1, stale-while-revalidate=59
Essa configuração significa que, se uma solicitação de tempo for repetida no próximo segundo, o valor em cache anterior ainda estará atualizado e será usado como está, sem revalidação.
Se uma solicitação for repetida entre 1 e 60 segundos depois, o valor armazenado em cache será desatualizado, mas será usado para atender à solicitação da API. Ao mesmo tempo, "em segundo plano", uma solicitação de nova validação será feita para preencher o cache com um valor novo para uso futuro.
Se uma solicitação for repetida após mais de 60 segundos, a resposta desatualizada não será usada. A resposta da rede será necessária para atender à solicitação do navegador e para a revalidação do cache.
Confira um detalhamento desses três estados distintos, além do período em que cada um deles é aplicado no nosso exemplo:
Quais são os casos de uso comuns?
Embora o exemplo acima para um serviço de API "minutos após a hora" seja fictício, ele ilustra o caso de uso esperado: serviços que fornecem informações que precisam ser atualizadas, mas em que um certo grau de desatuação é aceitável.
Exemplos menos elaborados podem ser uma API para as condições climáticas atuais ou as principais manchetes de notícias publicadas na última hora.
Geralmente, qualquer resposta que seja atualizada em um intervalo conhecido, provavelmente será solicitada
várias vezes e é estática nesse intervalo. É um bom candidato
para armazenamento em cache de curto prazo usando max-age
. O uso de stale-while-revalidate
, além
de max-age
, aumenta a probabilidade de que solicitações futuras sejam atendidas pelo
cache com conteúdo mais recente, sem bloquear uma resposta de rede.
Como ele interage com os service workers?
Se você já ouviu falar de stale-while-revalidate
, provavelmente foi no
contexto de
receitas
usadas em um service worker.
O uso de "stale-while-revalidate" com um cabeçalho Cache-Control
compartilha algumas
semelhanças com o uso em um worker de serviço, e muitas das mesmas
considerações sobre trocas de frescor e tempos de vida máximos se aplicam. No entanto,
é preciso considerar alguns aspectos ao decidir
se você vai implementar uma abordagem baseada em service workers ou apenas confiar na
configuração do cabeçalho Cache-Control
.
Use uma abordagem de worker de serviço se…
- Você já usa um service worker no seu app da Web.
- Você precisa de controle refinado sobre o conteúdo dos seus caches e quer implementar algo como uma política de expiração menos usada. O módulo Cache Expiration do Workbox pode ajudar com isso.
- Você quer receber uma notificação quando uma resposta desatualizada mudar em segundo plano durante a etapa de revalidação. O módulo Broadcast Cache Update do Workbox pode ajudar com isso.
- Você precisa desse comportamento de
stale-while-revalidate
em todos os navegadores modernos.
Use uma abordagem Cache-Control se:
- Você prefere não lidar com a sobrecarga de implantação e manutenção de um service worker para seu app da Web.
- Você não se importa se o gerenciamento automático de cache do navegador impedir que os caches locais cresçam muito.
- Você aceita uma abordagem que não tem suporte em todos os navegadores modernos (desde julho de 2019; o suporte pode aumentar no futuro).
Se você estiver usando um service worker e também tiver stale-while-revalidate
ativado
para algumas respostas usando um cabeçalho Cache-Control
, o service worker terá,
de modo geral, a "primeira chance" de responder a uma solicitação. Se o service worker
decidir não responder ou se, durante o processo de geração de uma resposta, ele fizer uma
solicitação de rede usando fetch()
,
o comportamento configurado pelo cabeçalho Cache-Control
será
ativado.
Saiba mais
- Resposta
stale-while-revalidate
na especificação da API Fetch. - RFC 5861, que abrange a especificação
stale-while-revalidate
inicial. - O cache HTTP: sua primeira linha de defesa, do guia "Confiabilidade da rede" neste site.
Imagem principal de Samuel Zeller.