A method, device, and medium for dynamically adjusting a webpage.

Abstract

This application discloses a method, device, and medium for dynamically adjusting a webpage. The method includes: generating a file reading script based on a front-end development framework; splitting the page design into multiple sub-components, encapsulating and encoding each sub-component into an independent component, and defining variables and functions for each sub-component; defining the JSON text format corresponding to the JSON file and mapping the JSON file to the corresponding sub-component; generating a dynamically loaded component and registering the dynamically loaded component to a specified module; obtaining user requirements and parsing the specified JSON file through the dynamically loaded component to achieve dynamic adjustment of the page. Based on a front-end development framework, dynamically converting a JSON file into the front-end components required by the page enables dynamic adjustment of functional pages using JSON after software packaging and release, eliminating the need for redevelopment and testing, saving significant source code development costs, and shortening the delivery cycle.

Description

Technical Field

[0001] This application relates to the field of computers, and specifically to a method, device, and medium for dynamically adjusting a page. Background Technology

[0002] With the development and improvement of industrial software, more and more traditional manufacturing enterprises are gradually promoting the informatization transformation of their own factories or production lines and applying large-screen industrial software in the production process.

[0003] In recent years, the interfaces of websites and software in the civilian internet sector have become increasingly aesthetically pleasing and user-friendly, with continuously improving functional integration. This trend will inevitably extend to the industrial software sector. Software vendors and customers alike expect more attractive and user-friendly interfaces, and there is a significant increase in demand for highly integrated large-screen functions such as dashboards, integrated cockpits, control centers, and data integration platforms.

[0004] For software developers, the number of customers is usually huge, and each customer's main business may be very different. Therefore, their needs for functional logic, data sources, display items, and indicator calculations are also different. In addition, customers usually have personalized preferences and expect that the large screen they use can be aesthetically pleasing, easy to use, and fit their business characteristics.

[0005] Using traditional product development logic, each new customer requires modifying the product source code, developing a completely new feature page for that customer, then packaging, testing, and finally delivering it online. This easily leads to the following problems:

[0006] 1. The cost of developing and testing new features is high, and the delivery cycle is long.

[0007] 2. The coexistence of customized functions for different clients: How to effectively manage customized functions for multiple clients as the number of clients increases. Summary of the Invention

[0008] To address the aforementioned problems, this application proposes a method for dynamically adjusting a page, comprising:

[0009] Based on the front-end development framework, a file reading script is generated to read JSON files in the front-end static folder, and the file reading script is mounted into the front-end project;

[0010] The page design is broken down into multiple sub-components. Based on the generated chart component for connecting to the data visualization chart library, the sub-components are encapsulated and coded into independent components. Variables and functions are defined for the sub-components, and the sub-components are registered to the module.

[0011] Define the JSON text format corresponding to the JSON file, and based on the JSON text format and the multiple sub-components split in the page design, complete the corresponding JSON file, and map the JSON file to the corresponding sub-components;

[0012] Generate a dynamically loaded component and register the dynamically loaded component with a specified module. The dynamically loaded component is used to dynamically load the sub-component.

[0013] The system obtains user requirements and determines a specific sub-component to implement those requirements. It then reads a specified JSON file corresponding to the specified sub-component using a file reading script and parses the specified JSON file using a dynamic loading component to dynamically adjust the page.

[0014] On the other hand, this application also proposes a device for dynamically adjusting a page, comprising:

[0015] At least one processor; and,

[0016] A memory communicatively connected to the at least one processor; wherein,

[0017] The memory stores instructions that can be executed by the at least one processor to enable the at least one processor to perform a dynamic page adjustment method as described in the above example.

[0018] On the other hand, this application also proposes a non-volatile computer storage medium storing computer-executable instructions, wherein the computer-executable instructions are configured as the page dynamic adjustment method described in the above example.

[0019] The dynamic adjustment method for the page proposed in this application can bring the following beneficial effects:

[0020] Based on a front-end development framework, JSON files are dynamically converted into the front-end components required by the page. This allows for dynamic adjustments to functional pages after software packaging and release, eliminating the need for redevelopment and testing, saving significant source code development costs, and shortening the delivery cycle. Leveraging the manageable and adjustable nature of JSON files, the potential for code redundancy in multi-version customization is avoided. Each customer receives a separate JSON file package, which is not included in the source code, ensuring a single, unified source code and reducing the difficulty and cost of maintaining and managing multiple customer branches. Furthermore, because it directly converts to native component scripts without involving iframe technology, development costs are reduced while maintaining page performance and user experience. Attached Figure Description

