Prefixo de navegadores

[MathCunhaDev]

Eae, boa tarde!

Estou fazendo um curso da Alura e eles começaram a falar sobre os prefixos css que os navegadores usam, parei e me perguntei, isso ainda é válido? Em 2019 os navegadores ainda não padronizaram todo o CSS? Devo obrigatoriamente usar?

Pergunto isso pois vejo o código de muitos sites e até agora não encontrei nenhum que esteja utilizando prefixos pro css.

[luizbills]

Hoje em dia está mais "tranquilo". Mas existe ferramentas como autoprefixer para você não precisar ligar para isso.

[vNNi]

Firefox e Chrome ainda tem muita coisa diferente, uma delas é o overflow: scroll, em um adiciona uma barra horrível e outro não, então vale a pena ficar esperto, mas são casos bem específicos !

[vhfmag]

Claro que propriedades e valores prefixados específicos ficam obsoletos com o tempo (display: -moz-grid ou -webkit-hyphen: manual), mas acho difícil prefixos em si ficarem obsoletos, já que o CSS continua recebendo novas (e maravilhosas) funcionalidades e os browsers implementam propostas ainda instáveis como parte do processo de padronização.

Dito isso, ferramentas como autoprefixer podem consumir um campo browserslist no seu package.json e só adicionar os prefixos relevantes para os navegadores que você pretende suportar: https://css-tricks.com/browserlist-good-idea/. Aí você entrega a melhor experiência possível, com o menor CSS possível, sem se preocupar 😄

Como exemplo, acabou de sair uma nova versão do autoprefixer que adiciona prefixos à propriedade mask-composite: https://github.com/postcss/autoprefixer/releases/tag/9.5.0

[ninetails]

Em relação a ser válido usar, tudo vai depender para quais navegadores você vai querer que seu site (ou para quem vc esteja fazendo site) dê suporte.

Galera aponta o autoprefixer (a maioria das ferramentas para transpilar estilo possuem esta funcionalidade, algumas talvez precisem de configuração prévia) pois assim vc escreve seu código sem se preocupar com os prefixos e assim você ganha mais segurança em relação a não ser surpreendido quando seu estilo quebrar em certos navegadores, uma preocupação a menos por um ganho com custo quase zero no caso de já utilizar ferramentas para transpilação.

Estamos em 2019, vejo que da mesma forma que navegadores possuem maior suporte também não vejo a necessidade de publicar estilos feitos na unha e javascript baunilha sem passar por toolings e automatizações para projetos que requerem um mínimo de manutenabilidade.

[MathCunhaDev]

@luizbills Cara, fui ver essa parada do autoprefixer e vai me ajudar demais, valeu!

@vhfmag Pelo que entendi isso acaba me fazendo ter que ter uma noção maior do projeto e quais navegadores e versões serão o alvo dos acessos, para assim, poder decidir suportalos ou não.

@ninetails Um amigo ontem me deu exatamente essa perspectiva.

[vhfmag]

@matcunha sim, quem for configurar isso vai precisar ter uma noção de quais navegadores se deseja suportar. Mas vale ressaltar que a configuração não precisa ser extremamente granular (ex: Firefox 62, Chrome 50, etc), existem tem alternativas mais declarativas (ex: todos os browsers com mais de 0,5% de market share que não tenham parado de receber manutenção ou cobrir 95% dos usuários no Brasil, etc) :)

[kvnol]

Também uso o Autoprefixer e que maravilha que é não precisar criar mixins só pra colocar prefixos.