<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>zezologs&#187; Performance</title>
	<atom:link href="http://www.zezologs.org/blog/tag/performance/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.zezologs.org/blog</link>
	<description>teste de software, prevenção de erros, automação</description>
	<lastBuildDate>Thu, 08 Sep 2011 12:49:25 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Definindo Requisito-Não Funcional de Performance</title>
		<link>http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/</link>
		<comments>http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/#comments</comments>
		<pubDate>Thu, 28 Aug 2008 12:18:39 +0000</pubDate>
		<dc:creator>eudescosta</dc:creator>
				<category><![CDATA[Performance]]></category>

		<guid isPermaLink="false">http://www.zezologs.org/blog/?p=316</guid>
		<description><![CDATA[<p>A definição do requisito não funcional de performance é uma atividade muito particular de cada projeto de desenvolvimento, assim sendo, as preocupações variam muito de projeto em projeto. No entanto, algumas preocupações podem ser muito similares dependendo da natureza, tipo e plataforma em que a aplicação é desenvolvida.</p>
<p>Irei postar aqui uma lista com algumas preguntas que podem ajudar muito aqueles que necerssitam definir este requisito não-funcional, as perguntas a seguir não são &#8220;<em>leis</em>&#8221; e sim um guia inicial para a definição deste requisito, este questionário deverá mudar bastante contendo informações específicas do seu projeto.</p>
<p>Com isto em mente vamos ao questionário:</p>
<p></p>
<p>1.    Qual a quantidade de requisições simultâneas nos horários de pico?<br />
2.    Qual a quantidade de requisições por segundo será demandada aos nossos serviços?<br />
3.   Qual o tempo de resposta médio esperado?<br />
4.    Quantos usuários logado no sistema a aplicação deverá suportar?<br />
5.    Qual a importância dos testes de performance no escopo do projeto?<br />
6.    Quais os cenários mais críticos envolvendo performance dentro da aplicação?<br />
7.    Qual o volume médio de transações diárias? e qual o pico de demanda?<br />
8.    Qual a taxa de crescimento de usuários prevista?<br />
9.    Qual o tamanho médio em bytes destas transações?<br />
10.    Qual a velocidade dos links que proverão acesso a aplicação?<br />
11.   Quais as preocupações relacionadas a performance já existem?<br />
12.    Qual a taxa de crescimento (estimativa) da base de dados.<br />
13.    Existe necessidade de execução em cluster (aplicação rodando em varias instâncias).<br />
14    Qual a configuração utilizada no servidor que hospedará a aplicação?<br />
14.1    Quais fabricantes?<br />
14.2    Quantos processadores têm cada servidor? caso haja mais de um.<br />
14.3    Quando de memória RAM?<br />
14.4    Qual o cache utilizado?<br />
14.5    Como é implementada a segurança dos servidores?<br />
14.6    Existe algum cluster instalado?<br />
15.    Existe alguma solução para balanceamento de carga adotada?<br />
Se sim:<br />
15.1    Qual plataforma?<br />
15.2    Qual arquitetura?<br />
15.3    Qual o mecanismo de controle de seção?<br />
15.4    O balanceamento é feito por hardware ou software?</p>
<p>Qualquer dúvida é só comentar!</p>
<br><hr /><h2>comentários</h2><li><a href="http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/">sexta-feira, setembro 12, 2008</a>, <a href='http://sembugs.blogspot.com' rel='external nofollow' class='url'>Elias Nogueira</a> comentou: Eudes, 
Parabens! Muito bom esse questionário!!!
Aproveitando, posso atualizar o documento de Questionário de Teste de Performance com estes teus pontos também?

Abraço!</li><br><li><a href="http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/">sexta-feira, setembro 12, 2008</a>, <a href='http://www.zezologs.org' rel='external nofollow' class='url'>eudescosta</a> comentou: Opa Elias,

Pode sim cara, fica a vontade!

Abraço.</li><br><li><a href="http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/">quinta-feira, setembro 8, 2011</a>, <a href='http://www.zezologs.org/blog/ferramentas-de-teste-jmeter-2/' rel='external nofollow' class='url'>Ferramentas de Teste: JMeter (2) | zezologs</a> comentou: [...] aqui sobre como elicitar o requisito não-funcional de performance. Definir este requisito não é uma [...]</li><br><hr /><h2>leia mais...</h2><ul><li><a href="http://www.zezologs.org/blog/ferramentas-de-teste-jmeter-2/" rel="bookmark" title="Permanent Link: Ferramentas de Teste: JMeter (2)">Ferramentas de Teste: JMeter (2)</a></li><li><a href="http://www.zezologs.org/blog/identificando-gargalos-em-net-com-contadores-de-performance/" rel="bookmark" title="Permanent Link: .NET e Contadores de Performance">.NET e Contadores de Performance</a></li><li><a href="http://www.zezologs.org/blog/testes-instveis-do-selenium/" rel="bookmark" title="Permanent Link: Testes Instáveis do Selenium">Testes Instáveis do Selenium</a></li><li><a href="http://www.zezologs.org/blog/dicas-jmeter-once-only-controller/" rel="bookmark" title="Permanent Link: Dicas JMeter: &#8216;Once Only Controller&#8217;">Dicas JMeter: &#8216;Once Only Controller&#8217;</a></li><li><a href="http://www.zezologs.org/blog/dicas-firebug-e-yslow/" rel="bookmark" title="Permanent Link: Dicas: Firebug e YSlow">Dicas: Firebug e YSlow</a></li></ul><br>
<div align="center"><font face="Tahoma"><font color="#999999" face="Tahoma">Copyright &copy; 
    2007-2008 zezologs.org <strong>|</strong> 
    Todos os direitos reservados <strong>|</strong>
    <font color="#637c32"><strong></strong></font></font><font face="Tahoma"><a href="http://www.zezologs.org/blog/mobile/">Acessibidade</a> 
    <font color="#637c32"><strong>|</strong></font></font> <font face="Tahoma"><a href="http://www.wordpress.com">WordPress 
    </a> </font> <p>A definição do requisito não funcional de performance é uma atividade muito particular de cada projeto de desenvolvimento, assim sendo, as preocupações variam muito de projeto em projeto. No entanto, algumas preocupações podem ser muito similares dependendo da natureza, tipo e plataforma em que a aplicação é desenvolvida.</p>
<p>Irei postar aqui uma lista com algumas preguntas que podem ajudar muito aqueles que necerssitam definir este requisito não-funcional, as perguntas a seguir não são &#8220;<em>leis</em>&#8221; e sim um guia inicial para a definição deste requisito, este questionário deverá mudar bastante contendo informações específicas do seu projeto.</p>
<p>Com isto em mente vamos ao questionário:</p>
<p></p>
<p>1.    Qual a quantidade de requisições simultâneas nos horários de pico?<br />
2.    Qual a quantidade de requisições por segundo será demandada aos nossos serviços?<br />
3.   Qual o tempo de resposta médio esperado?<br />
4.    Quantos usuários logado no sistema a aplicação deverá suportar?<br />
5.    Qual a importância dos testes de performance no escopo do projeto?<br />
6.    Quais os cenários mais críticos envolvendo performance dentro da aplicação?<br />
7.    Qual o volume médio de transações diárias? e qual o pico de demanda?<br />
8.    Qual a taxa de crescimento de usuários prevista?<br />
9.    Qual o tamanho médio em bytes destas transações?<br />
10.    Qual a velocidade dos links que proverão acesso a aplicação?<br />
11.   Quais as preocupações relacionadas a performance já existem?<br />
12.    Qual a taxa de crescimento (estimativa) da base de dados.<br />
13.    Existe necessidade de execução em cluster (aplicação rodando em varias instâncias).<br />
14    Qual a configuração utilizada no servidor que hospedará a aplicação?<br />
14.1    Quais fabricantes?<br />
14.2    Quantos processadores têm cada servidor? caso haja mais de um.<br />
14.3    Quando de memória RAM?<br />
14.4    Qual o cache utilizado?<br />
14.5    Como é implementada a segurança dos servidores?<br />
14.6    Existe algum cluster instalado?<br />
15.    Existe alguma solução para balanceamento de carga adotada?<br />
Se sim:<br />
15.1    Qual plataforma?<br />
15.2    Qual arquitetura?<br />
15.3    Qual o mecanismo de controle de seção?<br />
15.4    O balanceamento é feito por hardware ou software?</p>
<p>Qualquer dúvida é só comentar!</p>
<br><hr /><h2>comentários</h2><li><a href="http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/">sexta-feira, setembro 12, 2008</a>, <a href='http://sembugs.blogspot.com' rel='external nofollow' class='url'>Elias Nogueira</a> comentou: Eudes, 
Parabens! Muito bom esse questionário!!!
Aproveitando, posso atualizar o documento de Questionário de Teste de Performance com estes teus pontos também?

Abraço!</li><br><li><a href="http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/">sexta-feira, setembro 12, 2008</a>, <a href='http://www.zezologs.org' rel='external nofollow' class='url'>eudescosta</a> comentou: Opa Elias,

Pode sim cara, fica a vontade!

Abraço.</li><br><li><a href="http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/">quinta-feira, setembro 8, 2011</a>, <a href='http://www.zezologs.org/blog/ferramentas-de-teste-jmeter-2/' rel='external nofollow' class='url'>Ferramentas de Teste: JMeter (2) | zezologs</a> comentou: [...] aqui sobre como elicitar o requisito não-funcional de performance. Definir este requisito não é uma [...]</li><br><hr /><h2>leia mais...</h2><ul><li><a href="http://www.zezologs.org/blog/ferramentas-de-teste-jmeter-2/" rel="bookmark" title="Permanent Link: Ferramentas de Teste: JMeter (2)">Ferramentas de Teste: JMeter (2)</a></li><li><a href="http://www.zezologs.org/blog/identificando-gargalos-em-net-com-contadores-de-performance/" rel="bookmark" title="Permanent Link: .NET e Contadores de Performance">.NET e Contadores de Performance</a></li><li><a href="http://www.zezologs.org/blog/testes-instveis-do-selenium/" rel="bookmark" title="Permanent Link: Testes Instáveis do Selenium">Testes Instáveis do Selenium</a></li><li><a href="http://www.zezologs.org/blog/dicas-jmeter-once-only-controller/" rel="bookmark" title="Permanent Link: Dicas JMeter: &#8216;Once Only Controller&#8217;">Dicas JMeter: &#8216;Once Only Controller&#8217;</a></li><li><a href="http://www.zezologs.org/blog/dicas-firebug-e-yslow/" rel="bookmark" title="Permanent Link: Dicas: Firebug e YSlow">Dicas: Firebug e YSlow</a></li></ul><br>
<div align="center"><font face="Tahoma"><font color="#999999" face="Tahoma">Copyright &copy; 
    2007-2008 zezologs.org <strong>|</strong> 
    Todos os direitos reservados <strong>|</strong>
    <font color="#637c32"><strong></strong></font></font><font face="Tahoma"><a href="http://www.zezologs.org/blog/mobile/">Acessibidade</a> 
    <font color="#637c32"><strong>|</strong></font></font> <font face="Tahoma"><a href="http://www.wordpress.com">WordPress 
    </a> </font> ]]></description>
		<wfw:commentRss>http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>14 Regras B&#225;sicas Para Aplica&#231;&#245;es WEB</title>
		<link>http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/</link>
		<comments>http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/#comments</comments>
		<pubDate>Thu, 14 Aug 2008 23:57:04 +0000</pubDate>
		<dc:creator>eudescosta</dc:creator>
				<category><![CDATA[Performance]]></category>
		<category><![CDATA[Aplicações WEB]]></category>

		<guid isPermaLink="false">http://www.zezologs.org/blog/?p=312</guid>
		<description><![CDATA[<p>Recebi uma indicação de <a href="http://www.linkedin.com/pub/3/28a/143">Saulo Dourado</a>, designer gráfico do <a href="http://www.cesar.org.br/">CESAR</a>, de um livro chamado &#8220;<a href="http://www.livrariacultura.com.br/scripts/cultura/resenha/resenha.asp?nitem=2127241&amp;sid=89816811810814716578802174&amp;k5=268E07DC&amp;uid=">High Performance Web Sites</a>&#8221; que contém uma lista de 14 &#8220;regras&#8221; para o desenvolvimento de frontends eficientes, estas mesmas 14 regras são usadas no YSlow, que abordei em &#8220;<a href="http://www.zezologs.org/blog/dicas-firebug-e-yslow/">Dicas: Firebug e YSlow</a>&#8220;.</p>
<p>O autor do livro e do YSlow é <a href="http://stevesouders.com/">Steve Sounders</a> um guru na arte e ciência de performance em aplicações WEB.</p>
<p>As 14 regras são:</p>
<p></p>
<p><strong>Regra 1: Minimize HTTP Requests</strong></p>
<p>Problema) 80-90% do tempo navegando em uma página WEB é gasto em requisições HTTP, requisições estas que envolvem Imagens, Scripts, CSS, Flash que são referenciados no HTML.</p>
<p>Solução 01) Use <a href="http://en.wikipedia.org/wiki/Image_map">Image Maps</a></p>
<p>Imagem Maps é uma técnica que mapeia uma imagem, ao invés de carragar cada imagem individualmente como fazemos de costume, criamos uma imagem unica e mapeamos cada parte da imagem via javascript.</p>
<p>Exemplos: <a title="http://stevesouders.com/examples/imagemap.php" href="http://stevesouders.com/examples/imagemap.php">http://stevesouders.com/examples/imagemap.php</a>, <a title="http://en.wikipedia.org/wiki/Image_map" href="http://en.wikipedia.org/wiki/Image_map">http://en.wikipedia.org/wiki/Image_map</a></p>
<p>Solução 02) Similar ao Image Maps só que com CSS</p>
<p>Exemplo: <a title="http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/" href="http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/">http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/</a></p>
<p><strong>Regra 2: Use CDN´s (Content Delivery Network)</strong></p>
<p>Assim como descrito na 1º Regra &#8220;<strong>80-90% do tempo navegando em uma página WEB é gasto em requisições HTTP.</strong>&#8221;</p>
<p>CDN´s são servidores que hospedam conteúdo estático em servidores separados da sua aplicação, ou em caso de portais de grande porte, este conteúdo não somente é de conteúdo estático, como tambem de todo o conteúdo do site, que seria distribuído baseado na região de onde a requisições foi feita.</p>
<p><strong>Regra 3: Use &#8220;</strong><a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html"><strong>Expires Header</strong></a><strong>&#8220;</strong></p>
<p>Problema) Browsers usam cache para reduzir a quantidade de HTTP requests.</p>
<p>Solução) &#8220;Expires Headers&#8221; fala por quanto tempo um componente deve ser armazenado em cache.</p>
<p><strong>Regra 4: Utilize Gzip</strong></p>
<p>Problema) Excesso de HTTP Requests, causado pelos componetes de uma aplicação (imagens, css, etc)</p>
<p>Solução) Comprima seus arquivos usando gzip. A maioria dos browsers disponíveis no mercado suportam compressão de aquivos via o &#8216;Accept-Encoding&#8217;.</p>
<p>Gzip é o mais popular e eficiente método de compressão atualmente.</p>
<p>Exemplos) <a title="http://www.weberdev.com/get_example-3993.html" href="http://www.weberdev.com/get_example-3993.html">http://www.weberdev.com/get_example-3993.html</a></p>
<p><strong>Regra 5: Mova CSS para o topo</strong></p>
<p>Problema) CSS no final provoca demora no carregamento da página.</p>
<p>Solução) Esta prática, acredito que todos fazem a contento, pelo menos desde que comecei a trabalhar com WEB costumo por os CSS no topo, mas para aqueles que o inserem no final da página, vai ai o alerta, isso afeta o carregamento de suas páginas, a explicação é bastante óbvia, quando o browser recebe uma solicitação, ele procura primeiro quais elementos gráficos carregar para depois carregar o conteúdo da página, tornando o CSS no final um equívoco.</p>
<p><strong>Regra 6: Mova scripts para baixo</strong></p>
<p>Ao contrário do CSS, os scripts em sua maioria devem ser movidos para o final da pagina, deixando os scripts no &lt;HEAD&gt; podem afetar o carregamento gradual da página, movendo os scripts para final, permite a paralelização do download do conteúdo do site.</p>
<p><strong>Regra 7: Evite expressões em CSS</strong></p>
<p>Muitos utilizam expressões em CSS para definir um background-color que mudem dinamicamente, a cada hora, isso é um exemplo de uso desnecessário de expressões em CSS, neste caso, isto poderia estar em um script em javascript, php, C#, etc&#8230; .</p>
<p><strong>Regra 8: &#8216;Inlined&#8217; JavaScript e CSS </strong></p>
<p>Não consegui uma tradução para esta regra, mas irei explicar do que se trata.</p>
<p>&#8216;Inline&#8217; Javasctipt e CSS diz respeito a incluir os CSS e o Javascript inteiro na página ao invés de deixa-los em arquivos externos, como fazemos de costume.</p>
<p><strong>Regra 9: Minimize Domínios</strong></p>
<p>Algumas aplicações precisam fazer verificações de DNS, tente reduzir isso ao máximo.</p>
<p><strong>Regra 10: Minimize JavaScript</strong></p>
<p>Trata-se de uma boa prática em relação a confecção de CSS. Esta boa prática diz respeito a nomenclatura usada nos elementos.</p>
<p>Reduzir ao máximo o nome dos elementos, ou seja, fazer um refactoring no CSS.</p>
<p><strong>Regra 11: Evite Redirecionamentos</strong></p>
<p>Redirecimentos são usados para rotear uma URL para outra URL, está prática, por motivos claros reduzem o tempo de carregamento das páginas.</p>
<p><strong>Regra 12: Remova Scritps Duplicados</strong></p>
<p>Da mesma forma que temos que fazer refactoring periódicos, no código de nossas aplicações, devemos fazer refactoring  tambem no código do nosso front-end.</p>
<p>Muitas vezes esquecemos que o front-end tambem tem código <img src='http://www.zezologs.org/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<p><strong>Regra 13: Desabilite ETags</strong></p>
<p>ETags é um mecanismo que webservers e browsers usam para determinar se o componente do cache do browser combina com com o que está no servidor.</p>
<p>O problema com ETags é qu eles são tipicamente construidos usando atributos que os tornam únicos para o servidor que hospeda o site, logo eles nunca vão combinar com o cache do browser.</p>
<p><strong>Regra 14: Cache AJAX</strong></p>
<p>Como a própria regra fala, permita que o AJAX utilize o cache so seu browser</p>
<p>Todos os exemplos acima estão muito bem organizados <a href="http://stevesouders.com/examples/rule-min-http.php">aqui</a>, o autor destas regras é o <a href="http://stevesouders.com/">Steve Sounders</a>, eu apenas traduzi para o português algumas partes importantes das 14 regras.</p>
<p>Estas regras, não se aplicam em todos os casos, mas é importante termos a consciência de que elas existem e que a não adoção de muitas destas regras, implicará em redução da performance de sua aplicação.</p>
<br><hr /><h2>comentários</h2><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">sexta-feira, agosto 15, 2008</a>, <a href='http://www.via6.com/topico.php?tid=210901' rel='external nofollow' class='url'>Eudes via Rec6</a> comentou: <strong>14 Regras Básicas Para Aplicações WEB | ...zezologs...</strong>

