Multi-language website-oriented dynamic rendering method and device, equipment and storage medium

Abstract

The embodiment of the invention provides a multi-language website-oriented dynamic rendering method and device, equipment and a storage medium, and the method comprises the steps: for a to-be-rendered page of a multi-language website, obtaining page data of the to-be-rendered page, and packaging the page data into universal data and language personalized data; cards, modules and general data items of the to-be-rendered page corresponding to each language are assembled, a template corresponding to each language is generated, and attributes of the cards in the template are dynamically set based on language personalized data; under the condition that a rendering request of a to-be-rendered page is received, determining a target template matched with the current rendering request according to the general data; according to the method, the to-be-rendered page in the current rendering request is rendered according to the target template, self-adaptive loading experience can be provided according to reading habits of a user for different languages, and the method is particularly suitable for languages read from right to left, such as Arabic and Hilbert, so that the interaction effect between the user and a website is optimized.

Description

Technical Field

[0001] This application relates to the technical field of dynamic rendering frameworks, and more specifically, to a dynamic rendering method, device, equipment, and storage medium for multilingual websites. Background Art

[0002] In today's globalized Internet environment, the importance of multilingual websites has become increasingly prominent. Traditional dynamic rendering technologies usually follow the page layout and text rendering logic from left to right and top to bottom. However, for multilingual websites, some languages require reading from right to left. If the traditional rendering method continues to be used, the user experience may be reduced.

[0003] Most existing dynamic rendering frameworks default to supporting the left-to-right content presentation logic. To achieve right-to-left loading, it is necessary to customize and adjust the basic rendering mechanism of these frameworks. For example, in the React framework (React is a JavaScript library for building user interfaces), this involves rewriting part of the component logic to change the element arrangement and update order, and adjusting the direction settings of data binding and DOM (Document Object Model) operations to ensure correct rendering in specific language scenarios while maintaining the functions and performance of other language versions unchanged. Summary of the Invention

[0004] An embodiment of this application provides a dynamic rendering method, device, equipment, and storage medium for multilingual websites.

[0005] In the first aspect of the embodiments of this application, a dynamic rendering method for multilingual websites is provided, including:

[0006] For the page to be rendered of a multilingual website, obtain the page data of the page to be rendered, and encapsulate the page data into general data and language-specific personalized data, where the language-specific personalized data includes reading order, font, and alignment;

[0007] Assemble the cards, modules, and general data items of the page to be rendered corresponding to each language to generate a template corresponding to each language, where the attributes of the cards in the template are dynamically set based on the language-specific personalized data;

[0008] When receiving a rendering request for the page to be rendered, determine a target template that matches the current rendering request according to the general data;

[0009] Render the page to be rendered in the current rendering request according to the target template.

[0010] In an optional embodiment of the present application, assembling the cards, modules, and general data items of the to-be-rendered pages corresponding to each language to generate templates corresponding to each language, including:

[0011] For each language, assembling the cards, modules, and data items of each to-be-rendered page of the current language, wherein the to-be-rendered pages include a home page, a special topic page, and a content page, each card includes a title, a link, and a picture, each module includes at least one card, and the general data items include the language and the alignment method.

[0012] In an optional embodiment of the present application, after generating the templates corresponding to each language, the method further includes:

[0013] Submitting the templates corresponding to each language to the corresponding version control system branch, where this version control system branch is used to manage the stored templates;

[0014] In the case where the templates corresponding to all languages are submitted to the corresponding version control system branches, merging the templates corresponding to all languages, and compiling, packaging, and publishing the merged template source files, where the data format of the template source files includes the language, serial number, and associated template of the template.

[0015] In an optional embodiment of the present application, determining a target template that matches the current rendering request according to the general data, including:

[0016] Identifying the target language features corresponding to the current rendering request according to the general data, where the language features include the language, font, and alignment method;

[0017] Based on the correspondence between the language features and the template serial numbers, determining the target template that matches the current rendering request according to the target language features.

