How to Capture Animations within Video

If you load http://www.lexus.com/models/LFA/ on your webpage and see you can check out the animation on the webpage whereas when I try to record the same experience using webpagetest I get stuck after a while. Is the solution to do a setTimeOut to a higher value or extend the test to a onger duration or is it simply not designed to capture animations/videos within wpt videos?

The video in question: http://www.webpagetest.org/video/view.php?id=130705_PF_153A.1.0

Greetings

I will certainly defer to the more knowledgeable Gurus here, but if I remember correctly the WebPagetest video is not a true video capture. Instead, it is a series of stills taken at each change to the screen. Each still is then duplicated the number of times necessary to match the frame rate and the duration of the change (i.e.: at 15fps, if the second screen change occurred at 1.5 seconds the first image would be duplicated 22 times. If the third change happened .3 sec later, the second image would be duplicated 5 times and so-on). When the page is fully loaded, all of these frames are then combined to create a ‘video’ of the loading of the page. It provides you a visually accurate impression of how the page looked while it was loading, but it’s not designed show a streamed video on the page. I could be wrong, but I’m pretty sure that’s the way it works.

Hope that helps.

Robert

It depends on when the animation is triggered (and to some extent how it is actually animated). WebPagetest will generally only run a test until the network activity finishes after the onload event so if the animation triggers after it has all downloaded then it may not be captured. This one looks like it is triggered pretty quickly though so that may not be the problem.

There is a “minimum test duration” under the advanced settings that you can use to get it to record longer.

The other issue may just be how the video itself is played. As Robert mentioned, WebPagetest does not record continuous video. It captures up to 10 screen shots per second but only when it detects explicit paint events (to keep the overhead to a minimum). If the video is hardware accelerated then it may not be detecting the events and triggering screen shots.

In general the goal is to be able to represent the user experience as well as possible but not necessarily for video capture of a video itself.

Thank you rlilly and pmeenan for the helpful explanations. I see that in my particular case, the trigger event is a scroll down on the webpage so will execute that using a script and then using the minimum test duration method mentioned I shall try a second time