[0021] The accompanying drawings, which are included to provide a further understanding of this application and form part of this application, illustrate exemplary embodiments of this application and are used to explain this application, but do not constitute an undue limitation of this application. In the drawings:

[0022] Figure 1 This is a flowchart illustrating the dynamic adjustment method for pages in an embodiment of this application.

[0023] Figure 2 This is an overall flowchart of a method for dynamically adjusting a page in a given scenario, as provided in the embodiments of this application.

[0024] Figure 3 This is a flowchart illustrating file parsing via dynamically loaded components in one scenario, as provided in the embodiments of this application.

[0025] Figure 4 This is a schematic diagram of the dynamic adjustment device for the page in an embodiment of this application. Detailed Implementation

[0026] To make the objectives, technical solutions, and advantages of this application clearer, the technical solutions of this application will be clearly and completely described below in conjunction with specific embodiments and corresponding drawings. Obviously, the described embodiments are only a part of the embodiments of this application, and not all of them. Based on the embodiments in this application, all other embodiments obtained by those skilled in the art without creative effort are within the scope of protection of this application.

[0027] In the traditional process of custom-developing new front-end features, code redundancy is easily generated, development costs are high, and delivery cycles are long. Even if all types of components are completely abstracted to simplify reuse, adding or modifying pages still requires modifying the source code, packaging, testing, and finally delivery. For example, if the first homepage is developed for client A and the second for client B, additional logic needs to be developed to control the visibility of multiple custom pages to different users. Because of the coexistence of more page code, complexity increases, leading to a larger software size. The software received by client A actually includes code custom-developed for client B, resulting in redundancy.

[0028] Based on this, the technical solutions provided by the various embodiments of this application will be described in detail below with reference to the accompanying drawings.

[0029] like Figure 1 As shown in the embodiment of this application, a method for dynamically adjusting a page includes:

[0030] S101: Based on the front-end development framework, generate a file reading script for reading JSON files in the front-end static folder, and mount the file reading script to the front-end project.

[0031] Figure 2 This is an overall flowchart of a method for dynamically adjusting a page in a given scenario, provided in the embodiments of this application. The following is in conjunction with... Figure 1 and Figure 2 Provide an explanation.

[0032] Front-end development frameworks can include Angular, which is used to build the basic front-end functionality of the software. The back-end setup method and database are not restricted here. The back-end, relative to the front-end, consists of API interfaces, primarily retrieving data via HTTP requests. It is assumed here that these APIs are functional. Furthermore, it is generally assumed that front-end and back-end communication is normal, ports are open, there are no cross-origin issues or excessively long request content, and user login and basic system functions are running normally.

[0033] Besides the Angular framework, front-end development can often be done through iframes or source code development.

[0034] For iframes, each customized feature page requires a completely new development process, and the effect is achieved by linking different iframes or changing static page files. This requires a large amount of development work, and iframes inherently have disadvantages in terms of performance and page refresh, especially for interfaces with many visual effects, where poor performance affects the user experience.

[0035] For source code development, each new feature page needs to be developed entirely from scratch and treated as a new page. All the code for all feature pages is included in the software package, resulting in a large workload for code management and a higher risk of errors. Generally, additional feature display control logic also needs to be developed, making the overall development workload very large. In addition, code redundancy will increase the size of the software.

[0036] Therefore, when choosing the Angular framework, its built-in ability to dynamically load child components allows for loading child components at specified DOM element positions, meeting production-ready performance and saving development work. This approach extracts commonly used child components for coding, adding them as needed for newer types. These child components can be flexibly combined to create different functionalities. Essentially, a pre-developed child component template is used, and the required child components are dynamically rendered within the target DOM element. Child components have position, size, and other information, arranged in an orderly manner within the target DOM. Based on practical experience, large-screen child components can be broadly categorized into several types. Highly specialized components require separate development regardless of the approach used, representing special cases. This approach saves the cost of writing similar child components; each type is written only once, and after testing, minimal modifications are needed. However, it still requires arranging components in the source code, specifying component attributes and parameters, etc., to assemble different functionalities, then packaging, testing, and releasing. Once released, these modifications are not possible. In reality, due to various reasons outside of development, such custom functions involve repeatedly making adjustments to details and then reverting back to the original state, which is meaningless and requires developers to modify the source code each time, making it very cumbersome and time-consuming.

