{"id":192382,"date":"2015-06-17T00:00:00","date_gmt":"2015-06-17T13:51:06","guid":{"rendered":"https:\/\/www.microsoft.com\/en-us\/research\/msr-research-item\/deterministic-replay-as-a-platform-for-understanding-dynamic-behaviors-in-web-programs\/"},"modified":"2019-09-30T17:44:49","modified_gmt":"2019-10-01T00:44:49","slug":"deterministic-replay-as-a-platform-for-understanding-dynamic-behaviors-in-web-programs","status":"publish","type":"msr-video","link":"https:\/\/www.microsoft.com\/en-us\/research\/video\/deterministic-replay-as-a-platform-for-understanding-dynamic-behaviors-in-web-programs\/","title":{"rendered":"Deterministic Replay as a Platform for Understanding Dynamic Behaviors in Web Programs"},"content":{"rendered":"
\n

The web is the most successful open application platform, where anyone can inspect a live application to see how it works. Despite readily inspectable source code and runtime state, web applications are still challenging to debug. In particular, dynamic behaviors-user interactions, animations, and asynchronous work-cannot be understood solely by looking at static source code. Several barriers stand in the way of understanding dynamic behaviors: reproducing nondeterministic behavior is often impossible; finding and comparing a behavior’s runtime states is time-consuming; and the code that implements a behavior is scattered across multiple DOM, CSS, and JavaScript files.<\/p>\n

In this talk, I will describe how pervasive, transparent, and fast deterministic record\/replay enables new tools for understanding dynamic behaviors. First, I will introduce Dolos: a browser-integrated replay infrastructure that can efficiently and precisely capture and reproduce dynamic behaviors on web pages. Then, I will describe several tools built on top of Dolos that support different program understanding tasks. Timelapse is an interface for visualizing and navigating a captured execution via its user inputs and tasks. Probes are a new feature for retroactively logging runtime states and going back in time to statements that produce outputs. Lastly, Scry is a tool that enables a developer to find the code that implements a behavior by working backward from visual output, to CSS and DOM state, and the JavaScript code responsible for each state. I will discuss the challenges involved in designing, building, and evaluating these tools, and future opportunities for developer tools and deterministic replay.<\/p>\n<\/div>\n

<\/p>\n","protected":false},"excerpt":{"rendered":"

The web is the most successful open application platform, where anyone can inspect a live application to see how it works. Despite readily inspectable source code and runtime state, web applications are still challenging to debug. In particular, dynamic behaviors-user interactions, animations, and asynchronous work-cannot be understood solely by looking at static source code. Several […]<\/p>\n","protected":false},"featured_media":199083,"template":"","meta":{"msr-url-field":"","msr-podcast-episode":"","msrModifiedDate":"","msrModifiedDateEnabled":false,"ep_exclude_from_search":false,"_classifai_error":"","msr_hide_image_in_river":0,"footnotes":""},"research-area":[],"msr-video-type":[206954],"msr-locale":[268875],"msr-post-option":[],"msr-session-type":[],"msr-impact-theme":[],"msr-pillar":[],"msr-episode":[],"msr-research-theme":[],"class_list":["post-192382","msr-video","type-msr-video","status-publish","has-post-thumbnail","hentry","msr-video-type-microsoft-research-talks","msr-locale-en_us"],"msr_download_urls":"","msr_external_url":"https:\/\/youtu.be\/GruERkA6Z0A","msr_secondary_video_url":"","msr_video_file":"","_links":{"self":[{"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-video\/192382","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-video"}],"about":[{"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/types\/msr-video"}],"version-history":[{"count":1,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-video\/192382\/revisions"}],"predecessor-version":[{"id":611814,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-video\/192382\/revisions\/611814"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/media\/199083"}],"wp:attachment":[{"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/media?parent=192382"}],"wp:term":[{"taxonomy":"msr-research-area","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/research-area?post=192382"},{"taxonomy":"msr-video-type","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-video-type?post=192382"},{"taxonomy":"msr-locale","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-locale?post=192382"},{"taxonomy":"msr-post-option","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-post-option?post=192382"},{"taxonomy":"msr-session-type","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-session-type?post=192382"},{"taxonomy":"msr-impact-theme","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-impact-theme?post=192382"},{"taxonomy":"msr-pillar","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-pillar?post=192382"},{"taxonomy":"msr-episode","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-episode?post=192382"},{"taxonomy":"msr-research-theme","embeddable":true,"href":"https:\/\/www.microsoft.com\/en-us\/research\/wp-json\/wp\/v2\/msr-research-theme?post=192382"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}