[0018] In an optional embodiment of the present application, rendering the to-be-rendered pages in the current rendering request according to the target template, including:

[0019] Determining the card loading order according to the reading order in the target template;

[0020] Rendering the page data of each to-be-rendered page in the alignment direction of the text in the target template according to the card loading order.

[0021] In an optional embodiment of the present application, the attributes of the cards in the template are dynamically set based on the language personalized data, including:

[0022] For each language, when the language personalized data of the current language is updated, resetting the attributes of the cards in the template according to the updated language personalized data.

[0023] In an optional embodiment of the present application, after rendering the page to be rendered in the current rendering request according to the target template, the method further includes:

[0024] Converting the rendered dynamic page into hypertext markup language static content;

[0025] Adding preset tag information to the hypertext markup language static content, where the preset tag information is used to optimize the search engine.

[0026] The second aspect of the embodiments of the present application provides a dynamic rendering device for a multilingual website, including:

[0027] An encapsulation module, configured to obtain page data of the page to be rendered for a multilingual website, and encapsulate the page data into general data and language personalized data, where the language personalized data includes reading order, font, and alignment;

[0028] An assembly module, configured to assemble cards, modules, and general data items of the page to be rendered corresponding to each language, and generate a template corresponding to each language, where the attributes of the cards in the template are dynamically set based on the language personalized data;

[0029] A matching module, configured to, when receiving a rendering request for the page to be rendered, determine a target template that matches the current rendering request according to the general data;

[0030] A rendering module, configured to render the page to be rendered in the current rendering request according to the target template.

[0031] The third aspect of the embodiments of the present application provides a computer device, including: a memory and a processor, the memory stores a computer program, and when the processor executes the computer program, the steps of any one of the above dynamic rendering methods for a multilingual website are implemented.

[0032] The fourth aspect of the embodiments of the present application provides a computer-readable storage medium, on which a computer program is stored, and characterized in that when the computer program is executed by a processor, the steps of any one of the above dynamic rendering methods for a multilingual website are implemented.

[0033] The above technical solutions provided by the embodiments of the present application have at least some or all of the following advantages compared with the prior art:

[0034] The dynamic rendering method for multilingual websites described in the embodiments of the present application, for the page to be rendered of a multilingual website, obtains the page data of the page to be rendered, and encapsulates the page data into general data and language-specific personalized data, where the language-specific personalized data includes reading order, font, and alignment; assembles the cards, modules, and general data items of the page to be rendered corresponding to each language to generate a template corresponding to each language, where the attributes of the cards in the template are dynamically set based on the language-specific personalized data; in the case of receiving a rendering request for the page to be rendered, determines a target template that matches the current rendering request according to the general data; renders the page to be rendered in the current rendering request according to the target template, and can provide an adaptive loading experience according to the reading habits of users in different languages, especially applicable to languages read from right to left, such as Arabic, Hebrew, etc., thereby optimizing the interaction effect between the user and the website. Description of the Drawings

[0035] The drawings described herein are used to provide a further understanding of the present application and form a part of the present application. The illustrative embodiments of the present application and their descriptions are used to explain the present application and do not constitute an improper limitation of the present application. In the drawings:

[0036] Figure 1 It is a flowchart of the dynamic rendering method for multilingual websites provided by an embodiment of the present application;

[0037] Figure 2 It is a flowchart of the dynamic rendering method for multilingual websites provided by another embodiment of the present application;

[0038] Figure 3 It is a schematic diagram of the multilingual general page data provided by an embodiment of the present application;

[0039] Figure 4 It is a schematic diagram of the production and release process of the template library of the present application provided by an embodiment of the present application;

[0040] Figure 5 It is a flowchart of the dynamic rendering of the entire page provided by an embodiment of the present application;

[0041] Figure 6 It is a diagram of the web page dynamic rendering process triggered by the user's access behavior provided by an embodiment of the present application;

[0042] Figure 7 It is a schematic diagram of the structure of the dynamic rendering device for multilingual websites provided by an embodiment of the present application;