[0037] Regarding peripheral plugins, deployment methods, containerization, microservices, and other technologies, their use can be based on user needs and will not affect this application. The default deployment method is nginx for the front-end. When using industrial-related plugins in actual software, a Chrome-based browser can be used to view the front-end pages.

[0038] The front-end has one or more static folders, and the front-end can directly access CSS, JSON, and other JSON files in them. The default folder name is assets.

[0039] Written in JavaScript, it generates file reading scripts (such as...). Figure 2 As shown, this is also known as a JSON reading script. This script reads JSON files from the front-end static folder via AJAX requests. The JSON files in this application can be stored in the front-end static folder or in a database via the backend. If the JSON file is located in the database, a request to read the JSON file will be sent to the backend if it cannot be found directly.

[0040] Mount the file reading script to the front-end project to make the file reading script effective.

[0041] S102: The page design is split into multiple sub-components, and based on the generated chart component for connecting to the data visualization chart library, the sub-components are encapsulated and encoded into independent components, and the variables and functions of the sub-components are defined, and the sub-components are registered to the module.

[0042] For the Angular framework, it can utilize its built-in front-end routing suite or other feasible methods to break down the page design. In this embodiment, the page design is explained using the homepage dashboard as an example. After creating the Angular component, it is associated with the homepage route, and the navigation can be opened normally. At this time, the homepage is a blank page with no content.

[0043] Specifically, based on design and functional dimensions, the target functions contained in the page design are broken down into multiple sub-components. Taking the homepage dashboard as an example, sub-components include at least one of the following: pie chart, bar chart, line chart, progress bar, percentage dashboard, scrolling table, map, word cloud, and 3D model display window. For sub-components with data input functions, these include text boxes, drop-down menus, checkboxes, and date / time selection drop-down menus.

[0044] Develop and generate general-purpose Echarts-based components for connecting to data visualization chart libraries. These components can accept the full set of configuration parameters specified by Echarts. Based on this, commonly used Echarts chart components can be further encapsulated, such as bar and pie chart components. Other components, such as video playback components, 3D display components, and map components, can be developed separately.

[0045] Child components should expose necessary parameters to facilitate parameter passing and component adjustment.

[0046] The child components are encapsulated and coded into independent components. Echarts class chart child components are obtained by secondary encapsulation of general components, and only the necessary parameters are exposed. For example, when encapsulating a pie chart component, the background color, array variables, size, and events that respond to mouse interaction can all be extracted as variables. Changing the parameters will change the style and characteristics of the component.

[0047] And define all variables and functions in all child components with consistent variable or function names. For example, the title of all child components corresponds to the variable `title`, the width and height of the components correspond to the variables `width` and `height`, the data retrieval interface link corresponds to the variable `api`, the loading completion event corresponds to the function `onInit()`, the mouse click event corresponds to `onClick()`, and so on. Of course, each component can also have its own unique attributes; for example, a map component may have latitude and longitude coordinates, and a table component may involve pagination, etc.

[0048] As for two-way binding between component properties and variables, and the mapping between component events and functions, these can be implemented based on Angular's fundamental features. Additionally, generic data retrieval methods can be written; given a data retrieval URL and parameters, data can be requested from the backend. When developing a new data retrieval interface, it's crucial to ensure the returned data format remains consistent with previous versions to avoid the need to modify the frontend code.

[0049] Identify sub-components belonging to the same class and register them in the same module. For example, sub-components such as pie charts, bar charts, line charts, and progress bars all belong to the large-screen display category. Registering these components in the same module makes them easier to import when needed.

[0050] S103: Define the JSON text format corresponding to the JSON file, and based on the JSON text format and the multiple sub-components split in the page design, complete the corresponding JSON file, and map the JSON file to the corresponding sub-components.

