Systems and methods for presenting web application content

Patent metadata

Field	Value
Publication number	US-2021326396-A1
Application number	US-202117361489-A
Country	US
Kind code	A1
Filing date	Jun 29, 2021
Priority date	Aug 29, 2019
Publication date	Oct 21, 2021
Grant date	—

Abstract

Methods, systems, and computer-readable medium are disclosed for presenting web application content. For example, a computer-readable medium may include instructions executable by one or more processors to perform operations including: executing a parent application using a web browser, the parent application being a single page application configured to display a web page element in the web browser; identifying a child application requested by a user action; obtaining, from a server system, child application code of the identified child application, the child application code defining a micro-frontend in a first programming language; transpiling the child application code from the first programming language to a second programming language executable by the web browser, to obtain a transpiled child application code renderable by the web browser; and rendering the transpiled child application code so that the micro-frontend is displayed in the web browser.

First claim

1 - 20 . (canceled)

21 . A computer-implemented method for presenting web application content, the method comprising:
executing, by one or more processors, a parent application using a web browser, the parent application being a single page application configured to display a web page element and one or more of a plurality of child applications in the web browser, wherein the parent application includes one or more shared interface components for each of the plurality of child applications; identifying, by the one or more processors, a first child application requested by a user action; obtaining, by the one or more processors, first child application code of the identified first child application, the first child application code defining a first micro-frontend; replacing, by the one or more processors, existing child application code in the web page element of the parent application with code based on the first child application code such that the first child application code is incorporated into the web page element; and rendering, by the one or more processors, the code based on the first child application code and the web page element using the web browser, so that the first micro-frontend is displayed in the web browser as part of the web page element.

22 . The computer-implemented method of claim 21 , wherein
the user action is indicative of a URL including a first child application identifier, and the identifying the first child application includes identifying the first child application based on the first child application identifier.

23 . The computer-implemented method of claim 22 , wherein the user action is a command to navigate the web browser to the URL.

24 . The computer-implemented method of claim 22 , wherein the obtaining the first child application code includes:
based on the first child application identifier, determining a first child application URL corresponding to the first child application; and sending, to the first child application URL, an asynchronous request requesting the first child application code.

25 . The computer-implemented method of claim 21 , further including:
transforming, by the one or more processors, the first child application code from a first programming language to a second programming language different than the first programming language, wherein the second programming language is executable by the web browser.

26 . The computer-implemented method of claim 21 , further including:
identifying, by the one or more processors, a second child application requested by a second user action, the second child application being associated with a second micro-frontend; and displaying, by the one or more processors, the second micro-frontend in the web browser as part of the web page element.

27 . The computer-implemented method of claim 26 , further including:
obtaining, by the one or more processors, second child application code of the second child application; replacing, by the one or more processors, the first child application code in the web page element of the parent application with code based on the second child application code such that the second child application code is incorporated into the web page element; and rendering, by the one or more processors, the code based on the second child application code and the web page element using the web browser, so that the second micro-frontend is displayed in the web browser as part of the web page element.

28 . The computer-implemented method of claim 27 , wherein the first child application code includes a first programming language, and the second child application code includes a second programming language different than the first programming language.

29 . The computer-implemented method of claim 28 , further including:
transforming, by the one or more processors, the second child application code from the second programming language to a third programming language that is executable by the web browser.

30 . The computer-implemented method of claim 21 , wherein the parent application is configured to display, in the web browser, a navigation graphical interface enabling a user of the web browser to request the child application to be displayed.

31 . A computer system for presenting web application content, the computer system comprising:
a memory storing instructions; and one or more processors configured to execute the instructions to perform operations including: executing a parent application using a web browser, the parent application being a single page application configured to display a web page element and one or more of a plurality of child applications in the web browser, wherein the parent application includes one or more shared interface components for each of the plurality of child applications; identifying a first child application requested by a user action; obtaining child application code of the identified first child application, the first child application code defining a first micro-frontend; replacing existing child application code in the web page element of the parent application with code based on the first child application code such that the first child application code is incorporated into the web page element; and rendering the code based on the first child application code and the web page element using the web browser, so that the first micro-frontend is displayed in the web browser as part of the web page element.

32 . The system of claim 31 , wherein
the user action is indicative of a URL including a first child application identifier, and the identifying the first child application includes identifying the first child application based on the first child application identifier.

33 . The system of claim 32 , wherein the user action is a command to navigate the web browser to the URL.

34 . The system of claim 32 , wherein the obtaining the first child application code includes:
based on the first child application identifier, determining a first child application URL corresponding to the first child application; and sending, to the first child application URL, an asynchronous request requesting the first child application code.

35 . The system of claim 31 , wherein the instructions further include:
transforming the first child application code from a first programming language to a second programming language different than the first programming language, wherein the second programming language is executable by the web browser.

36 . The system of claim 31 , wherein the instructions further include:
identifying a second child application requested by a second user action, the second child application being associated with a second micro-frontend; and displaying the second micro-frontend in the web browser as part of the web page element.

37 . The system of claim 36 , wherein the instructions further include:
obtaining second child application code of the second child application; replacing the code based on the first child application code in the web page element of the parent application with code based on the second child application code such that the second child application code is incorporated into the web page element; and rendering the code based on the second child application code and the web page element using the web browser, so that the second micro-frontend is displayed in the web browser as part of the web page element.

38 . The system of claim 37 , wherein the first child application code includes a first programming l

Assignees

• Capital One Services Llc

Inventors

• Chugh Ashwani
• Abiraman Karthick

Classifications

• G06F16/9577

  Optimising the visualization of content, e.g. distillation of HTML documents · CPC title

• G06F9/45529

  Embedded in an application, e.g. JavaScript in a Web browser · CPC title

• G06F40/14

  Tree-structured documents (parsing G06F40/205; validation G06F40/226) · CPC title

• G06F8/38

  for implementing user interfaces · CPC title

• G06F16/957 Primary

  Browsing optimisation, e.g. caching or content distillation · CPC title