[0043] Figure 8 It is a schematic diagram of the structure of a computer device provided by an embodiment of the present application. Detailed Embodiments

[0044] In order to make the technical solutions and advantages in the embodiments of the present application clearer and more understandable, the exemplary embodiments of the present application will be further described in detail below with reference to the accompanying drawings. Obviously, the described embodiments are only a part of the embodiments of the present application, rather than an exhaustive list of all embodiments. It should be noted that, without conflict, the embodiments in the present application and the features in the embodiments can be combined with each other.

[0045] Please refer to Figure 1 , the dynamic rendering method for a multilingual website provided by the embodiments of the present application includes the following steps S100 to S400:

[0046] S100. For the page to be rendered of a multilingual website, obtain the page data of the page to be rendered, and encapsulate the page data into general data and language-specific personalized data. Among them, the language-specific personalized data includes reading order, font, and alignment method, and the languages include but are not limited to Chinese, English, Korean, Japanese, Bengali, Nepali, German, and Persian;

[0047] S200. Assemble the cards, modules, and general data items of the page to be rendered corresponding to each language, and generate a template corresponding to each language. Among them, the attributes of the cards in the template are dynamically set based on the language-specific personalized data;

[0048] S300. When receiving a rendering request for the page to be rendered, determine the target template that matches the current rendering request according to the general data;

[0049] S400. Render the page to be rendered in the current rendering request according to the target template.

[0050] In the dynamic rendering method for a multilingual website of the present application, during the dynamic rendering process, the general data is encapsulated by defining a page data definition format common to multiple languages, and based on the general data, various feature settings for multiple languages are identified, including languages, fonts, and alignment methods, which can support the underlying data of different pages in multiple languages and meet the multilingual support capabilities of the dynamic rendering engine.

[0051] In an optional embodiment of the present application, in step S200, assembling the cards, modules, and general data items of the page to be rendered corresponding to each language to generate a template corresponding to each language includes:

[0052] For each language, assemble the cards, modules, and data items of each page to be rendered in the current language. Among them, the pages to be rendered include the home page, special topic page, and content page. Each card includes a title, a link, and a picture. Each module includes at least one card, and the general data items include the language and alignment method.

[0053] Such as Figure 2As shown, the web pages of the website are split into multiple module cards, and each card carries a language identifier in the data definition. When the dynamic rendering engine recognizes the language identifier, it selects different rendering templates and performs dynamic rendering according to the reading mode of the language. The rendering templates are prefabricated in the rendering engine in advance according to the characteristics of each language, so as to quickly and real-time adapt to the rendering of multi-language web pages.

[0054] As Figure 3 shown, in the definition of the data structure, a module contains multiple cards in a web page, including the language information of the cards and typesetting information such as titles and styles. A card group contains multiple cards, including information such as titles, thumbnails, and content links. Through such data definition, the dynamic rendering engine can quickly identify the language and select the corresponding template for rendering.

[0055] In an optional embodiment of the present application, in step S200, after generating the templates corresponding to each language, the method further includes:

[0056] Submitting the templates corresponding to each language to the corresponding version control system branch, where this version control system branch is used to manage the stored templates;

[0057] In the case where the templates corresponding to all languages are submitted to the corresponding version control system branches, the templates corresponding to all languages are merged, and the merged template source files are compiled, packaged, and released, where the data format of the template source files includes the language, serial number, and associated template of the template.

[0058] Figure 4 This is the production and release process of the template library of the present application. The entire rendering template library can be built using the standard VUE (progressive JavaScript front-end framework). The template library of each language is managed separately and finally compiled into a unified template library and imported into the rendering engine. In the data format of the template, unified definition and encapsulation are also carried out, including the language, serial number, associated template, etc. of the template, ensuring the universality and uniqueness of the template, and the unique serial number ensures that the rendering engine can quickly and uniquely find the corresponding correct template during the rendering process.

[0059] In an optional embodiment of the present application, in step S300, determining the target template that matches the current rendering request according to the general data includes:

