Virtual DOM Replay via Client-Side Command Generation

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

Current webpage replay technologies, including full DOM and differential DOM replay, face inefficiencies and network resource wastage due to the need to transfer entire or differential DOMs over the network for replaying user interactions.

Innovation Solution

A virtual Document Object Model (DOM) based method where the client generates simplified commands indicating virtual DOM changes, reducing data transfer by only sending these commands to the web server, allowing for efficient webpage replay without transferring full or differential DOMs.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Reliability

If full DOM or differential DOM is transferred over the network for webpage replay, then complete webpage state information is available for accurate replay, but network data transfer volume increases and network resources are wasted

Engineering Contradiction:

Improvewebpage replay accuracyVSAvoidnetwork resource consumption

Core Design Contradiction:

ReliabilityVSLoss of energy

Solution Approach 1:

The patent extracts only the essential change information from the DOM structure by using virtual DOM differential algorithms. Instead of transferring the entire DOM or complex differential DOM data, it extracts minimal command sets that represent only the necessary state changes, thereby reducing network transfer while preserving replay accuracy.

Inventive Principle:

Principle #2Taking out (Extraction)

Solution Approach 2:

The patent creates a virtual DOM as a lightweight copy representation of the actual DOM structure. This virtual DOM copy enables differential comparison and change detection without requiring transfer of the full DOM data, reducing network overhead while maintaining the ability to accurately replay webpage changes.

Inventive Principle:

Principle #26Copying

2Loss of energy

If simplified commands are generated and sent instead of full DOM data, then network data transfer is reduced, but the complexity of processing and interpreting these commands increases on the server side

Engineering Contradiction:

Improvenetwork data transferVSAvoidserver processing complexity

Core Design Contradiction:

Loss of energyVSDevice complexity

Solution Approach 1:

The patent performs preliminary processing of DOM changes on the client side by generating standardized commands before transmission. This preliminary action includes converting DOM differences into structured command formats with clear semantics, which reduces the burden on the server to interpret raw data and simplifies server-side processing despite the reduced data volume.

Inventive Principle:

Principle #10Preliminary action

Data Source

PatentUS11487931B1Replaying a webpage based on virtual document object model

Publication Date: 2022.11.01 INTERNATIONAL BUSINESS MACHINE CORPORATION

AI summary

According to one embodiment, a method, computer system, and computer program product for webpage replay is provided. The embodiment may include acquiring one or more commands each indicating changes of at least one virtual Document Object Model (DOM) node of a virtual DOM of a webpage corresponding to a timestamp for a session. The embodiment may include determining one or more virtual DOM differentials corresponding to respective timestamps for the session based on the one or more commands and a first data dictionary. The first data dictionary is created based on a base virtual DOM of the webpage including a plurality of virtual DOM nodes. The embodiment may include generating one or more patched virtual DOMs of the webpage corresponding to respective timestamps for the session. The embodiment may include replaying the webpage for the session based on the base virtual DOM and the patched virtual DOMs.