Lista de 14 regras a serem utilizadas em projetos de desenvolvimento de aplicações WEB. ...</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">domingo, agosto 17, 2008</a>, <a href='http://dihitt.com.br/story/14-regras-basicas-para-aplicacoes-web-' rel='external nofollow' class='url'>eudescosta no diHITT</a> comentou: <strong>14 Regras Básicas Para Aplicações WEB ...</strong>

Lista de 14 regras definidas por Steve Sounders, a serem utilizadas em projetos de desenvolvimento de aplicações WEB visando a melhoria da performance do produto final. ...</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">domingo, agosto 17, 2008</a>, <a href='http://www.digga.com.br/story.php?id=19' rel='external nofollow' class='url'>www.digga.com.br</a> comentou: <strong>14 Regras Básicas Para Aplicações WEB...</strong>

Recebi uma indicação de Saulo Dourado, designer gráfico do CESAR, de um livro chamado “High Performance Web Sites” que contém uma lista de 14 “regras” para o desenvolvimento de frontends eficientes, estas mesmas 14 regras são usadas no YSl...</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">quarta-feira, agosto 20, 2008</a>, Silvio Blauth comentou: ≈up≈</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">terça-feira, outubro 28, 2008</a>, Claudio comentou: ≈up≈ Valeu!! Muito bom!</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">quarta-feira, junho 1, 2011</a>, Antonio carlos comentou: ≈up≈</li><br><hr /><h2>leia mais...</h2><ul><li><a href="http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/" rel="bookmark" title="Permanent Link: Definindo Requisito-Não Funcional de Performance">Definindo Requisito-Não Funcional de Performance</a></li><li><a href="http://www.zezologs.org/blog/top-10-vulnerabilidades-em-aplicaes-web/" rel="bookmark" title="Permanent Link: Top 10 vulnerabilidades em aplicações web">Top 10 vulnerabilidades em aplicações web</a></li><li><a href="http://www.zezologs.org/blog/dicas-firebug-e-yslow/" rel="bookmark" title="Permanent Link: Dicas: Firebug e YSlow">Dicas: Firebug e YSlow</a></li><li><a href="http://www.zezologs.org/blog/ferramentas-de-teste-jmeter-2/" rel="bookmark" title="Permanent Link: Ferramentas de Teste: JMeter (2)">Ferramentas de Teste: JMeter (2)</a></li><li><a href="http://www.zezologs.org/blog/ferramentas-de-testes-selenium/" rel="bookmark" title="Permanent Link: Ferramentas de Teste: Selenium">Ferramentas de Teste: Selenium</a></li></ul><br>
<div align="center"><font face="Tahoma"><font color="#999999" face="Tahoma">Copyright &copy; 
    2007-2008 zezologs.org <strong>|</strong> 
    Todos os direitos reservados <strong>|</strong>
    <font color="#637c32"><strong></strong></font></font><font face="Tahoma"><a href="http://www.zezologs.org/blog/mobile/">Acessibidade</a> 
    <font color="#637c32"><strong>|</strong></font></font> <font face="Tahoma"><a href="http://www.wordpress.com">WordPress 
    </a> </font> <p>Recebi uma indicação de <a href="http://www.linkedin.com/pub/3/28a/143">Saulo Dourado</a>, designer gráfico do <a href="http://www.cesar.org.br/">CESAR</a>, de um livro chamado &#8220;<a href="http://www.livrariacultura.com.br/scripts/cultura/resenha/resenha.asp?nitem=2127241&amp;sid=89816811810814716578802174&amp;k5=268E07DC&amp;uid=">High Performance Web Sites</a>&#8221; que contém uma lista de 14 &#8220;regras&#8221; para o desenvolvimento de frontends eficientes, estas mesmas 14 regras são usadas no YSlow, que abordei em &#8220;<a href="http://www.zezologs.org/blog/dicas-firebug-e-yslow/">Dicas: Firebug e YSlow</a>&#8220;.</p>