[0060] Identifying the target language features corresponding to the current rendering request according to the general data, where the language features include language, font, and alignment;

[0061] Based on the correspondence between the language features and the template serial number, determining the target template that matches the current rendering request according to the target language features.

[0062] In an optional embodiment of the present application, in step S400, rendering the page to be rendered in the current rendering request according to the target template includes:

[0063] Determining the card loading order according to the reading order in the target template;

[0064] Rendering the page data of each page to be rendered according to the alignment direction of the text in the target template according to the card loading order.

[0065] In an optional embodiment of the present application, in step S200, the attributes of the cards in the template are dynamically set based on the language personalized data, including:

[0066] For each language, when the language personalized data of the current language is updated, the attributes of the cards in the template are reset according to the updated language personalized data.

[0067] In an optional embodiment of the present application, after rendering the page to be rendered in the current rendering request according to the target template, the method further includes:

[0068] Converting the rendered dynamic page into hypertext markup language static content;

[0069] Adding preset tag information to the hypertext markup language static content, where the preset tag information is used to optimize the search engine.

[0070] Figure 5 This is the process of dynamic rendering of the entire page. The first step is page data preparation: loading page data and encapsulating and converting the page data into a general data format; for each language, encapsulating personalized layout information, including but not limited to reading order, font style, etc. The second step is page template preparation: assembling the cards, modules, and data items of the page; dynamically setting the card attributes based on the language personalized data, such as reading order, font style, etc. The third step is page dynamic rendering: using the page data in the preparation stage for rendering, loading the styles, code, and material content in the template, adopting different card loading orders according to the reading order, and changing the alignment direction of the text. The fourth step is dynamic to static conversion: converting the rendered dynamic page into html static content and adding various tag information helpful for search engine optimization.

[0071] In the present application, the process of dynamic rendering of the entire page realizes the automatic adaptation of page modules according to language characteristics, meets the differences in reading order, font selection, etc. between different languages, and also enhances the friendliness of the website to the search engine, facilitating content to be crawled and indexed.

[0072] Figure 6It is a complete web page dynamic rendering process triggered by the user's access behavior. When a user accesses a Persian website through a browser, the browser initiates a request to the content delivery network domain name to access the web page content. If the content delivery network has no cache, it initiates a content origin return request to the dynamic rendering origin site. After receiving the request, the dynamic rendering origin site first requests the template and content orchestration data from the dynamic data gateway, then uses the prefabricated Persian template to dynamically render the content of the Persian website in combination with the orchestration data, and returns it to the content delivery network. Finally, the content delivery network returns it to the browser for presentation.

[0073] Persian is different from the content of existing websites, and its content and layout are from right to left. If traditional layout and rendering methods are used, it is easy to cause problems such as style disorders. In the rendering process of this application, such a layout method can be fully compatible without affecting the user's reading experience. In the existing solution, the website loading order is defaulted to load from top to bottom and from left to right. When encountering relatively large content such as pictures and videos, it will be loaded and displayed one by one in order. This application enriches the refinement level of multilingual websites when serving global users, especially for the user group who reads from right to left. By adjusting the loading order, the website page that reads from right to left loads content according to the reading habit, improves the loading priority of the content on the right, meets the expectations of users who read from right to left, promotes the development of multilingual websites towards a direction more in line with the cultural backgrounds of each language, and promotes information exchange and cultural dissemination globally.

[0074] The dynamic rendering method for multilingual websites of this application intercepts and modifies the instructions related to loading from right to left on the basis of the original rendering process by creating a custom rendering plugin or intermediate layer code, and drives the loading and display of page elements according to the new rules. Extensive unit tests and integration tests can also be carried out to ensure compatibility and stability in different page modules and interaction scenarios.

[0075] It should be understood that although the steps in the flowchart are displayed in sequence according to the arrows, these steps are not necessarily executed in the order indicated by the arrows. Unless there is a clear description in this article, the execution of these steps has no strict order limit, and these steps can be executed in other orders. Moreover, at least a part of the steps in the figure may include multiple sub-steps or multiple stages. These sub-steps or stages are not necessarily executed at the same moment, but can be executed at different moments. The execution order of these sub-steps or stages is not necessarily sequential, but can be executed alternately or in turn with at least a part of other steps or sub-steps or stages of other steps.

