Native Runtime for HTML Graphics Rendering

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

Web applications, such as web browsers, are unable to fully utilize graphics processing units (GPUs) for rendering graphics, leading to suboptimal performance and limited graphics capabilities compared to native applications, which restricts their ability to efficiently render complex graphics content like games.

Innovation Solution

A native runtime environment that compiles JavaScript source code for graphics content into native graphics APIs, such as DirectX or OpenGL, and transmits these APIs to the GPU for direct rendering, allowing web applications to leverage GPU resources for improved performance and graphics quality.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Adaptability or versatility

If web applications use CPU-based graphics rendering, then platform independence and security are maintained, but graphics performance and quality are limited

Engineering Contradiction:

Improveplatform independenceVSAvoidgraphics rendering performance

Core Design Contradiction:

Adaptability or versatilityVSProductivity

Solution Approach 1:

The patent introduces a native runtime environment as an intermediary layer between web applications and the underlying operating system/GPU. This runtime translates HTML5 Canvas API calls into native graphics calls, enabling web applications to access GPU acceleration while maintaining their cross-platform nature. The compiler component translates JavaScript code into native machine code, and the runtime manages the bridge between the web application layer and platform-specific graphics APIs.

Inventive Principle:

Principle #24Intermediary (Mediator)

2Adaptability or versatility

If web applications use CPU-based graphics rendering, then software compatibility is maintained, but graphics quality and throughput are suboptimal

Engineering Contradiction:

Improvesoftware compatibilityVSAvoidgraphics quality

Core Design Contradiction:

Adaptability or versatilityVSManufacturing precision

Solution Approach 1:

The patent replaces the software-based CPU rendering mechanism with a hardware-accelerated GPU rendering system. By translating HTML5 Canvas operations into native graphics API calls that directly interface with the GPU, the system leverages dedicated graphics hardware to achieve higher rendering quality and throughput while maintaining compatibility through the translation layer.

Inventive Principle:

Principle #28Mechanics substitution (Replace mechanical system)

3Productivity

If native applications use GPU-based graphics rendering, then graphics quality and performance are improved, but platform-specific dependencies increase

Engineering Contradiction:

Improvegraphics rendering performanceVSAvoidplatform-specific dependencies

Core Design Contradiction:

ProductivityVSDevice complexity

Solution Approach 1:

The native runtime environment is designed to provide universal functionality across multiple platforms. It implements a platform-independent interface that translates web application graphics calls into platform-specific native calls, allowing the same web application to run with GPU acceleration on different operating systems and devices without modification. The runtime handles platform-specific details internally, presenting a unified interface to developers.

Inventive Principle:

Principle #6Universality (Multi-functionality)

4Reliability

If web applications cannot access native graphics APIs, then security and portability are maintained, but available computing resources are underutilized

Engineering Contradiction:

ImprovesecurityVSAvoidcomputing resource utilization

Core Design Contradiction:

ReliabilityVSUse of energy by moving object

Solution Approach 1:

The native runtime acts as a secure intermediary that controlledly bridges web applications and native graphics resources. It provides a sandboxed environment where web applications can access GPU acceleration through managed interfaces, maintaining security boundaries while enabling resource utilization. The runtime validates and manages API calls, ensuring secure access to hardware resources.

Inventive Principle:

Principle #24Intermediary (Mediator)

Data Source

PatentEP3752914B1Techniques for native runtime of hypertext markup language graphics content

Publication Date: 2023.07.19 MICROSOFT TECHNOLOGY LICENSING LLC

Figure 1
Figure 2
Figure 3A

AI summary

Examples described herein generally relate to natively rendering hypertext markup language (HTML) graphics content associated with source code at a computer device. Specifically, the computer device receives, at a compiler, the source code associated with graphics based content. The computer device further compiles at least a portion of the source code into native code including at least one graphics application program interface (API). Moreover, the computer device further determines, at a native bridge translator, that at least one native API associated with a graphics processing unit of the computer device corresponds to the graphics API. The computer device further transmits the at least one native API to the graphics processing unit for native rendering of the HTML graphics content at the computer device.