[0051] Customize the JSON text writing using the JSON text format, and determine the structure and meaning of the JSON file according to the corresponding naming conventions in the JSON text format. Determine the meaning of the keys. For example, in the code writing process, the first level corresponds to the entire page, the keys of the first level correspond to certain attributes of the entire page, the childrens represent each child component, the title of each child component refers to the title to be displayed by the component, the type represents the component type, the height represents the component height, and the api specifies the data retrieval interface for this child component.

[0052] Define the data structure of the JSON file, specifying the mapping relationship between the keys in the JSON file and the information in the main homepage component. For example, "timer" corresponds to the refresh frequency, and "bg" corresponds to the overall homepage background. Define the data structure of the JSON file, specifying the mapping relationship between the keys in the JSON file and the information in the child components. For example, "data" corresponds to the data source of the child component, and "type" corresponds to the type of the child component.

[0053] After mapping the JSON files to their corresponding child components, a mapping relationship is established, with different JSON files corresponding to different child components.

[0054] The resulting JSON file can be used as a template for subsequent projects. Once finalized, the number of modifications is minimal; new keys and corresponding code logic can be added based on new project requirements. Utilizing a visual JSON editor or JavaScript's JSON serialization feature can improve writing efficiency. Assuming the homepage reads a static file named `index.json`, modifying or replacing this file will change the homepage content without altering the source code, unless new sub-components require additional development. Different homepage functionalities can be obtained by combining different JSON texts.

[0055] When perfecting the JSON file, complete the JSON value according to the customized goal. For example, "timer":5000 means refresh the data every 5 seconds, and "bg":"#000000" means the background of the entire page is black.

[0056] Additionally, if new sub-component types are added, they will be appended to the source code and corresponding extensions will be made in the JSON.

[0057] S104: Generate a dynamically loaded component and register the dynamically loaded component to a specified module. The dynamically loaded component is used to dynamically load the sub-component.

[0058] Dynamically loaded components (such as...) Figure 2 As shown, this component (also known as the core transformation component) can be generated based on Angular and registered in a specific module (referred to here as the designated module). Dynamically loaded components can be initially written directly in the homepage and then extracted later if needed.

[0059] S105: Obtain user requirements and determine a specified sub-component to implement the user requirements. Read the specified JSON file corresponding to the specified sub-component through the file reading script, and parse the specified JSON file through the dynamic loading component to achieve dynamic adjustment of the page.

[0060] User needs may require adjustments to the page design, such as adding or deleting a sub-component. In this case, different JSON files are provided to different clients, placed in the front-end static folder of the software package and distributed, or the implementation team can go on-site to modify and replace the JSON according to the client's requirements.

[0061] Specifically, such as Figure 3 As shown, it is necessary to determine the specific sub-component used to implement this user requirement. There can be one or more sub-components. There is a corresponding mapping relationship between the sub-components and the JSON file. A file reading script reads the specified JSON file corresponding to the specified sub-component.

[0062] Determine the dynamically loaded component based on Angular, call the functionalities of the dynamically loaded component, and read the JSON string corresponding to the specified JSON file from the static file. Deserialize the JSON string to obtain an Object variable (e.g., ...). Figure 3 As shown, this is also called a component variable (here named panel). We parse the panel variable to obtain the information it contains. Furthermore, we can save the JSON string to the database; in this case, we need to develop JSON import and save functionality.

[0063] First, the first layer of information is parsed and obtained. The first layer of information includes the overall attributes of the page design. The overall attributes include at least one of the overall background, overall title, and overall refresh interval. Based on this information, the overall features such as background, title, and refresh interval can be set.

[0064] Then, it parses and retrieves the second-level information, which includes information about the child components corresponding to the specified child components. This information is typically an array containing multiple element variables (such as...). Figure 3 As shown, each element variable (also called an array element) is a sub-component.

[0065] This uses dynamically loaded components generated by Angular, iterating through an array. The "type" field is used to specify the type of the child component. The corresponding child component instance is dynamically loaded based on the "type" field. The child component instance can be rendered inside the container. The properties of each element variable are assigned to the corresponding child component instance, such as title, height, weight, api, and data. The child component contains corresponding processing logic, such as setting the DOM's width, height, and position, displaying the title, and requesting data from an API after initialization. After the entire loop is completed, all child components are rendered on the page.