<p>O autor do livro e do YSlow é <a href="http://stevesouders.com/">Steve Sounders</a> um guru na arte e ciência de performance em aplicações WEB.</p>
<p>As 14 regras são:</p>
<p></p>
<p><strong>Regra 1: Minimize HTTP Requests</strong></p>
<p>Problema) 80-90% do tempo navegando em uma página WEB é gasto em requisições HTTP, requisições estas que envolvem Imagens, Scripts, CSS, Flash que são referenciados no HTML.</p>
<p>Solução 01) Use <a href="http://en.wikipedia.org/wiki/Image_map">Image Maps</a></p>
<p>Imagem Maps é uma técnica que mapeia uma imagem, ao invés de carragar cada imagem individualmente como fazemos de costume, criamos uma imagem unica e mapeamos cada parte da imagem via javascript.</p>
<p>Exemplos: <a title="http://stevesouders.com/examples/imagemap.php" href="http://stevesouders.com/examples/imagemap.php">http://stevesouders.com/examples/imagemap.php</a>, <a title="http://en.wikipedia.org/wiki/Image_map" href="http://en.wikipedia.org/wiki/Image_map">http://en.wikipedia.org/wiki/Image_map</a></p>
<p>Solução 02) Similar ao Image Maps só que com CSS</p>
<p>Exemplo: <a title="http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/" href="http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/">http://css-tricks.com/css-sprites-what-they-are-why-theyre-cool-and-how-to-use-them/</a></p>
<p><strong>Regra 2: Use CDN´s (Content Delivery Network)</strong></p>
<p>Assim como descrito na 1º Regra &#8220;<strong>80-90% do tempo navegando em uma página WEB é gasto em requisições HTTP.</strong>&#8221;</p>
<p>CDN´s são servidores que hospedam conteúdo estático em servidores separados da sua aplicação, ou em caso de portais de grande porte, este conteúdo não somente é de conteúdo estático, como tambem de todo o conteúdo do site, que seria distribuído baseado na região de onde a requisições foi feita.</p>
<p><strong>Regra 3: Use &#8220;</strong><a href="http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html"><strong>Expires Header</strong></a><strong>&#8220;</strong></p>
<p>Problema) Browsers usam cache para reduzir a quantidade de HTTP requests.</p>
<p>Solução) &#8220;Expires Headers&#8221; fala por quanto tempo um componente deve ser armazenado em cache.</p>
<p><strong>Regra 4: Utilize Gzip</strong></p>
<p>Problema) Excesso de HTTP Requests, causado pelos componetes de uma aplicação (imagens, css, etc)</p>
<p>Solução) Comprima seus arquivos usando gzip. A maioria dos browsers disponíveis no mercado suportam compressão de aquivos via o &#8216;Accept-Encoding&#8217;.</p>
<p>Gzip é o mais popular e eficiente método de compressão atualmente.</p>
<p>Exemplos) <a title="http://www.weberdev.com/get_example-3993.html" href="http://www.weberdev.com/get_example-3993.html">http://www.weberdev.com/get_example-3993.html</a></p>
<p><strong>Regra 5: Mova CSS para o topo</strong></p>
<p>Problema) CSS no final provoca demora no carregamento da página.</p>
<p>Solução) Esta prática, acredito que todos fazem a contento, pelo menos desde que comecei a trabalhar com WEB costumo por os CSS no topo, mas para aqueles que o inserem no final da página, vai ai o alerta, isso afeta o carregamento de suas páginas, a explicação é bastante óbvia, quando o browser recebe uma solicitação, ele procura primeiro quais elementos gráficos carregar para depois carregar o conteúdo da página, tornando o CSS no final um equívoco.</p>
<p><strong>Regra 6: Mova scripts para baixo</strong></p>
<p>Ao contrário do CSS, os scripts em sua maioria devem ser movidos para o final da pagina, deixando os scripts no &lt;HEAD&gt; podem afetar o carregamento gradual da página, movendo os scripts para final, permite a paralelização do download do conteúdo do site.</p>
<p><strong>Regra 7: Evite expressões em CSS</strong></p>
<p>Muitos utilizam expressões em CSS para definir um background-color que mudem dinamicamente, a cada hora, isso é um exemplo de uso desnecessário de expressões em CSS, neste caso, isto poderia estar em um script em javascript, php, C#, etc&#8230; .</p>
<p><strong>Regra 8: &#8216;Inlined&#8217; JavaScript e CSS </strong></p>
<p>Não consegui uma tradução para esta regra, mas irei explicar do que se trata.</p>
<p>&#8216;Inline&#8217; Javasctipt e CSS diz respeito a incluir os CSS e o Javascript inteiro na página ao invés de deixa-los em arquivos externos, como fazemos de costume.</p>
<p><strong>Regra 9: Minimize Domínios</strong></p>
<p>Algumas aplicações precisam fazer verificações de DNS, tente reduzir isso ao máximo.</p>
<p><strong>Regra 10: Minimize JavaScript</strong></p>
<p>Trata-se de uma boa prática em relação a confecção de CSS. Esta boa prática diz respeito a nomenclatura usada nos elementos.</p>
<p>Reduzir ao máximo o nome dos elementos, ou seja, fazer um refactoring no CSS.</p>
<p><strong>Regra 11: Evite Redirecionamentos</strong></p>
<p>Redirecimentos são usados para rotear uma URL para outra URL, está prática, por motivos claros reduzem o tempo de carregamento das páginas.</p>
<p><strong>Regra 12: Remova Scritps Duplicados</strong></p>
<p>Da mesma forma que temos que fazer refactoring periódicos, no código de nossas aplicações, devemos fazer refactoring  tambem no código do nosso front-end.</p>
<p>Muitas vezes esquecemos que o front-end tambem tem código <img src='http://www.zezologs.org/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<p><strong>Regra 13: Desabilite ETags</strong></p>
<p>ETags é um mecanismo que webservers e browsers usam para determinar se o componente do cache do browser combina com com o que está no servidor.</p>
<p>O problema com ETags é qu eles são tipicamente construidos usando atributos que os tornam únicos para o servidor que hospeda o site, logo eles nunca vão combinar com o cache do browser.</p>
<p><strong>Regra 14: Cache AJAX</strong></p>
<p>Como a própria regra fala, permita que o AJAX utilize o cache so seu browser</p>
<p>Todos os exemplos acima estão muito bem organizados <a href="http://stevesouders.com/examples/rule-min-http.php">aqui</a>, o autor destas regras é o <a href="http://stevesouders.com/">Steve Sounders</a>, eu apenas traduzi para o português algumas partes importantes das 14 regras.</p>
<p>Estas regras, não se aplicam em todos os casos, mas é importante termos a consciência de que elas existem e que a não adoção de muitas destas regras, implicará em redução da performance de sua aplicação.</p>
<br><hr /><h2>comentários</h2><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">sexta-feira, agosto 15, 2008</a>, <a href='http://www.via6.com/topico.php?tid=210901' rel='external nofollow' class='url'>Eudes via Rec6</a> comentou: <strong>14 Regras Básicas Para Aplicações WEB | ...zezologs...</strong>