[0076] Please refer to Figure 7, an embodiment of the present application provides a dynamic rendering device 800 for a multilingual website, including:

[0077] An encapsulation module 810, configured to obtain page data of a page to be rendered for a multilingual website, and encapsulate the page data into general data and language-personalized data, where the language-personalized data includes reading order, font, and alignment;

[0078] An assembly module 820, configured to assemble cards, modules, and general data items of the page to be rendered corresponding to each language, and generate a template corresponding to each language, where the attributes of the cards in the template are dynamically set based on the language-personalized data;

[0079] A matching module 830, configured to, when receiving a rendering request for the page to be rendered, determine a target template that matches the current rendering request according to the general data;

[0080] A rendering module 840, configured to render the page to be rendered in the current rendering request according to the target template.

[0081] For the specific limitations of the above device 800, reference can be made to the limitations on the dynamic rendering method for a multilingual website in the foregoing text, which will not be elaborated here. Each module in the above device 800 can be implemented in whole or in part by software, hardware, and their combination. The above modules can be embedded in the processor in the computer device in hardware form or be independent of the processor, or can be stored in the memory in the computer device in software form, so as to facilitate the processor to call and execute the operations corresponding to the above modules.

[0082] In one embodiment, a computer device is provided. The internal structure diagram of the computer device can be as Figure 8 shown. The computer device includes a processor, a memory, a network interface, and a database connected through a system bus. Among them, the processor of the computer device is used to provide computing and control capabilities. The memory of the computer device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system, a computer program, and a database. The internal memory provides an environment for the operation of the operating system and the computer program in the non-volatile storage medium. The database of the computer device is used to store data. The network interface of the computer device is used to communicate with an external terminal through a network connection. When the computer program is executed by the processor, it implements a dynamic rendering method for a multilingual website as described above. It includes: including a memory and a processor, the memory stores a computer program, and when the processor executes the computer program, it implements any step in the dynamic rendering method for a multilingual website as described above.

[0083] In one embodiment, a computer-readable storage medium is provided, on which a computer program is stored. When the computer program is executed by a processor, any step in the above-described dynamic rendering method for a multilingual website can be implemented.

[0084] Those skilled in the art should understand that the embodiments of the present application can be provided as a method, a system, or a computer program product. Therefore, the present application can take the form of a complete hardware embodiment, a complete software embodiment, or an embodiment combining software and hardware aspects. Moreover, the present application can take the form of a computer program product implemented 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.

[0085] The present application is described with reference to the flowcharts and / or block diagrams of methods, apparatuses (systems), and computer program products according to the embodiments of the present application. It should be understood that each flow and / or block in the flowcharts and / or block diagrams, as well as the combination of flows and / or blocks in the flowcharts and / or block diagrams, can be implemented by computer program instructions. These computer program instructions can be provided to the processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing devices to generate a machine, such that the instructions executed by the processor of the computer or other programmable data processing devices produce a means for implementing the specified functions in Figure 1 one or more of the processes Figure 1 or blocks or combinations of blocks.

[0086] These computer program instructions can also be stored in a computer-readable memory that can direct a computer or other programmable data processing device to work in a specific manner, such that the instructions stored in the computer-readable memory produce a manufactured article including an instruction device that implements the specified functions in Figure 1 one or more of the processes Figure 1 or blocks or combinations of blocks.

[0087] These computer program instructions can also be loaded onto a computer or other programmable data processing device, such that a series of operation steps are executed on the computer or other programmable device to generate a computer-implemented process. Thus, the instructions executed on the computer or other programmable device provide steps for implementing the specified functions in Figure 1 one or more of the processes Figure 1 or blocks or combinations of blocks.