[0066] In one embodiment, for a JSON file, the child component elements contained therein are deleted, and the corresponding attribute values ​​are modified to obtain a new JSON file with the same name. The new JSON file with the same name is used to replace the JSON file in the front-end static folder, and the page is refreshed to obtain a new functional page.

[0067] like Figure 4 As shown in the illustration, this application embodiment also provides a device for dynamically adjusting a page, including:

[0068] At least one processor; and,

[0069] A memory communicatively connected to the at least one processor; wherein,

[0070] The memory stores instructions that can be executed by the at least one processor, which, when executed by the at least one processor, enables the at least one processor to perform a dynamic page adjustment method as described in any of the above embodiments.

[0071] This application also provides a non-volatile computer storage medium storing computer-executable instructions, wherein the computer-executable instructions are configured as the page dynamic adjustment method described in any of the above embodiments.

[0072] The various embodiments in this application are described in a progressive manner. Similar or identical parts between embodiments can be referred to mutually. Each embodiment focuses on describing the differences from other embodiments. In particular, the device and medium embodiments are basically similar to the method embodiments, so the description is relatively simple; relevant parts can be referred to the description of the method embodiments.

[0073] The devices and media provided in this application are one-to-one with the methods. Therefore, the devices and media also have similar beneficial technical effects as their corresponding methods. Since the beneficial technical effects of the methods have been described in detail above, the beneficial technical effects of the devices and media will not be repeated here.

[0074] Those skilled in the art will understand that embodiments of this application can be provided as methods, systems, or computer program products. Therefore, this application can take the form of a completely hardware embodiment, a completely software embodiment, or an embodiment combining software and hardware aspects. Furthermore, this application can take the form of a computer program product embodied on one or more computer-usable storage media (including but not limited to disk storage, CD-ROM, optical storage, etc.) containing computer-usable program code.

[0075] This application is described with reference to flowchart illustrations and / or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of this application. It will be understood that each block of the flowchart illustrations and / or block diagrams, and combinations of blocks in the flowchart illustrations and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to a processor of a general-purpose computer, special-purpose computer, embedded processor, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable data processing apparatus, generate instructions for implementing the flowchart... Figure 1 One or more processes and / or boxes Figure 1 A device that provides the functions specified in one or more boxes.

[0076] These computer program instructions may also be stored in a computer-readable storage medium that can direct a computer or other programmable data processing device to function in a particular manner, such that the instructions stored in the computer-readable storage medium produce an article of manufacture including instruction means, which are implemented in a process Figure 1 One or more processes and / or boxes Figure 1 The function specified in one or more boxes.

[0077] These computer program instructions may also be loaded onto a computer or other programmable data processing equipment to cause a series of operational steps to be performed on the computer or other programmable equipment to produce a computer-implemented process, thereby providing instructions that execute on the computer or other programmable equipment for implementing the process. Figure 1 One or more processes and / or boxes Figure 1 The steps of the function specified in one or more boxes.

[0078] In a typical configuration, a computing device includes one or more processors (CPU), input / output interfaces, network interfaces, and memory.

[0079] Memory may include non-persistent storage in computer-readable media, such as random access memory (RAM) and / or non-volatile memory, such as read-only memory (ROM) or flash RAM. Memory is an example of computer-readable media.

[0080] Computer-readable media includes both permanent and non-permanent, removable and non-removable media that can store information using any method or technology. Information can be computer-readable instructions, data structures, modules of programs, or other data. Examples of computer storage media include, but are not limited to, phase-change memory (PRAM), static random access memory (SRAM), dynamic random access memory (DRAM), other types of random access memory (RAM), read-only memory (ROM), electrically erasable programmable read-only memory (EEPROM), flash memory or other memory technologies, CD-ROM, digital versatile optical disc (DVD) or other optical storage, magnetic tape, magnetic magnetic disk storage or other magnetic storage devices, or any other non-transferable medium that can be used to store information accessible by a computing device. As defined herein, computer-readable media does not include transient computer-readable media, such as modulated data signals and carrier waves.

[0081] It should also be noted that the terms "comprising," "including," or any other variations thereof are intended to cover non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements includes not only those elements but also other elements not expressly listed, or elements inherent to such a process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising one..." does not exclude the presence of other identical elements in the process, method, article, or apparatus that includes said element.