Lista de 14 regras a serem utilizadas em projetos de desenvolvimento de aplicações WEB. ...</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">domingo, agosto 17, 2008</a>, <a href='http://dihitt.com.br/story/14-regras-basicas-para-aplicacoes-web-' rel='external nofollow' class='url'>eudescosta no diHITT</a> comentou: <strong>14 Regras Básicas Para Aplicações WEB ...</strong>

Lista de 14 regras definidas por Steve Sounders, a serem utilizadas em projetos de desenvolvimento de aplicações WEB visando a melhoria da performance do produto final. ...</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">domingo, agosto 17, 2008</a>, <a href='http://www.digga.com.br/story.php?id=19' rel='external nofollow' class='url'>www.digga.com.br</a> comentou: <strong>14 Regras Básicas Para Aplicações WEB...</strong>

Recebi uma indicação de Saulo Dourado, designer gráfico do CESAR, de um livro chamado “High Performance Web Sites” que contém uma lista de 14 “regras” para o desenvolvimento de frontends eficientes, estas mesmas 14 regras são usadas no YSl...</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">quarta-feira, agosto 20, 2008</a>, Silvio Blauth comentou: ≈up≈</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">terça-feira, outubro 28, 2008</a>, Claudio comentou: ≈up≈ Valeu!! Muito bom!</li><br><li><a href="http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/">quarta-feira, junho 1, 2011</a>, Antonio carlos comentou: ≈up≈</li><br><hr /><h2>leia mais...</h2><ul><li><a href="http://www.zezologs.org/blog/definindo-requisito-nao-funcional-de-performance/" rel="bookmark" title="Permanent Link: Definindo Requisito-Não Funcional de Performance">Definindo Requisito-Não Funcional de Performance</a></li><li><a href="http://www.zezologs.org/blog/top-10-vulnerabilidades-em-aplicaes-web/" rel="bookmark" title="Permanent Link: Top 10 vulnerabilidades em aplicações web">Top 10 vulnerabilidades em aplicações web</a></li><li><a href="http://www.zezologs.org/blog/dicas-firebug-e-yslow/" rel="bookmark" title="Permanent Link: Dicas: Firebug e YSlow">Dicas: Firebug e YSlow</a></li><li><a href="http://www.zezologs.org/blog/ferramentas-de-teste-jmeter-2/" rel="bookmark" title="Permanent Link: Ferramentas de Teste: JMeter (2)">Ferramentas de Teste: JMeter (2)</a></li><li><a href="http://www.zezologs.org/blog/ferramentas-de-testes-selenium/" rel="bookmark" title="Permanent Link: Ferramentas de Teste: Selenium">Ferramentas de Teste: Selenium</a></li></ul><br>
<div align="center"><font face="Tahoma"><font color="#999999" face="Tahoma">Copyright &copy; 
    2007-2008 zezologs.org <strong>|</strong> 
    Todos os direitos reservados <strong>|</strong>
    <font color="#637c32"><strong></strong></font></font><font face="Tahoma"><a href="http://www.zezologs.org/blog/mobile/">Acessibidade</a> 
    <font color="#637c32"><strong>|</strong></font></font> <font face="Tahoma"><a href="http://www.wordpress.com">WordPress 
    </a> </font> ]]></description>
		<wfw:commentRss>http://www.zezologs.org/blog/14-regras-bsicas-para-aplicaes-web/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
	</channel>
</rss>

