A cloud-driven APP dynamic page implementation method

Abstract

The present invention provides a method for implementing a cloud-driven dynamic page for an app. This method implements the dynamic update function of the app by requesting page data from the cloud and then parsing and rendering it into an app function page. The present invention has the advantages of supporting dynamic updates without publishing a version; low development cost, direct page development through the web page editing function; fast page loading (data is filled in the cloud, and diff differences are updated); strong interactivity (based on native rendering); dynamic configuration of app functions (cloud-controlled); grayscale update version control (cloud-controlled), etc.

Description

Technical Field

[0001] The present invention relates to the field of mobile APPs, and in particular to a method for implementing APP dynamic pages driven by the cloud. Background Art

[0002] Updates to mobile apps need to be submitted to the app store for review, and if everything goes well, it will take 1-3 working days before they can be officially released to users. Faced with today's rapidly growing user and marketing needs, how to allow users to experience new features as quickly as possible is a question that every APP needs to think about. The essence of this is how to implement APP function / content updates that do not depend on their version. The current mainstream implementation solution is to use RN (ReactNative, a development framework developed by Facebook) to implement cloud-based patch delivery to the APP. After the APP merges the patches, it implements new features. This technology is called hot update. The main steps are: 1. The APP integrates a hot update framework (such as RN); 2. Developers write and create patch packages based on the hot update framework and host them on the hot update platform; 3. The APP will request and download the patch package the next time it is started, and merge it into the APP; 4. The APP runs the latest features provided by the patch.

[0003] However, the above steps have the following problems and defects: 1. New pages are restricted by the application version and must be updated before they can be used; 2. APP content is constrained by the page layout and cannot be expanded freely; 3. The template page UI layout is single and the performance is poor; 4. The active page cannot be reused, and there is a large amount of useless code after multiple iterations, resulting in a waste of resources; 5. Version control issues in grayscale testing; 6. The page performance is weak and cannot support highly interactive pages; 7. The development cost is high, and the development time of a large number of active pages is long and the life cycle is short; 8. The development efficiency is low, and each patch must be adapted to each APP version; 9. The project management is chaotic, and the extensive use of patches will cause the APP version and content to get out of control. Summary of the Invention

[0004] The present invention addresses the above-mentioned shortcomings and problems by providing a method for implementing a cloud-driven APP dynamic page. This method requests page data from the cloud, parses and renders it into an APP function page, and thus implements the APP dynamic update function.

[0005] The specific steps are as follows:

[0006] A method for implementing a cloud-driven APP dynamic page includes the following steps.

[0007] (1) Edit the page. Use the web page editing function to build the page with existing UI elements and bind them to data types.

[0008] (2) Page abstraction: retain the page structure and data type of the edited page and convert them into JSON data format for storage;

[0009] (3) When the APP accesses a dynamic page, it will first display a loading animation on the page and request page data from the backend;

[0010] (4) After receiving the request from the APP, the backend matches the corresponding page and fills in the business data according to the data type bound to the page;

[0011] (5) The backend returns the filled page data to the APP;

[0012] (6) After the APP receives the page data, it will first instantiate the business data according to the data type bound to the page;

[0013] (7) The APP traverses the received page structure, extracts all node components, and instantiates them in sequence through the page parser;

[0014] (8) After all node components are instantiated, business data is filled into the nodes;

[0015] (9) Assemble the components in sequence according to the page structure;

[0016] (10) Render the page.

[0017] Furthermore, for step (7), if there is a page cache locally at this time, the diff algorithm will be triggered to perform differential comparison on the nodes to find the different nodes.

[0018] Furthermore, you only need to instantiate different nodes in the future, which can greatly improve the page loading speed.

[0019] Web page editing function: provides basic UI components. Users can complete page editing by adding components to the drawing board. Each component supports data binding.

[0020] Json generator: preserves the page structure and data type of the edited page and converts them into json data format for storage.