[0082] The above description is merely an embodiment of this application and is not intended to limit the scope of this application. Various modifications and variations can be made to this application by those skilled in the art. Any modifications, equivalent substitutions, improvements, etc., made within the spirit and principles of this application should be included within the scope of the claims of this application.

Claims

1. A method for dynamic adjustment of a page, characterized in that, include: Based on the front-end development framework, a file reading script is generated to read JSON files in the front-end static folder, and the file reading script is mounted into the front-end project; The page design is broken down into multiple sub-components. Based on the generated chart component for connecting to the data visualization chart library, the sub-components are encapsulated and coded into independent components. Variables and functions are defined for the sub-components, and the sub-components are registered to the module. Define the JSON text format corresponding to the JSON file, and based on the JSON text format and the multiple sub-components split in the page design, improve the corresponding JSON file, and map the improved JSON file to the corresponding sub-component; Generate a dynamically loaded component and register the dynamically loaded component with a specified module. The dynamically loaded component is used to dynamically load the sub-component. Obtain user requirements and determine the specified sub-components to implement the user requirements. Read the specified JSON file corresponding to the specified sub-component through the file reading script, and parse the specified JSON file through the dynamic loading component to achieve dynamic adjustment of the page. The specified JSON file is parsed using the dynamically loaded component, specifically including: Identify dynamically loaded components generated by Angular; Call the function of the dynamically loaded component to obtain the JSON string corresponding to the specified JSON file; The JSON string is deserialized to obtain an Object variable; The Object variable is parsed to obtain the information it contains; The Object variable is parsed to obtain the information it contains, specifically including: The Object variable is parsed to obtain the first layer of information it contains. The first layer of information includes the overall attributes of the page design. The overall attributes include at least one of the overall background, overall title, and overall refresh interval. The Object variable is parsed to obtain the second-level information it contains, which includes the sub-component information corresponding to the specified sub-component. The Object variable is parsed to obtain its second-level information, specifically including: Based on dynamically loaded components generated by Angular, the array is traversed in a loop. The array includes multiple element variables, and each element variable corresponds to a child component. By specifying a field that represents the type of the child component, the corresponding child component instance is dynamically loaded, and the attribute of the element variable is assigned to the corresponding child component instance.

2. The method of claim 1, wherein, Generate a file reading script for reading JSON files in the front-end static folder, and mount the file reading script into the front-end project. Specifically, this includes: Written in JavaScript, a file reading script is generated. This script reads JSON files from the static folder on the front end via AJAX requests. Mount the file reading script to the front-end project; If the JSON file is located in the database, then if the JSON file cannot be read, a request is made to the backend to read the JSON file.

3. The method of claim 1, wherein, The page design is broken down into multiple sub-components, specifically including: Based on design and functionality, the target functions contained in the homepage dashboard are broken down into multiple sub-components. The homepage dashboard belongs to the page design, and the sub-components include at least one of pie charts, bar charts, line charts, progress bars, percentage dashboards, scrolling tables, maps, word clouds, and 3D model display windows.

4. The method according to claim 1, characterized in that, Based on the generated chart components for connecting to the data visualization chart library, the sub-components are encapsulated and coded into independent components, and variables and functions are defined for the sub-components. The sub-components are then registered into the module, specifically including: Develop and generate general-purpose Echarts-based components as chart components for connecting to data visualization chart libraries; The sub-components are encapsulated and encoded into independent components, and the variables and functions in all sub-components are defined with consistent variable names or function names; Identify the sub-components that belong to the same class and register them into the same module.

5. The method according to claim 1, characterized in that, The method further includes: For the JSON file, delete the child component elements it contains and modify the corresponding attribute values ​​to obtain a new JSON file with the same name; Replace the JSON file in the front-end static folder with the new JSON file of the same name; Refresh the page to see the new feature page.

6. A device for dynamically adjusting a page, characterized in that, include: At least one processor; as well as, A memory communicatively connected to the at least one processor; wherein, The memory stores instructions that can be executed by the at least one processor to enable the at least one processor to perform a dynamic page adjustment method as described in any one of claims 1 to 5.

7. A non-volatile computer storage medium storing computer-executable instructions, characterized in that, The computer-executable instructions are configured as follows: the dynamic adjustment method for a page as described in any one of claims 1 to 5.

Images