Elcio Ferreira

CSS e cache

Uma dica:

Durante o desenvolvimento, costumo usar:
@import url(estilo.css?<%=rnd%>);

Assim não tenho problemas com cache.

Depois que o site vai pro ar, coloco:
@import url(estilo.css?1);

Quando preciso fazer alguma alteração, mudo o número:
@import url(estilo.css?2);

Assim, quem costuma visitar constantemente o site não vai ficar com a versão antiga em cache.

Obviamente, você pode fazer a mesma coisa com PHP, Python, JSP, ColdFusion… Basta trocar rnd pela função de random da sua linguagem.

Elcio

,

13 respostas para “CSS e cache”

  1. Avatar de Henrique
    Henrique

    Pequeno mas muito útil, parabéns! Abraços!

    Responder
  2. Avatar de Fernando S Medrado
    Fernando S Medrado

    Grande Elcio.
    Muito bacana a dica, muito simples, porém resolve muito bem a questão do cache e css.
    Seguindo tua dica eu faço +/- assim:

    Na primeira linha do meu css coloco a data/hora da ultima edição do arquivo (/*250320091556*/).
    Criei uma funçao em php que lê essa string e no link do meu css escrevo essa string logo depois do .css?

    Aí sempre que atualizo alguma linha no meu css antes de enviar o arquivo é só alterar a data/hora no início do arquivo e pronto.

    Parabéns pelo blog, conteúdo sempre muito bom!

    Responder
  3. Avatar de Lucas
    Lucas

    >Considere-se um merda aquele que não consegue
    >gerar números aleatórios na
    >linguagem em trabalha!

    Considere-se um *****, pois esqueceu a palavra ‘que’ na frase acima!
    hahahaahahahahahaa

    Pros novatos:

    Bom trabalho Elcio, o blog está legal.

    Responder
  4. Avatar de Sylar
    Sylar

    Considere-se um merda aquele que não consegue gerar números aleatórios na linguagem em trabalha!

    Esses novatos preguiçosos e sem neurônios alias não chamemos eles de: AMEBAS!

    Saudações!

    Responder
  5. Avatar de Micox
    Micox

    Elcio, vc é realmente um mestre.
    Comé que acha uma solução tão simples…

    Muito boa a sua solução.
    Para o pessoal do php que está com dúvida aí acima, o nome da função para geração de aleatórios no php é a mesma do asp: rand() – http://br.php.net/rand.

    Responder
  6. Avatar de Daniel Silva
    Daniel Silva

    Élcio, porque que acontece isso? Não entendi muito bem o porquê que faz o arquivo sempre ser carregado…. Pois se o arquivo não for atualizado o do cache vai ser usado? Ou SEMPRE é carrgado o arquivo?

    Responder
  7. Avatar de Diego Tolentino
    Diego Tolentino

    eu uso assim
    echo ”;

    dai nem preciso ficar me preocupando se atualizei o css o tal fica uma coisa mais automatica.

    Responder
  8. Evitando caching ao atualizar arquivos CSS | BrunoTorres.net

    […] do automaticamente. Feito isso você pode apagar o arquivo estilo.css original. [update]A técnica do Élcio é bem mais simples, elegante e eficiente. Hoje em dia, é o que uso.[/update] G […]

    Responder
  9. Avatar de Sérgio Siegrist
    Sérgio Siegrist

    Cabe observar que “não vai ficar com a versão antiga em cache” não corresponde completamente à realidade. Vai ficar com todas as versões em cache, mas somente a última versão é solicitada pelas páginas atualizadas e, portanto, somente ela é usada.
    A permanência em cache será conforme as regras do navegador.

    Responder
  10. Avatar de Ricardo
    Ricardo

    Bom!
    Já estou pensando em fazer 3 css, num projeto que envolve mudanças temporárias… daí cada css seria carregado em horas diferentes do dia, mudando sutilmente a aparência da página, sabe, aquela coisa de user experience…

    Legal isso de cache, hein ? 🙂

    Escrevi há uns dias algo mais básico pro pessoal.

    falouuu

    Responder
  11. Avatar de DeCo
    DeCo

    Eu tb uso xD
    Não só pra isso, tb uso pra js e foto.
    Principalmente para avatar quando o cara pode fazer upload para trocar, então boto o timestamp da data de atualização 🙂

    Responder
  12. Avatar de Cosme Faé
    Cosme Faé

    Faço as palavras do Vitor, as minhas. =]

    Responder
  13. Avatar de Vitor
    Vitor

    Po élcio ! maneirissimo ter dado essa dica, eu sempre via isso.. mas nunca achei nada explicando o que era.. e qnt poder fazer isso em php tb.. ia ser legal.. mas tb não achei .. =X nem google =S.. como faria em php . .vc sabe ?
    vlw ! to adorando a nova fase do blog.. vários posts .. sempre atualizado.. parabéns =]

    Responder

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *