From 68fc8e96a9629e73469ed457abd955e548ec670c Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:49:58 +0100 Subject: unslug pt-br: move --- files/pt-br/orphaned/tools/css_coverage/index.html | 136 +++++++++++++++++++++ 1 file changed, 136 insertions(+) create mode 100644 files/pt-br/orphaned/tools/css_coverage/index.html (limited to 'files/pt-br/orphaned/tools/css_coverage') diff --git a/files/pt-br/orphaned/tools/css_coverage/index.html b/files/pt-br/orphaned/tools/css_coverage/index.html new file mode 100644 index 0000000000..31d1c8be34 --- /dev/null +++ b/files/pt-br/orphaned/tools/css_coverage/index.html @@ -0,0 +1,136 @@ +--- +title: CSS Coverage +slug: Tools/CSS_Coverage +tags: + - CSS + - cobertura CSS +translation_of: Tools/CSS_Coverage +--- +
{{ToolsSidebar}}
+

Este componente é experimental e não está ainda avaliado no Firefox

+
+ +

CSS cobertura é um conjunto de comandos para Ferramentas de desenvolvimento Firefox que ajuda, desembaraçar a bagunça CSS pelo CSS que não está sendo usado, e indicando as artes de seus arquivos CSS que são necessárias para a renderização inicial.

+ +

Essas ferramentas são de algum modo experimental porque a definição de "uso".é complicado, mas se espera que dará uma ajuda no trabalho do que está acontecendo.

+ +

O caminho que eles usam no geral é:

+ + + +

Um outro comando ("csscoverage oneshot") permite você efetivamente rodar ("csscoverage start; csscoverage stop").

+ +

O que "uso" significa?

+ +

TL;DR:

+ +

CSS cobertura checa se o tag#id.class seletor no exemplo abaixo existe em um conjunto de páginas web.

+ +
@media thing {
+  tag#id.class:hover {
+    foo: bar;
+  }
+}
+ +

Porque?

+ +

Supostamente seu CSS tem o seguinte: Se, durante o teste, seu mouse não entrar o span. Esta regra é usada?

+ +
<style>
+  span:hover {
+    color: purple;
+  }
+</style>
+
+<span>Test</span>
+
+ +

Tecnicamente span:hover não foi usado naquela palavra 'Test' não foi sempre colorido roxo, no entanto a cobertura CSS é realmente sobre estar vendo quais regras são relevantes ou irrelevantes, e span:hover claramente tem relevância para a página..

+ +

Similarmente, suponha que o seu CSS tenha o seguinte:

+ +
<style>
+  @media tv {
+    span {
+      color: purple;
+    }
+  }
+</style>
+
+<span>Test</span>
+
+ +

Você deve estar querendo plugar uma TV dentro de seu ambiente em ordem para medir relevância? 

+ +

Mas 'use' não é somente sobre relevância 

+ +

É a seguinte regra relevante:

+ +
<style>
+  span { }
+</style>
+
+<span>Test</span>
+
+ +

Isto pode ser argumentado que não é relevante porque não tem efeito na página e pode portanto se seguramente removido

+ +

No entanto acontece o seguinte:

+ +
<style>
+  span {
+    -o-text-curl: minor;
+  }
+</style>
+
+<span>Test</span>
+
+ +

Conhecendo se isto é ou não provável requer o uso de mecanismo de pesquisa e alguma técnica analítca, e pode até mesmo saber a versão do browser suportado em seu site. Estas são todas consideradas além do escopo desta ferramenta até a singularidade.

+ +

Isto também explica o porquê da div de regra é considerada "usada" no seguinte exemplo.

+ +
<style>
+  div { color: red; }
+  span { color: blue; }
+</style>
+
+<div><span>Test</span></div>
+
+ +

Pode ser argumentado que a div em regra não é usada desde que não afete a renderização final da página, no entanto considere esta alternativa definição:

+ +
<style>
+  div { color: red; border: none; }
+  span { color: blue; }
+</style>
+
+ +

Dífícil saber se a borda em regra é usada, e há muitas outras variações; considere opacidade, visibilidade e conversão de cor ao qual está mais complicando a definição de "uso". Para guardar uma coisa simples, "uso" significaque o seletor acerta um elemento.

+ +

Claramente se uma folha de estilo que você alterou durante um teste contém uma regra para um particular página que não é visto durante o teste, então nós marcaremos que esta regra é não "usada" apesar de haver sido vezes alterado. Então vale dobrar  checando antes de você remover as regras do arquivo CSS.

+ +

Ressalvas

+ +

Tenha consciência destas coisas:

+ + + +

Erros

+ +

Nós estamos trabalhando em um número de imortantes bugs ( erros ):

+ + -- cgit v1.2.3-54-g00ecf