in dev

ASP.NET MVC 6 – Image Tag Helper

A forma que está sendo desenvolvida a nova versão do ASP.NET 5 está garantindo uma grande interação e feedback com os desenvolvedores, consequentemente uma significativa melhora em várias assuntos, desde o desenvolvimento independente de plataforma, até questões de design(de projeto) e melhorias de performance.

Falando em performance, segundo alguns estudos o front-end ainda é o responsável por 80% do tempo de carregamento de uma página, uma técnica bastante utilizada para melhorar esta performance é utilizar headers de expiração em arquivos (css, js, img’s e htmls) para que o navegador dos nossos clientes mantenham uma versão daquele recurso no cache (client), evitando assim que seja necessário realizar um outro download ou request para aquele arquivo. Porém ao utilizar esta técnica (cache client side) exige que implementemos maneiras de versionar nossos arquivos, para evitar aquela famosa frase (dá um control+f5).

Recentemente foi lançada uma versão beta do ASP.NET 5 Beta 5 e com ela uma novo Tag Helper que achei muito interessante, o Image Tag Helper, com ele é possível chamar uma imagem e automaticamente o ASP.NET MVC se encarregada de colocar um parâmetro de versionamento no src do html gerado pela tag .

Para utilizar ele é só adicionar um atributo na tag img:

<img asp-file-version=”true” src=”~/imagens/logo.jpeg” />

Com isto ele renderiza o seguinte html:

<img src=”~/imagens/logo.jpeg?v=y6ciun0nNmT8quXbLjuNYAqdCf2uVCGFlRg9v6AUCAc” />

Qualquer alteração no conteúdo da imagem, acarretará a mudança no id que foi concatenado com o arquivo 🙂

Bom espero que este post seja útil, estou a disposição para dúvidas, criticas e sugestões

abs

Rodolfo