Video Comment Display Reusing DOM Templates

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

The existing methods for displaying video comments on the internet are inefficient, leading to increased DOM creation time, frequent browser redrawing, and reduced browser performance due to the lack of reuse of comment styles.

Innovation Solution

A method and system that obtain a comment message list and a multiplex comment list, search for reusable comment styles, and multiplex them to generate a target comment object, reducing the need for frequent DOM creation and browser redrawing by reusing existing comment styles.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Productivity

If conventional methods are used to display video comments, then comment functionality is provided, but DOM creation time increases and browser performance decreases

Engineering Contradiction:

Improvecomment display efficiencyVSAvoidDOM creation time

Core Design Contradiction:

ProductivityVSLoss of time

Solution Approach 1:

The patent creates a template DOM element for comments that can be reused multiple times. When new comments need to be displayed, the system copies the existing template DOM element and modifies its content rather than creating entirely new DOM elements. This copying approach significantly reduces DOM creation time and improves rendering efficiency.

Inventive Principle:

Principle #26Copying

Solution Approach 2:

The patent pre-configures a template DOM element with all necessary comment display attributes, styles, and structure before actual comments need to be shown. This preliminary setup includes defining the comment container, text formatting, and interaction elements in advance, so that when comments are generated, only the content needs to be populated rather than building the entire structure from scratch.

Inventive Principle:

Principle #10Preliminary action

2Productivity

If conventional methods are used to display video comments, then comment functionality is provided, but browser redrawing frequency increases

Engineering Contradiction:

Improvecomment display efficiencyVSAvoidbrowser redrawing frequency

Core Design Contradiction:

ProductivityVSDuration of action of stationary object

Solution Approach 1:

By copying the template DOM element instead of creating new ones, the browser can reuse existing rendering contexts and styles. This reduces the number of times the browser needs to redraw comment elements, as the structural DOM tree remains stable while only text content changes.

Inventive Principle:

Principle #26Copying

Solution Approach 2:

Instead of creating new DOM elements for each comment and hoping for efficient rendering, the patent inverts the approach by creating one template element and copying it repeatedly. This inversion makes the DOM structure more stable and reduces rendering frequency, as the browser recognizes the repeated structure and optimizes its rendering process.

Inventive Principle:

Principle #13The other way round (Inversion)

3Adaptability or versatility

If comment styles are created for each comment message, then individual comment styling is achieved, but system complexity and processing overhead increase

Engineering Contradiction:

Improvecomment style flexibilityVSAvoidcomment style management complexity

Core Design Contradiction:

Adaptability or versatilityVSDevice complexity

Solution Approach 1:

The patent creates a universal template DOM element that serves all comment messages regardless of their content or source. This single template handles multiple functions: displaying different user comments, varying comment types, and diverse interaction elements. The template's universality reduces style management complexity while maintaining adaptability through dynamic content insertion.

Inventive Principle:

Principle #6Universality (Multi-functionality)

Solution Approach 2:

The patent separates the comment display functionality into two independent parts: the structural template (which remains constant) and the content data (which varies). This segmentation allows the template to be reused for all comments while only the text content needs to be customized for each specific comment, reducing overall system complexity.

Inventive Principle:

Principle #1Segmentation

Data Source

PatentUS11330338B2Method and system of displaying video comments, computing device, and readable storage medium

Publication Date: 2022.05.10 SHANGHAI BILIBILI TECH CO LTD

AI summary

The present disclosure describes techniques for displaying comments on videos. The disclosed techniques include obtaining a first list comprising a plurality of comment messages and a second list configured to store address information corresponding to at least one reusable comment style; determining whether the second list comprises the address information in response to a determination that a target comment message among the plurality of comment messages is initialized; selecting a piece of address information corresponding to a target comment style among the at least one reusable comment style in response to a determination that the second list comprises the address information; and generating a target comment object based on the target comment message and the target comment style corresponding to the selected piece of address information, wherein the target comment style comprises data indicative of effects of presenting the target comment message on a display device.