[0088] Although the preferred embodiments of the present application have been described, additional changes and modifications can be made to these embodiments by those skilled in the art once they learn the basic creative concept. Therefore, the appended claims are intended to be construed to include the preferred embodiments as well as all changes and modifications that fall within the scope of the present application.

[0089] Obviously, those skilled in the art can make various changes and modifications to the present application without departing from the spirit and scope of the present application. Thus, if these modifications and variations of the present application fall within the scope of the claims of the present application and their equivalent technologies, the present application is also intended to include these modifications and variations.

Claims

1. A dynamic rendering method for multilingual websites, characterized in that including: For a page to be rendered on a multilingual website, obtain the page data of the page to be rendered, and encapsulate the page data into general data and language-specific personalized data, where the language-specific personalized data includes reading order, font, and alignment; Assemble the cards, modules, and general data items of the page to be rendered for each language, and generate a template for each language, where the attributes of the cards in the template are dynamically set based on the language-specific personalized data; When a rendering request for the page to be rendered is received, determine a target template that matches the current rendering request according to the general data; Render the page to be rendered in the current rendering request according to the target template.

2. The method according to claim 1, wherein Assemble the cards, modules, and general data items of the page to be rendered for each language, and generate a template for each language, including: For each language, assemble the cards, modules, and data items of each page to be rendered in the current language, where the pages to be rendered include a home page, a special topic page, and a content page, each card includes a title, a link, and a picture, each module includes at least one card, and the general data item includes the language and alignment; 3. The method according to claim 2, wherein After generating the template for each language, the method further includes: Submit the template for each language to the corresponding version control system branch, where this version control system branch is used to manage the stored templates; When the templates for all languages have been submitted to the corresponding version control system branches, merge the templates for all languages, and compile, package, and publish the merged template source files, where the data format of the template source files includes the language, serial number, and associated template of the template; 4. The method according to claim 3, wherein Determine a target template that matches the current rendering request according to the general data, including: Identify the target language features corresponding to the current rendering request according to the general data, where the language features include language, font, and alignment; Based on the correspondence between the language features and the template serial number, determine the target template that matches the current rendering request according to the target language features.

5. The method according to claim 1, characterized in that, Render the page to be rendered in the current rendering request according to the target template, including: Determine the card loading order according to the reading order in the target template; Render the page data of each page to be rendered according to the alignment direction of the text in the target template according to the card loading order.

6. The method according to claim 1, wherein The attributes of the cards in the template are dynamically set based on the language-specific personalized data, including: For each language, when the language-specific personalized data of the current language is updated, reset the attributes of the cards in the template according to the updated language-specific personalized data.

7. The method according to claim 1, wherein After rendering the page to be rendered in the current rendering request according to the target template, the method further includes: Convert the rendered dynamic page into hypertext markup language static content; Add preset tag information to the hypertext markup language static content, where the preset tag information is used to optimize the search engine.

8. A dynamic rendering device for a multilingual website, characterized in that, including: An encapsulation module, which is used for a page to be rendered on a multilingual website, to obtain the page data of the page to be rendered, and encapsulate the page data into general data and language-specific personalized data, where the language-specific personalized data includes reading order, font, and alignment; An assembly module, which is used to assemble cards, modules and general data items of the page to be rendered corresponding to each language, and generate templates corresponding to each language. Among them, the attributes of the cards in the templates are dynamically set based on language-specific personalized data; A matching module, which is used to, when receiving a rendering request for the page to be rendered, determine a target template that matches the current rendering request according to the general data; A rendering module, which is used to render the page to be rendered in the current rendering request according to the target template.

9. A computer device, comprising: It includes a memory and a processor. The memory stores a computer program. It is characterized in that when the processor executes the computer program, the steps of the dynamic rendering method for a multi-language website described in any one of claims 1 to 7 are implemented.

10. A computer-readable storage medium having a computer program stored thereon, characterized in that, When the computer program is executed by the processor, the steps of the dynamic rendering method for a multi-language website described in any one of claims 1 to 7 are implemented.

Images