[0021] Page parser: traverses json page data and parses out component tree and data objects.

[0022] The present invention achieves this through 1. The Web end provides an APP page editing function, abstracting the saved page into a tree structure, which is saved in the Json data format; 2. The server end fills the data according to the data type defined in the page Json; 3. The APP end parses the page Json data after receiving it and renders the page; 4. The diff algorithm realizes the page Json difference update and improves the parsing speed.

[0023] It has the following beneficial effects: 1. Supports dynamic updates without publishing; 2. Low development cost, and pages can be developed directly through the Web page editing function; 3. Fast page loading (data is filled in the cloud, and diff differences are updated), and strong interactivity (based on native rendering); 4. APP functions can be dynamically configured (cloud control); 5. Grayscale update version control (cloud control). BRIEF DESCRIPTION OF THE DRAWINGS

[0024] Figure 1 Schematic diagram of the process of the present invention. DETAILED DESCRIPTION

[0025] The following will clearly and completely describe the technical solutions in the embodiments of the present invention in conjunction with the accompanying drawings. Obviously, the described embodiments are only part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without making creative efforts are within the scope of protection of the present invention.

[0026] like Figure 1 As shown: The process steps of the present invention are as follows:

[0027] 1. Create a page through the web page editing function, build a page with existing UI elements, and bind them to data types;

[0028] 2. Saving the page will strip away the display effects and data, retaining only the page structure and bound data types (Json generator);

[0029] 3. When the APP accesses a dynamic page, it will first display a loading animation on the page and request page data from the backend;

[0030] 4. After receiving the request from the APP, the backend matches the corresponding page and fills in the business data according to the data type bound to the page;

[0031] 5. The backend returns the filled page data to the APP;

[0032] 6. After the APP receives the page data, it will first instantiate the business data according to the data type bound to the page;

[0033] 7. The APP traverses the received page structure, extracts all node components, and instantiates them in sequence (page parser);

[0034] 8. After all node components are instantiated, fill the business data into the nodes;

[0035] 9. Assemble the components in sequence according to the page structure;

[0036] 10. Render the page;

[0037] 11. Supplement to step 7: If there is a local page cache at this time, the diff algorithm will be triggered to perform differential comparison on the nodes to find the different nodes;

[0038] 12. Due to the cache, only different nodes need to be instantiated in the future, which greatly improves the page loading speed.

[0039] Among them, the web page editing function: provides basic UI components, and users complete the page editing function by adding components to the drawing board. Each component supports data binding.

[0040] Json generator: preserves the page structure and data type of the edited page and converts them into json data format for storage.

[0041] Page parser: traverses json page data and parses out component tree and data objects.

[0042] The above describes in detail the preferred embodiments of this patent, but this patent is not limited to the above embodiments. Various changes can be made within the scope of knowledge possessed by ordinary technicians in this field without departing from the purpose of this patent.

Claims

1. A method for implementing a cloud-driven APP dynamic page, characterized by: The steps include: (1) Edit the page. Use the web page editing function to build the page with existing UI elements and bind them to data types. (2) Page abstraction: retain the page structure and data type of the edited page and convert them into JSON data format for storage; (3) When the APP accesses a dynamic page, it will first display a loading animation on the page and request page data from the backend; (4) After receiving the request from the APP, the backend matches the corresponding page and fills in the business data according to the data type bound to the page; (5) The backend returns the filled page data to the APP; (6) After the APP receives the page data, it will first instantiate the business data according to the data type bound to the page; (7) The APP traverses the received page structure, extracts all node components, and instantiates them one by one through the page parser. If there is a local page cache at this time, the diff algorithm will be triggered to perform differential comparison on the nodes to find the different nodes; (8) After all node components are instantiated, business data is filled into the nodes; (9) Assemble the components in sequence according to the page structure; (10) Render the page; (11) Subsequent instantiation only requires the nodes with differences.

Images