De acordo com caniuse.com, para os navegadores que suportam CSStransition e CSStransform, combinatoricamente, existem pelo menos três tipos diferentes:

Aqueles que exigem o-webkit- prefixo em ambostransition etransform (por exemplo, Safari 6, navegador Android <4.4).Aqueles que só exigem o-webkit- prefixo emtransform (por exemplo, Chrome 3x).Aqueles que requerem prefixos em nenhum dos dois (por exemplo, FF e IE10 / 11).

Como posso escrever com segurança meutransition estilos para que eles sejam analisados ​​corretamente em cada tipo? Eu vejo duas opções:

-webkit-transition: -webkit-transform 300ms;
        transition: -webkit-transform 300ms, transform 300ms;

ou

-webkit-transition: -webkit-transform 300ms;
        transition: -webkit-transform 300ms;
        transition: transform 300ms;

Agora, devido aos navegadores tipo 2 e tipo 3, preciso ter uma transição sem prefixo paraambos -webkit-transform e transform. O problema com a primeira opção é que eu me preocupo que os navegadores tipo 2 e tipo 3 não consigam analisar a segunda linha, pois eles sempre conterão uma propriedade não reconhecida. A questão é: como os navegadores lidam com propriedades inválidas dentro de umtransition--ignore a totalidadetransition estilo ou apenas ignorar a propriedade inválida?

Eu pensei que isso pode ser atenuado, separando-o em duas propriedades, de modo que, se um não for analisável, ele será ignorado. Além desta segunda opção ser um pouco detalhada, eu ainda me pergunto se, no caso dos navegadores tipo 2, o terceirotransition será unparseable e "redefinir" otransition de volta para null.

Alguma idéia de como isso funciona, geralmente? Além disso, quais delas são compatíveis com o futuro quando o Chromeet al. alternar entre-webkit-transform para o prefixo-lesstransform?