Re: Units of time in Web Animations [was: Intent to Ship: Element.animate]

I, too, expected much higher use while crafting CSS transitions in ms, but
I did a Github codesearch and was surprised that sec dominates ms for
transitions:

300ms<https://github.com/search?q=transition%3A+300ms&type=Code&ref=searchresults>
:
95k results
..3s<https://github.com/search?q=transition%3A+.3s&type=Code&ref=searchresults>
:
666k results

500ms<https://github.com/search?q=transition%3A+500ms&type=Code&ref=searchresults>
:
78k results
..5s<https://github.com/search?q=transition%3A+.5s&type=Code&ref=searchresults>
:
281k results

(GH Codesearch doesn't handle duplicates well, though, so these numbers
aren't perfect.)



However, as a counter example, I polled [1] (without bias, I hope!) to ask
what people expected these durations to mean:

> elem.animate({ opacity: '0' }, 100);
> elem.animate({ opacity: '0' }, 1);

The results: ~95% of people read these as millisecond durations.


[1] https://plus.google.com/+PaulIrish/posts/QchucJRH7BX


On Wed, Apr 16, 2014 at 3:40 PM, Jeremie Patonnier <
jeremie.patonnier@gmail.com> wrote:

> Hi :)
>
>
> 2014-04-17 0:30 GMT+02:00 Shane Stephens <shans@google.com>:
>
> On Thu, Apr 17, 2014 at 8:21 AM, Domenic Denicola <
>> domenic@domenicdenicola.com> wrote:
>>
>>>  Regardless of spec examples, all of the real-world CSS transition and
>>> animation code I've seen uses the ms unit, not the s one. I don't think CSS
>>> provides any guidance here.
>>>
>>
>> The first three sites I found transitions on use seconds:
>> google.com uses 0.1s, 0.5s (not 100ms, 500ms).
>> twitter.com uses 0.3s (not 300ms)
>> www.smh.com.au uses 0.4s, 0.1s (not 400ms, 100ms)
>>
>
> This is statistically inaccurate. There are millions of web sites out
> there. How those three could be representative of all the rest?
>
>
>> Literally the first 3 transitions tutorials I found use seconds:
>>
>> https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_CSS_transitions
>> http://css3.bradshawenterprises.com/transitions/
>> http://docs.webplatform.org/wiki/tutorials/css_transitions
>>
>
> Which does not presume of what users are truly doing. CSS support both
> second and millisecond. If both are supported, it's because both are used.
>
>
>> Do you have counter-examples?
>>
>
> Unfortunately, no time now to provide you a list, but basically, all the
> web sites my company is working on (we prefer using milliseconds... but I
> do not assume our behavior is the general one)
>
> It would be great if you could provide more accurate statistics.
>
> best
> --
> Jeremie
> .............................
> Web : http://jeremie.patonnier.net
> Twitter : @JeremiePat <http://twitter.com/JeremiePat>
>