Há muito CSS agora? Inteligência de dados PlatoBlockchain. Pesquisa vertical. Ai.

Existe muito CSS agora?

Como desenvolvedores front-end, desejamos muitas coisas ao longo dos anos - maneiras de centralizar as coisas em CSS, encapsular estilos, definir a proporção de um elemento, obter controle mais refinado sobre nossas cores, selecionar um elemento com base em seu propriedades dos filhos, gerenciar camadas de especificidade, permitir que os elementos respondam à largura de seus pais... a lista é infinita.

E agora que conseguimos tudo o que desejávamos e muito mais, alguns de nós estão perguntando - agora temos demais CSS?

Os tempos sombrios

Se você, como eu, começou no desenvolvimento web durante a infância do CSS, a ideia de ter muito disso parece ridícula.

Antigamente, praticamente toda a descrição do trabalho de um desenvolvedor front-end consistia em lidar com as limitações do CSS. O hack de correção clara para limpar os flutuadores, o Hack de preenchimento 100% para fazer divs quadrados, sem mencionar a aplicação semi-aleatória de propriedades não relacionadas para enganar o Internet Explorer e fazê-lo cumprir seu lance.

Na época, o navegador era um inimigo tortuoso a ser derrotado por meio de astúcia e encantamentos misteriosos. Hoje, a propriedade perfeita está esperando e basta copiar e colar no MDN.

A nova era do CSS

Mas hoje as coisas são muito diferentes: não só as coisas estão acontecendo muito mais rápido, mas os fornecedores de navegadores realmente me importo sobre deixar os desenvolvedores felizes! Eu sei, eu também não conseguia acreditar. Mas eu corro o anual Estado do CSS pesquisa de desenvolvedor (que é a propósito, abra agora - vá pegá-lo!) e sei com certeza que as equipes de desenvolvimento de navegadores usam os resultados da pesquisa (entre muitos outros pontos de dados) para informar seu roteiro.

Além disso, o Google também ajudou a financiar meu trabalho na pesquisa e até contratou Lea Verou para assumir a liderança na seleção das perguntas da pesquisa deste ano.

Não é apenas o Google. Tornou-se moda criticar o Safari e a Apple em geral (às vezes merecidamente), mas você não pode negar o quão apaixonado alguém gosta Jennifer Simmons é ouvir os desenvolvedores e melhorar a web.

E os fornecedores de navegadores não estão apenas melhorando o CSS por conta própria; eles estão até colaborando através das linhas de batalha com iniciativas como Interoperabilidade 2023 para ajudar a reduzir inconsistências e incompatibilidades entre navegadores.

Muito de uma coisa boa?

O resultado de tudo isso é que agora nos deparamos com um constrangimento com a riqueza do CSS, e pode ser difícil alcançá-lo. Grade CSS começou a ser compatível com os principais navegadores há quase cinco anos, mas ainda verifico uma referência sempre que o uso. E tão legal quanto subgrade parece que ainda não experimentei.

Durante o processo de seleção quais recursos CSS incluir ou não no estado do CSS, Lea e eu consideramos muitos recursos, mas também rejeitamos alguns. Alguns exemplos do recurso que não incluem são:

  • A linear() função de flexibilização, que permite definir curvas de atenuação com mais granularidade. 
  • A env() função, que permite usar variáveis ​​definidas pelo navegador ou dispositivo. 
  • A scrollbar-width propriedade, que ajuda a controlar a aparência de uma barra de rolagem. 
  • A margin-trim propriedade, que permite controlar como as margens dos filhos de um contêiner se comportam. 

Tudo isso é potencialmente muito útil e teria sido uma grande notícia durante a seca de CSS dos últimos anos. Mas no contexto atual eles precisam lutar por atenção com anúncios muito maiores, como o seletor has() ou o aninhamento CSS!

Não estou animado

Como Silvestar Bistrovic escreve, ele “não está muito animado com todos esses novos recursos CSS”. Isso encontrou eco no Twitter, com Sara Soueidan afirmando que o que importa para ela é “a praticidade, não o quão brilhante um recurso parece no momento”.

Isso pode parecer uma atitude negativa, mas acho que é compreensível. Não se pode esperar que ninguém acompanhe tantos novos recursos!

Outra consequência não intencional (ou talvez intencional?) É que quanto mais complexo o CSS se torna, mais ele eleva o padrão para qualquer nova empresa que queira desenvolver um mecanismo de navegador - para não falar da carga de trabalho adicional quando se trata de manter e documentar tudo. esses novos recursos. 

Excesso de CSS

Há também a preocupação válida de que o CSS possa estar se ramificando em áreas com as quais não é adequado lidar. Isso é outra coisa que Sara Soueidan apontou ao reagir à nova implementação experimental do CSS Toggles (aqui está um ticket discutindo isso):

Muitos argumentaram que esse tipo de comportamento seria melhor tratado por um novo elemento HTML em vez de gerenciar o estado de alternância puramente por meio de CSS, e que CSS pode não ser o melhor meio para garantir que os problemas de acessibilidade sejam resolvidos adequadamente. 

Quando o CSS assume algo que antes era tratado por meio de JavaScript, isso geralmente é visto como uma coisa boa, pois muitas vezes reduz a quantidade de código que o navegador precisa carregar. Portanto, estou cautelosamente otimista em relação ao CSS Toggles e confio que o Grupo de Trabalho CSS abordará adequadamente as preocupações da comunidade. Mas ainda pode chegar o dia em que começaremos a nos preocupar com a possibilidade de o CSS estar se expandindo além de suas fronteiras e invadindo as responsabilidades do HTML e do JavaScript.

Novas expectativas

E talvez seja isso que precisa mudar: talvez devêssemos abandonar a expectativa que os desenvolvedores de CSS têm de saber todos os de CSS? 

Essa expectativa vem da época em que o CSS era uma reflexão tardia, aquela pequena sintaxe chata que você tinha que aprender para deixar seu botão azul e em negrito exatamente como o cliente pediu. Mas acho que precisamos aceitar que o CSS de hoje pode ser vasto demais para ser dominado por uma única pessoa, especialmente além de outras tarefas de front-end.

As Michelle Barker coloca:

E é aí que eu mesmo caio no final. Eu me reconciliei com o fato de que provavelmente nunca usarei — ou mesmo conhecerei — todos os recursos CSS possíveis. E isso vem de alguém que faz uma pesquisa sobre CSS!

Mas estas novas funcionalidades serão certamente úteis para alguém. Alguém escreverá posts sobre eles, criará CodePens legais com eles, dará palestras sobre eles. Essa pessoa será um desenvolvedor legal, jovem e enérgico que ainda terá todo o cabelo. Em outras palavras, não serei eu – e tudo bem. 

E talvez você esteja preocupado com a possibilidade de esse novo desenvolvedor ficar sobrecarregado com todas as coisas que precisa aprender de uma vez. Mas tenha em mente todas as coisas que eles não vai preciso aprender, precisamente porque foi substituído por essas alternativas mais recentes. Eu sei que aceitaria esse acordo a qualquer momento.

Mas pense nisso: nos últimos dois anos, não só vimos um enorme aumento no número de dispositivos que precisamos atender, como também começamos a reconhecer que todos nós consumimos a web de maneiras ligeiramente diferentes, seja por a deficiências, contexto atual ou apenas preferências pessoais. O CSS não deveria se adaptar a esta nova realidade?

Agora, tenho que confessar que tudo isso me deixou um pouco nostálgico… então, com licença, enquanto vou limpar alguns carros alegóricos, só para relembrar os velhos tempos.


Como mencionei, o anual Pesquisa sobre o estado do CSS agora está aberto. Quer você ache que há muito CSS ou não, a pesquisa é uma ótima maneira de informar aos desenvolvedores de navegadores como você se sente. vá preencher se você tiver 10 minutos. 

Carimbo de hora:

Mais de Truques CSS