Webpage rendering method, rendering server, client, equipment and storage medium
By executing the process of requesting dynamic resources in parallel on the rendering server, the problem of longer web page rendering time under the SSR architecture is solved, achieving more efficient web page rendering and faster user experience.
Patent Information
- Application Number
- CN202411636422.8
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2024-11-15
- Publication Date
- 2025-02-28
AI Technical Summary
When rendering web pages, the existing server-side rendering (SSR) architecture has a low user experience. Due to the long rendering time, users need to wait for a long time to see the web page content.
Improve web page rendering efficiency by executing the process of requesting dynamic resources in parallel in the stage of assembling static pages in the rendering server in advance. The specific methods include: the client sends a web rendering request, the rendering server assembles the basic data and executes the target instruction code to generate a data acquisition request, sends parallel request service data to the service server, and caches the service data, and finally returns the basic data and the cached service data to the client.
By requesting business data in parallel in advance, the time the client waits for business data preparation when downloading and executing static resources is reduced, thus significantly improving the efficiency and speed of web page rendering, reducing the white screen time and improving user experience.
Smart Images

Figure CN119537728A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the technical field of web page rendering, and in particular to a web page rendering method, a rendering server, a client, a device and a storage medium. Background Art
[0002] With the development of web technology, more and more applications have developed web features. The lower the web page rendering time, the shorter the time users see the content, the greater the probability of users browsing the content, and the higher the exposure and click volume of the content. Therefore, the web page rendering time is a key performance indicator of the web version of the application.
[0003] At present, in order to provide the ultimate user experience and a higher functional ceiling, the server-side rendering (SSR) architecture is generally used to render web pages.
[0004] However, when using the SSR architecture to render web pages, the time it takes to render a complete web page is still long, and the user experience is low. Summary of the invention
[0005] The embodiments of the present application provide a web page rendering method, a rendering server, a client, a device and a storage medium, which advance the process of requesting dynamic resources of a web page to the stage of assembling static pages on the server and execute them in parallel, thereby improving the rendering efficiency of the web page.
[0006] In a first aspect, an embodiment of the present application provides a webpage rendering method, the method being applied to a rendering server, comprising:
[0007] Receiving a webpage rendering request from a client, wherein the webpage rendering request is used to obtain basic data and business data included in a target webpage, so that the client renders the target webpage based on the basic data and the business data;
[0008] In response to the webpage rendering request, assembling and obtaining basic data of the target webpage, and executing target instruction codes in the basic data to generate a first data acquisition request, wherein the first data acquisition request is used to acquire business data of the target webpage;
[0009] Sending a first data acquisition request to a business server, and storing the business data in a cache after the business server returns the business data;
[0010] Sending basic data of the target webpage to the client so that the client executes target instruction code in the basic data to generate a second data acquisition request, where the second data acquisition request is used to acquire the business data;
[0011] receiving a second data acquisition request from the client; and
[0012] In response to the second data acquisition request, the business data in the cache is returned to the client.
[0013] In a second aspect, an embodiment of the present application provides a webpage rendering method, which is applied to a client, and the method includes:
[0014] Sending a webpage rendering request to a rendering server, wherein the webpage rendering request is used to obtain basic data and business data included in a target webpage;
[0015] receiving, from the rendering server, basic data of the target web page assembled by the rendering server in response to the web page rendering request;
[0016] Rendering is performed based on the basic data to display the basic content of the target webpage, and the target instruction code in the basic data is executed to generate a second data acquisition request, wherein the second data acquisition request is used to acquire the business data of the target webpage;
[0017] sending the second data acquisition request to the rendering server to acquire the business data cached by the rendering server, the business data being cached after the rendering server sends the first data acquisition request to the business server and the business server returns the business data, the first data acquisition request being generated by the rendering server executing the target instruction code in the basic data, and the first acquisition request being used to acquire the business data of the target webpage;
[0018] Rendering is performed based on the business data to display the business content of the target webpage.
[0019] In a third aspect, an embodiment of the present application provides a web page rendering method, the method using a web page rendering system, the web page rendering system comprising: a client, a rendering server and a business server; the method comprising:
[0020] The client sends a webpage rendering request to the rendering server, wherein the webpage rendering request is used to obtain basic data and business data included in the target webpage;
[0021] The rendering server assembles and obtains basic data of the target web page in response to the web page rendering request, and executes target instruction codes in the basic data to generate a first data acquisition request, wherein the first data acquisition request is used to acquire business data of the target web page;
[0022] The rendering server sends a first data acquisition request to the business server, and stores the business data in a cache after the business server returns the business data;
[0023] The rendering server sends basic data of the target webpage to the client;
[0024] The client performs rendering based on the basic data to display the basic content of the target webpage, and executes the target instruction code in the basic data to generate a second data acquisition request, wherein the second data acquisition request is used to acquire the business data of the target webpage;
[0025] The client sends the second data acquisition request to the rendering server;
[0026] The rendering server returns the business data in the cache to the client in response to the second data acquisition request;
[0027] The client performs rendering based on the business data to display the business content of the target webpage.
[0028] In a fourth aspect, an embodiment of the present application provides a rendering server, comprising: a transceiver unit and a processing unit;
[0029] The transceiver unit is used to receive a webpage rendering request from a client, wherein the webpage rendering request is used to obtain basic data and business data included in a target webpage, so that the client renders the target webpage based on the basic data and the business data;
[0030] The processing unit is used to assemble and obtain the basic data of the target webpage, and execute the target instruction code in the basic data to generate a first data acquisition request, wherein the first data acquisition request is used to acquire the business data of the target webpage;
[0031] The transceiver unit is further configured to send a first data acquisition request to a business server, and store the business data in a cache after the business server returns the business data; send basic data of the target webpage to the client so that the client executes the target instruction code in the basic data to generate a second data acquisition request, wherein the second data acquisition request is used to acquire the business data; and receive the second data acquisition request from the client; and
[0032] In response to the second data acquisition request, the business data is returned to the client.
[0033] In a fifth aspect, an embodiment of the present application provides a client, including: a transceiver unit and a processing unit;
[0034] The transceiver unit is used to send a webpage rendering request to a rendering server, wherein the webpage rendering request is used to obtain basic data and business data included in a target webpage; and receive from the rendering server the basic data of the target webpage assembled by the rendering server in response to the webpage rendering request;
[0035] The processing unit is used to render based on the basic data to display the basic content of the target webpage, and execute the target instruction code in the basic data to generate a second data acquisition request, wherein the second data acquisition request is used to acquire the business data of the target webpage;
[0036] The transceiver unit is further used to send the second data acquisition request to the rendering server to acquire the business data cached by the rendering server, the business data is obtained by the rendering server sending the first data acquisition request to the business server and caching after the business server returns the business data, the first data acquisition request is generated by the rendering server executing the target instruction code in the basic data, and the first acquisition request is used to acquire the business data of the target webpage;
[0037] The processing unit is further used to perform rendering based on the business data to display the business content of the target webpage.
[0038] In a sixth aspect, an embodiment of the present application provides a web page rendering system, the web page rendering system comprising: a client, a rendering server, and a business server;
[0039] The client is used to send a webpage rendering request to the rendering server, wherein the webpage rendering request is used to obtain basic data and business data included in the target webpage;
[0040] The rendering server is used to assemble and obtain the basic data of the target webpage in response to the webpage rendering request, and execute the target instruction code in the basic data to generate a first data acquisition request, wherein the first data acquisition request is used to acquire the business data of the target webpage;
[0041] The rendering server is configured to send a first data acquisition request to the business server, and store the business data in a cache after the business server returns the business data;
[0042] The rendering server is used to send basic data of the target webpage to the client;
[0043] The client is used to render based on the basic data to display the basic content of the target webpage, and execute the target instruction code in the basic data to generate a second data acquisition request, wherein the second data acquisition request is used to acquire the business data of the target webpage;
[0044] The client is used to send the second data acquisition request to the rendering server;
[0045] The rendering server is configured to return the business data in the cache to the client in response to the second data acquisition request;
[0046] The client is used for rendering based on the business data to display the business content of the target webpage.
[0047] In a seventh aspect, an embodiment of the present application provides a web page rendering method, the method using a web page rendering system, the web page rendering system comprising: a client, a rendering server and a business server; the method comprising:
[0048] The client sends a webpage rendering request to the rendering server, wherein the webpage rendering request is used to obtain a target webpage, and the target webpage is used to display media content matching the user and basic content of the target webpage;
[0049] The rendering server assembles and obtains basic data of the target web page in response to the web page rendering request, and executes target instruction codes in the basic data to generate a first data acquisition request;
[0050] The rendering server sends a first data acquisition request to the business server, where the first acquisition request is used to acquire media data corresponding to the media content;
[0051] The service server acquires the media data in response to the first data acquisition request;
[0052] The business server returns the media data to the rendering server;
[0053] The rendering server returns the media content to the business server and stores the media data in a cache;
[0054] The rendering server sends basic data of the target webpage to the client;
[0055] The client performs rendering based on the basic data to display basic content of the target webpage, and executes target instruction code in the basic data to generate a second data acquisition request, where the second data acquisition request is used to acquire the media data;
[0056] The client sends the second data acquisition request to the rendering server;
[0057] The rendering server returns the media data in the cache to the client in response to the second data acquisition request;
[0058] The client performs rendering based on the media data to display the media content of the target webpage.
[0059] In an eighth aspect, an embodiment of the present application provides a web page rendering system, the web page rendering system comprising: a client, a rendering server, and a business server;
[0060] The client is used to send a webpage rendering request to the rendering server, wherein the webpage rendering request is used to obtain a target webpage, and the target webpage is used to display media content matching the user and basic content of the target webpage;
[0061] The rendering server is used to assemble and obtain basic data of the target web page in response to the web page rendering request, and execute the target instruction code in the basic data to generate a first data acquisition request;
[0062] The rendering server is used to send a first data acquisition request to the business server, where the first acquisition request is used to acquire media data corresponding to the media content;
[0063] The service server is configured to obtain the media data in response to the first data acquisition request;
[0064] The business server is used to return the media data to the rendering server;
[0065] The rendering server is used for returning the media content to the service server and storing the media data in a cache;
[0066] The rendering server is used to send basic data of the target webpage to the client;
[0067] The client is used to render based on the basic data to display the basic content of the target webpage, and execute the target instruction code in the basic data to generate a second data acquisition request, where the second data acquisition request is used to acquire the media data;
[0068] The client is used to send the second data acquisition request to the rendering server;
[0069] The rendering server is configured to return the media data in the cache to the client in response to the second data acquisition request;
[0070] The client is used to render based on the media data to display the media content of the target webpage.
[0071] In the ninth aspect, an embodiment of the present application provides an electronic device, comprising: a processor and a memory, the processor being connected to the memory, the memory being used to store a computer program, and the processor being used to execute the computer program stored in the memory, so that the electronic device performs the method described in the first aspect or the second aspect or the third aspect or the seventh aspect.
[0072] In the tenth aspect, an embodiment of the present application provides a computer-readable storage medium, wherein the computer-readable storage medium stores a computer program, and the computer program enables a computer to execute the method described in the first aspect, the second aspect, the third aspect, or the seventh aspect.
[0073] In the eleventh aspect, an embodiment of the present application provides a computer program product, which includes a non-transitory computer-readable storage medium storing a computer program, and the computer is operable to cause the computer to execute the method described in the first aspect, the second aspect, the third aspect, or the seventh aspect.
[0074] Implementing the embodiments of the present application has the following beneficial effects:
[0075] It can be seen that in the embodiment of the present application, when the client requests the rendering server to render the target web page, the rendering server first returns the basic data of the target web page to the client, so that the client can render the basic content of the target web page based on the basic data, that is, render the skeleton screen of the target web page, avoiding a long period of waiting for a white screen; and in the process of the rendering server assembling basic data for the client, it can request business data in parallel, and advance the timing of requesting business data to the stage of assembling basic data. In the process of downloading basic data, executing basic data, downloading javascript files, and executing javascript files, the business server can prepare business data for the client. When the client needs to download business data, it can directly request business data from the rendering server. Accordingly, the rendering server can return the business data to the client from the cache. Since the time it takes to read business data from the cache is much shorter than the time required for the business server to assemble business data, the client can quickly obtain business data, thereby improving the rendering efficiency and speed of the web page. BRIEF DESCRIPTION OF THE DRAWINGS
[0076] In order to more clearly illustrate the technical solutions in the embodiments of the present application, the drawings required for use in the description of the embodiments will be briefly introduced below. Obviously, the drawings described below are some embodiments of the present application. For ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative work.
[0077] Figure 1 A schematic diagram of rendering a home page provided in an embodiment of the present application;
[0078] Figure 2 A schematic diagram of rendering a skeleton screen of a web page first and then rendering business data provided by an embodiment of the present application;
[0079] Figure 3 A schematic diagram of a web page rendering system provided in an embodiment of the present application;
[0080] Figure 4 A schematic diagram of a flow chart of a web page rendering method provided in an embodiment of the present application;
[0081] Figure 5 A schematic diagram of another homepage rendering provided in an embodiment of the present application;
[0082] Figure 6 A flowchart of another web page rendering method provided in an embodiment of the present application;
[0083] Figure 7 A flowchart of a rendering server provided in an embodiment of the present application;
[0084] Figure 8 A schematic diagram of a client provided in an embodiment of the present application;
[0085] Fig. 9 A schematic diagram of a web page rendering system provided in an embodiment of the present application;
[0086] Fig.10 A schematic diagram of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION
[0087] The following will be combined with the drawings in the embodiments of the present application to clearly and completely describe the technical solutions in the embodiments of the present application. Obviously, the described embodiments are part of the embodiments of the present application, not all of the embodiments. Based on the embodiments in the present application, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of this application.
[0088] The terms "first", "second", "third" and "fourth" etc. in the specification and claims of the present application and the drawings are used to distinguish different objects, rather than to describe a specific order. In addition, the terms "including" and "having" and any variations thereof are intended to cover non-exclusive inclusions. For example, a process, method, system, product or device that includes a series of steps or units is not limited to the listed steps or units, but optionally includes steps or units that are not listed, or optionally includes other steps or units inherent to these processes, methods, products or devices.
[0089] Reference to "embodiments" herein means that a particular feature, result, or characteristic described in conjunction with the embodiments may be included in at least one embodiment of the present application. The appearance of the phrase in various locations in the specification does not necessarily refer to the same embodiment, nor is it an independent or alternative embodiment that is mutually exclusive with other embodiments. It is explicitly and implicitly understood by those skilled in the art that the embodiments described herein may be combined with other embodiments.
[0090] To facilitate understanding, the relevant technologies involved in this application are first explained and illustrated.
[0091] First, two commonly used web page rendering architectures are explained and illustrated. One is based on the server side rendering (Server Side Render, SSR) architecture, and the other is based on the client side rendering (Client Side Render, CSR) architecture. The following is a description of the specific process of rendering web pages using the above two architectures in conjunction with the accompanying drawings.
[0092] Optionally, CSR mainly completes the rendering of the web page on the client. Specifically, the server returns the static resources and dynamic resources of the web page to the client, and the client completes the rendering of the web page based on the static resources and dynamic resources. The entire rendering process mainly depends on the client to execute static resources and download dynamic resources, and it takes a long time to render a complete web page.
[0093] Optionally, SSR mainly completes the rendering of web pages on the server side. Specifically, the server will render a complete web page based on the static and dynamic resources of the web page, and return the rendered web page to the client. The client can directly display the web page rendered by the server. The client does not need to request static resources and download dynamic resources, which improves the efficiency of web page rendering.
[0094] It can be seen that CSR needs to rely on the client to download and execute static resources, as well as download dynamic resources, and the entire rendering time is relatively long; SSR requires the server to render the web page and return it to the browser, so the server needs to request the dynamic resources of the web page from the business server. As the complexity of the content contained in the web page increases, the time to request dynamic resources will also increase. If the SSR architecture is used to render the web page, the user needs to wait for a long time for a completely white screen before they can see the content of the web page, which is unacceptable to the user. Therefore, how to improve the rendering efficiency of the web page, reduce the white screen time, and bring the ultimate experience to the user is a technical problem that needs to be solved urgently.
[0095] For the sake of unified description, first of all, it is explained that the web page or target web page rendered by the present application can be any type of web page and a web page in any browsing stage. The present application mainly takes the web page as the homepage of the application, also known as the discovery page of the application, as an example for explanation; secondly, the static resources of the web page involved in the present application can also be understood as the basic data of the web page, and the dynamic resources of the web page can also be understood as the business data of the web page. Then, accordingly, the content rendered by the static resources (basic data) of the web page can also be called the skeleton screen of the web page or the HTML page of the web page or the basic content of the web page. They are essentially the same and can be distinguished from each other. The content rendered by the dynamic resources (business data) of the web page can also be called the dynamic content of the web page or the business content of the web page. They are also essentially the same and can be distinguished from each other.
[0096] That is to say, the basic data corresponds to the basic content of the target webpage, such as skeleton content or frame content, and the same basic content is usually displayed to different users. The business data corresponds to the business content of the target webpage, and needs to be obtained from the corresponding business server. In some embodiments, the business server obtains business data that matches the user based on the user, and then renders and displays the corresponding business content. Different business content can usually be displayed to different users. For example, in a recommendation scenario, the business content can be personalized media content for the user; in an advertising scenario, the business content can be personalized advertising content for the user. In a scenario such as Figure 2 In the embodiment shown, the basic content is as follows Figure 2 The skeleton screen content displayed on the left includes multiple blank content cards; the business content is as follows Figure 2 The media content in the content card displayed on the right can display different business content for different users.
[0097] See also Figure 1 , Figure 1 A schematic diagram of rendering a web page provided in an embodiment of the present application.
[0098] like Figure 1As shown, the browser on the client first requests the SSR server to render the web page through the gateway. Then, the SSR server assembles the HTML page of the web page. Then, the browser downloads the HTML page, that is, the skeleton screen is returned to the browser first, so that the browser can render the HTML page first and display the skeleton screen to the user first. Figure 2 As shown, the browser renders the HTML page to render the static page of the web page, that is, based on the static resources, the layout and style of the basic content in the web page are determined, and then the basic content in the web page is first rendered according to the layout and style. Figure 2 As shown on the left side of , you can first render the search box, blank cards for each business data, and each title label, for example, Figure 2 The left side shows recommendations, outfits, food, home, movies, games, etc., as well as renderings Figure 2 Virtual function buttons such as Discover, Notification, and Login on the left. Then, when parsing the HTML page, the browser downloads the js static resource and executes the js static resource. Then, the browser requests the business data and downloads the business data. In this way, under the SSR architecture, the skeleton screen can be rendered first, thereby avoiding a completely white screen for a long time. Finally, the browser renders the business content of the web page based on the business data, that is, renders the business data to the corresponding position to complete the rendering of the web page. Among them, the business data includes the cover image and title. For example, Figure 2 As shown on the right side of , after the browser downloads the business data corresponding to the first blank card, it can render the cover image of the business data in the first blank card, that is, Figure 2 A window chart is shown, and the title of the business data is rendered, that is, Figure 2 The "beautiful window collection" shown in the figure can enable the user to see the business content corresponding to the first blank card. Figure 2 As shown, after the browser renders the business content corresponding to each blank card, the business content corresponding to each blank card can be found in Figure 2 The content shown on the right side will not be described one by one, and users can see the complete web page.
[0099] See also Figure 3 , Figure 3 A schematic diagram of a web page rendering system provided in an embodiment of the present application. Figure 3 As shown, the web page rendering system includes a client 10 , a rendering server 20 , a business server 30 , and a cache 40 , wherein a browser 50 is installed on the client 10 .
[0100] Exemplarily, a user can browse the target webpage of the application through a browser 50. When the user browses the target webpage, the client 10 sends a webpage rendering request to the rendering server 20, and the webpage rendering request is used to obtain the basic data and business data of the target webpage; the rendering server 20 responds to the rendering request, assembles the basic data of the target webpage, and executes the target instruction code in the basic data to generate a first data acquisition request, wherein the first data acquisition request is used to obtain the business data of the target webpage. Then, the rendering server 20 sends the basic data of the target webpage to the client 10, and while returning the basic data of the target webpage, sends the first data acquisition request to the business server 30 in parallel. Accordingly, the business server 30 responds to the first data acquisition request, assembles the business data, and returns the business data to the rendering server 20 after assembling the business data. Accordingly, the rendering server 20 stores the business data in the cache 40 after the business server 30 returns the business data.
[0101] Furthermore, after receiving the basic data returned by the rendering server 20, the client 10 performs rendering based on the basic data to display the basic content of the target webpage, and executes the target instruction code in the basic data to generate a second data acquisition request, and sends the second data acquisition request to the rendering server 20, wherein the second data acquisition request is used to acquire the business data. Accordingly, the rendering server 20 returns the business data in the cache to the client 10 in response to the second data acquisition request. Finally, the client 10 performs rendering based on the business data to display the business content of the target webpage, thereby rendering the entire target webpage.
[0102] It should be noted that the cache 40 may be any type of cache, for example, an Ehcache cache, an ElastiCache cache, and a redis cache. This application mainly describes the cache 40 as a redis cache as an example.
[0103] It can be seen that the rendering server 20 can request business data in parallel during the process of assembling basic data for the client 10, and the timing of requesting business data is advanced to the stage of assembling basic data. Then, when the client 10 is downloading basic data, executing basic data, downloading javascript files, and executing javascript files, the business server 30 can prepare business data for the client. When the client 10 needs to download business data, it can directly request business data from the rendering server 20. Accordingly, the rendering server 20 can return the business data to the client 10 from the cache 40. Since the time length for reading business data from the cache 40 is much shorter than the time required for the business server 30 to assemble business data, the client 10 can quickly obtain business data, thereby improving the rendering efficiency and speed of the web page.
[0104] See also Figure 4 , Figure 4 A schematic diagram of a flow chart of a web page rendering method provided in an embodiment of the present application. The method is applied to the above-mentioned web page rendering system. The method includes but is not limited to the following steps:
[0105] 401: The client sends a webpage rendering request to the rendering server, where the webpage rendering request is used to obtain basic data and business data included in the target webpage.
[0106] Exemplarily, when a user browses a target web page through a browser of a client, the client may send a web page rendering request to a rendering server through the browser. Correspondingly, the rendering server receives the web page rendering request.
[0107] Optionally, the target web page may be any type of web page, a web page in any browsing stage. This application is mainly described by taking the target web page as the home page of the application, also referred to as the discovery page of the application, as an example.
[0108] Optionally, the basic data is a static page of the target webpage, which can also be understood as an HTML page of the target webpage, or static content on the target webpage, or a skeleton screen of the target webpage.
[0109] Optionally, the business data is dynamic content in the target webpage, and the business data may be one or more of a video, a picture, a note, etc. This application is mainly described by taking the business data as a note as an example.
[0110] 402: The rendering server assembles basic data of the target web page in response to the web page rendering request, and executes target instruction codes in the basic data to generate a first data acquisition request, where the first data acquisition request is used to acquire business data of the target web page.
[0111] Exemplarily, the web page rendering request is a Hypertext Transfer Protocol (HTTP) request, the rendering server can parse the HTTP request, obtain a uniform resource location (URL) in the HTTP request, and then determine a target web page that the client needs to render based on the URL, and assemble basic data of the target web page from a template library.
[0112] Then, the rendering server parses the basic data, obtains the target instruction code in the basic data, and executes the target instruction code to generate a first data acquisition request. Specifically, similar to the client requesting business data, the rendering server parses the code in the basic data line by line to obtain the target tag, and uses the code between the target tags as the target instruction code, where the target tag is <script>和< / script> , then you can <script>和< / script> The code between is used as the target instruction code. The rendering server first executes the target instruction code to obtain the javascript file, that is, executes the target instruction code, and obtains the javascript file from the CDN. Finally, the rendering server executes the javascript file to generate the first data acquisition request, wherein the first data acquisition request can be an Ajax request. Among them, the javascript file of this application can also be called js static resource, and executing javascript file can also be understood as executing js static resource.
[0113] 403: The rendering server sends a first data acquisition request to the business server, and stores the business data in a cache after the business server returns the business data.
[0114] First, it is explained that the rendering server is mainly responsible for rendering the target web page, and the business server is mainly used to manage the business data in the target web page, such as some user-generated content uploaded by users, etc. Therefore, the rendering server can send a first data acquisition request to the business server to acquire the business data of the target web page from the business server.
[0115] Optionally, the rendering server sends a first data acquisition request to the business server through a local data interface. Since the present application is to render the home page, and the business data of the home page is in the form of a feed stream, for ease of distinction, the present application also refers to the local data interface as a homefeed interface.
[0116] Optionally, in order to enable the business server to assemble business data that matches the user, when the client sends a web page rendering request, the web page rendering request includes the user ID of the user. Accordingly, the first data acquisition request includes the user ID. Accordingly, after receiving the first data acquisition request, the business server parses the first data acquisition request to obtain the user ID, and based on the user ID, obtains the user's portrait information (for example, the user's preference information, location information, social information, etc.). Finally, the business server determines the content that matches the user based on the user's portrait information, and assembles the content into business data and returns it to the rendering server.
[0117] Accordingly, the rendering server stores the service data in the cache after the service server returns the service data.
[0118] In one embodiment of the present application, in order to cache the business data in the cache, the rendering server needs to create a data structure in the cache before sending a first data acquisition request to the business server, and cache the business data through the data structure. Optionally, the data structure includes a key and a value, and the value is used to cache the business data. Among them, the key can be the user's identifier, for example, the key is the user's universally unique identifier (UUID) and / or the web_session used by the browser. This application is mainly explained by taking the example that the key includes both the user's UUID and web_session, that is, the key is web_session_UUID.
[0119] Optionally, the data structure can be a JSON object.
[0120] 404: The rendering server sends basic data of the target webpage to the client.
[0121] Optionally, after determining the key of the business data in the cache, the rendering server may send the basic data of the target webpage to the client and return the key to the client. Specifically, after creating the data structure, the rendering server may return the basic data and the key of the data structure (which may also be understood as the key of the business data) to the client, so that the client can request the business data corresponding to the key from the rendering server based on the key.
[0122] 405: The client performs rendering based on the basic data to display the basic content of the target webpage, and executes the target instruction code in the basic data to generate a second data acquisition request.
[0123] Exemplarily, the client parses the basic data to obtain the target instruction code in the basic data, and executes the target instruction code to generate a second data acquisition request. Specifically, the client parses the code in the basic data line by line to obtain the target tag, and uses the code between the target tags as the target instruction code, wherein the target tag is <script>和< / script> , then <script>和< / script> The code between is used as the target instruction code. Then, the client first executes the target instruction code to obtain the javascript file, that is, executes the target instruction code and obtains the javascript file from the CDN network; finally, the client executes the javascript file to generate the second data acquisition request.
[0124] It should be noted that when the client parses the code in the basic data line by line, it will first parse out the reference tags for the CSS basic data in the basic data, for example, <link> Tags or <style>标签,然后客户端会基于该css基础数据的引用标签从CDN下载css文件。然后客户端执行该css文件,得到骨架屏的渲染样式,并基于该渲染样式先完成对目标网页的骨架屏的渲染,从而先渲染出骨架屏,给用户先展示一个骨架屏,不会有长时间的白屏等待,提高用户的浏览体验。
[0125] 406:客户端向所述渲染服务器发送所述第二数据获取请求,其中,所述第二数据获取请求用于获取所述目标网页的业务数据。
[0126] 示例性的,该第二数据获取请求包括上述的键,以便于渲染服务器使用该键从缓存中查询与该键对应的上述的业务数据。
[0127] 407:渲染服务器响应于所述第二数据获取请求,将所述缓存中的所述业务数据返回至所述客户端。
[0128] 示例性的,渲染服务器解析该第二数据获取请求,得到业务数据的键,然后基于该键从缓存中查询该业务数据,并将该业务数据返回给该客户端。
[0129] 具体的,渲染服务器基于该键,确定与该键对应的数据结构,然后获取该数据结构中的值,可得到该业务数据,并返回给客户端。
[0130] 408:客户端基于所述业务数据进行渲染,以显示所述目标网页的业务内容。
[0131] 示例性的,客户端在接收到基础数据后,就会先渲染出目标网页的骨架屏,等到接收到该业务数据后,客户端在渲染出骨架屏的基础上,使用该业务数据对该骨架屏进行渲染,即在骨架屏上渲染出目标网页的业务内容,从而渲染出完整的目标网页。
[0132] 可以看出,在本申请实施例中,渲染服务器为客户端组装基础数据的过程中,就可以并行地的请求业务数据,将请求业务数据的时机提前到组装基础数据阶段,则客户端在下载基础数据、执行基础数据以及下载javascript文件,执行javascript文件的过程中,业务服务器可以为客户端准备好业务数据,等到客户端需要下载业务数据时,可以直接从渲染服务器请求业务数据,相应地,渲染服务器可以从缓存中将业务数据返回给客户端,由于从缓存中读取业务数据的时长远远小于业务服务器组装业务数据所需的时间,从而客户端能够快速的获取到业务数据,进而提高了网页的渲染效率和速度。
[0133] 在本申请的一个实施方式中,由于业务服务器组装业务数据、传输业务数据的时间是比较长的,而客户端下载javascript文件、执行javascript文件的时长是比较短的,这样也就可能造成渲染服务器将基础数据返回给客户端,客户端执行该基础数据中的目标指令代码,向渲染服务器发送第二数据获取请求,以获取业务数据时,业务服务器这边还没组装好业务数据,或者,业务数据还没完全传输给渲染服务器,总的来讲,就会就造成客户端向渲染服务器请求该业务数据时,渲染服务器还没有拿到该业务数据,也就是说,渲染服务器并不能直接从缓存中获取到该业务数据。
[0134] 因此,渲染服务器在响应于所述第二数据获取请求,从所述缓存中查询所述业务数据时,首先需要检测是否能够从缓存中获取到该业务数据。
[0135] 可选地,若获取到该业务数据,则将该业务数据直接返回至所述客户端,即在渲染服务器从缓存中查询该业务数据时,业务服务器已经将业务数据返回给渲染服务器,并且渲染服务器已经将该业务数据存储到了缓存中。
[0136] 可选地,若未获取到业务数据,则说明渲染服务器从缓存中查询该业务数据时,还没将业务数据存储到缓存中,则渲染服务器可以直接向所述客户端返回针对所述第二数据获取请求的失败响应,所述失败响应用于指示所述渲染服务器未获取到所述业务数据,以使所述客户端基于所述失败响应生成第三数据获取请求,其中,所述第三数据获取请求用于从所述业务服务器获取所述业务数据。即渲染服务器从缓存中没有查询到该业务数据,则直接向客户端返回失败响应,不再持续查询,便于客户端及时从业务服务器获取该业务数据。
[0137] 可选地,若未获取到业务数据,渲染服务器不会直接返回失败响应,而是会持续从所述缓存中查询所述业务数据,直至获取到所述业务数据或者达到定时时长为止。具体地,若渲染服务器未从缓存中获取到该业务数据,就会持续从所述缓存中查询所述业务数据,直至获取到了该业务数据,则渲染服务器可将该业务数据返回给客户端;或者,在持续从所述缓存中查询所述业务数据的过程中设置有定时时长,若在定时时长内获取到该业务数据,即在定时时长内渲染服务器成功将该业务数据存储到了缓存中,则可将该业务数据返回给客户端,若到达定时时长,仍然未获取到该业务数据,则停止获取该业务数据,并向客户端返回针对所述第二数据获取请求的失败响应,该失败响应用于指示所述渲染服务器未获取到所述业务数据。可以看出,若渲染服务器从缓存中查询该业务数据时,还没将业务数据存储到缓存中时,并不是直接返回失败响应,而是会继续等待,并持续查询该业务数据,因为业务服务器可能已经将业务数据组装好了,还没有返回给渲染服务器或者还没有完全返回给渲染服务器,如果直接发送失败响应,那么客户端就需要重新请求业务数据,那么业务服务器就需要重新组装业务数据,获取到业务数据的时间就比较长,这样持续等待就不需要业务服务器重新组装业务数据,从而降低了获取业务数据的时间,进而提高了网页的渲染效率。
[0138] 进一步地,若客户端接收到渲染服务器返回的针对该第二数据获取请求的失败响应,则基于该失败响应,生成第三数据获取请求,其中,所述第三数据获取请求用于从所述业务服务器获取所述业务数据。即客户端未从渲染服务器获取到该业务数据,则客户端向业务服务器发送第三数据获取请求,即客户端通过客户端的本地数据接口,向业务服务器发送第三数据获取请求,其中,该第三数据获取请求用于获取所述业务数据,由于本申请是对首页进行渲染,本申请将该本地数据接口称为homefeed接口。相应地,业务服务器接收到该第三数据获取请求后,会为该用户组装该业务数据,然后向该客户端返回该业务数据,这样客户端可以基于业务数据和基础数据渲染目标网页。可以看出,本申请中为客户端设置了渲染失败的降级策略,即若客户端没有从渲染服务器拿到业务数据,会重新请求业务服务器组装业务数据,以便于获取到业务数据,从而避免一直显示骨架屏,没有实质内容。
[0139] 在本申请的一个实施方式中,渲染服务器为了能够高效的确定出是否能够从缓存中获取到该业务数据,在从业务服务器请求业务数据时,可同步缓存该业务数据的缓存进度,渲染服务器使用上述键从缓存中查询该业务数据时,先获取业务数据的缓存进度,通过该缓存进度确定是否能够从缓存中获取到该业务数据。
[0140] 其中,缓存进度包括完成缓存、缓存中和缓存失败中的一种或多种。
[0141] 可选地,在渲染服务器从缓存中查询该业务数据时,若所述缓存进度指示所述业务数据完成缓存,则说明渲染服务器接收到第二数据获取请求前,渲染服务器就已经从业务服务器拿到了业务数据,并且将该业务数据存储到了缓存中,渲染服务器可以直接从缓存(数据结构)中获取到该业务数据返回给客户端。
[0142] 可选地,在渲染服务器从缓存中查询该业务数据时,若该缓存进度指示该业务数据缓存中,则说明渲染服务器还未成功将业务数据存储到缓存中,则渲染服务器会等待业务服务器返回业务数据,并持续从所述缓存中查询所述业务数据,并且持续检测该业务数据的缓存进度,若在定时时长内检测到该缓存进度指示业务数据完成缓存,则说明在定时时长内业务服务器将业务数据返回给渲染服务器,并且渲染服务器将该业务数据存储到了缓存(数据结构)中,因此渲染服务器可以从缓存中获取到该业务数据并将该业务数据返回给客户端。进一步地,若在定时时长后检测到缓存进度仍然指示业务数据缓存中,则说明在定时时长到来时,渲染服务器仍然没有将业务数据存储到缓存中,比如,业务服务器没有给该用户组装出业务数据或者通信故障没有将业务数据返回给渲染服务器;又如,该业务数据还在缓存中,还没有全部存储到缓存中,这种情况下,渲染服务器是无法从缓存中获取出该业务数据,则会停止从缓存中查询该业务数据,渲染服务器会向客户端发送上述的失败响应。
[0143] 可选地,若缓存进度指示业务数据缓存失败,则渲染服务器向客户端返回上述针对第二数据获取请求的失败响应。示例性的,在渲染服务器从缓存中查询该业务数据时,若该缓存进度指示业务数据缓存失败,渲染服务器向客户端返回失败响应;或者,在渲染服务器从缓存中查询该业务数据时,该缓存进度指示业务数据缓存中,但是在定时时长内持续从缓存中查询该业务数据时,检测到缓存进度指示业务数据缓存失败,即在定时时长内确定该业务数据缓存失败,则渲染服务器会向客户端返回失败响应。
[0144] 在本申请的一个实施方式中,若在定时时长后检测到缓存进度指示业务数据缓存中,在向客户端返回上述失败响应之前,渲染服务器确定是否从业务服务器接收到业务数据,若是,则说明该业务数据还未完全写入到该数据结构,故还未将业务数据的缓存进度更新为完成缓存,为了方便区分,将业务数据中已写入到数据结构的部分称为已写入业务数据,未写入到数据结构的部分称为未写入业务数据。但是,由于业务服务器已经组装好了该业务数据,如果直接返回失败响应,则客户端需要请求业务服务器重新组装业务数据,比较耗时,因此渲染服务器暂停向数据结构中写入该业务数据,也即暂停从业务服务器接收该未写入业务数据,并从该缓存中读取已写入业务数据,然后将该已写入业务数据返回给客户端,这样客户端接收到该已写入业务数据后,可先渲染该已写入业务数据,这样就可以先渲染出部分业务数据。然后,针对未写入业务数据,在传输完该写入业务数据后,渲染服务器继续接收该未写入业务数据,并透传给客户端,从而便于客户端完成整个网页的业务数据的渲染。若渲染服务器确定未从业务服务器接收到该业务数据,则说明该业务服务器没有组装出该业务数据,或者,业务服务器故障,完全没有传输业务数据,则向客户端发送上述失败响应。
[0145] 可以看出,在本实施方式中,若在定时时长内,还未将业务数据完全写入到缓存中时,并不会直接返回响应失败,而是暂停写入,直接将已缓存的业务数据读取出,返回给客户端,这样客户端就会先渲染出部分业务数据,而且无需客户端重新请求业务数据,从而降低网页的渲染时长,提高用户体验。
[0146] 进一步地,由于渲染服务器会将已写入业务数据提前返回给客户端,为了提高对用户的吸引力,业务服务器在组装业务数据时,会基于每个业务数据的内容和用户信息,确定每个业务数据与用户信息的匹配度;基于匹配度从高到低的顺序,对业务数据进行排序;这样业务服务器返回业务数据时,可以按照排序结果依次返回业务数据,就能够优先返回匹配度比较高的业务数据,这样客户端就能够优先渲染出匹配度较高的业务数据,从而让用户优先看到自己感兴趣的内容,能够提高用户点击首页并访问首页的概率。
[0147] 在本申请的一个实施方式中,为了提高对数据结构的利用率,可以通过上述数据结构的值对应的字段,来指示业务数据的缓存进度。示例性的,上述数据结构的值对应的字段包括第一字段和第二字段,其中,第一字段的取值用于指示业务数据的缓存进度,第二字段用于缓存业务数据。例如,第一字段为status字段,则该status字段的取值用于指示业务数据的缓存进度,第二字段为data字段,则该data字段的取值用于缓存该业务数据。
[0148] 具体地,完成缓存可通过取值"success”指示,缓存中可通过取值"pending”指示。因此,若业务数据缓存完成,则将第一字段的取值设置为"success”,若业务数据缓存中,则将第一字段的取值设置为"pending”。可以理解,渲染服务器在开始创建该数据结构时,由于还没有获取到业务数据,则可将第二字段的取值可设置为空(null),同时将第一字段的取值可设置为"pending”,通过"pending”指示该业务数据还缓存中。因此,渲染服务器可以通过第一字段的取值,确定该业务数据的缓存进度。
[0149] 在本申请的一个实施方式中,上述定时时长为上述数据结构的存活时长,为数据结构设置定时时长,能够及时清理该数据结构,避免该数据结构长时间存在占据缓存的大量内存。
[0150] 因此,基于上述的数据结构,则渲染服务器可通过预设命令在缓存中创建数据结构,即渲染服务器向缓存发送预设命令,通过该预设命令创建上述数据结构。
[0151] 其中,预设命令可以为psetex命令。仍然以上述的键和字段为例,则预设命令为:psetex[web_session]_[UUID]t{status:pending,data:null},则渲染服务器向缓存发送该预设命令,指示在该缓存中创建数据结构,并且创建的数据结构的键为[web_session]_[UUID],该数据结构的值为status:pending,data:null,该数据结构的定时时长为t。
[0152] 在本申请的一个实施方式中,为了避免定时时长设置过短造成业务数据还未完全缓存到数据结构而清理数据结构或者渲染服务器认为没有从数据结构获取到该业务数据,又为了避免定时时长设置过长,没有及时清理数据结构,导致无用的数据结构过多,从而占据缓存的大量内存,本申请可以动态设置定时时长。
[0153] 示例性的,在创建数据结构前,渲染服务器查询当前时刻缓存的可用内存,例如,渲染服务器通过info memory命令查询该缓存的剩余内存;基于对该缓存的最小内存的限制,以及该剩余内存,可确定该当前时刻的可用内存;以及确定当前时刻渲染网页的并发量;基于该可用内存和并发量,确定该数据结构的定时时长。示例性的,渲染服务器获取业务数据的平均内存;基于该平均内存,以及当前时刻的并发量,确定当前时刻创建的数据结构所要占用的内存,即将并发量与平均内存的乘积作为当前时刻所要占用的内存;同样地,渲染服务器获取当前时刻之后的未来各个时刻创建的数据结构所要占用的内存;最后,渲染服务器将当前时刻对应的占用的内存以及未来各个时刻对应的占用的内存进行累加,直至累加出的内存大于或者等于该可用内存,将参与累加的最后一个未来时刻与该当前时刻之间的时长作为该数据结构的定时时长。
[0154] 可以理解,当到达该最后一个未来时刻时,则会把所有可用内存全部占用,但是,此时为当前时刻所创建的数据结构会过期,这样就会把当前时刻的数据结构释放,从而使该缓存仍然有可用内存,保证redis缓存中一直有可用的内存,这样就会给每个数据结构尽可能多的定时时长,从而避免出现定时时长不足,导致无法从渲染服务器获取到业务数据,需要重新请求组装业务数据的情况,这样就能够尽可能的保证客户端能够从渲染服务器拿到业务数据,从而提高渲染效率。
[0155] 在本申请的一个实施方式中,在通过上述数据结构缓存业务数据时,则渲染服务器在缓存中创建好上述数据结构后,并从业务服务器获取到业务数据后,渲染服务器基于写命令,将该业务数据写入到数据结构,并且将该业务数据的缓存状态更新为完成缓存,示例性的,该写命令包括上述数据结构的键。例如,该写命令为:SET[web_session]_[UUID]{success,data},其中,该data为业务数据,即通过该写命令指示将缓存状态更新为完成缓存,以及将业务数据写入到data字段。
[0156] 在本申请的一个实施方式中,若渲染服务器将所述业务数据返回至所述客户端,即渲染服务器从缓存中获取到了业务数据,则在将业务数据返回至所述客户端,从所述缓存删除所述业务数据。示例性的,渲染服务器在将业务数据返回至所述客户端后,向缓存发送删除请求,其中,该删除请求用于删除该数据结构。相应地,缓存接收到该删除请求后,删除该数据结构,即及时删除数据结构以释放缓存的内存。示例性的,删除请求包括数据结构的键,以指示缓存删除与该键对应的该数据结构。例如,删除请求为DEL[web_session]_[UUID]。
[0157] 在本申请的一个实施方式中,渲染服务器将业务数据返回给客户端后,无需删除上述数据结构,而是清空该数据结构中的第二字段,即清空data字段,并更新上述数据结构的定时时长,例如,将数据结构的定时时长更新为目标定时时长,例如,该目标定时时长为上述定时时长的二倍。然后,渲染服务器向业务服务器发送第四数据获取请求,其中,第四数据获取请求用于获取网页的新的业务数据,并从业务服务器接收新的业务数据,并将该新的业务数据缓存到上述数据结构。这样当用户滚动网页或者刷新网页时,客户端向渲染服务器发送第五数据获取请求,即客户端通过上述javascript文件监测用户与网页的交互行为,当监测到网页存在滚动行为或者刷新行为时,则可以通过javascript文件向渲染服务器发送第五数据获取请求,其中,该第五数据获取请求用于获取该网页的新的业务数据。响应于该第五数据获取请求,渲染服务器从该数据结构中读取该新的业务数据,并将该新的业务数据返回给客户端。
[0158] 在本申请的一个实施方式中,渲染服务器通过预请求先将业务数据存储到缓存后,则本申请的目标网页的渲染过程可以包括如图5所示的具体内容:
[0159] 浏览器通过网关请求渲染服务器渲染目标网页。然后,渲染服务器组装目标网页的HTML页面,以及浏览器下载该HTML页面;浏览器通过解析该HTML页面,执行该HTML中的目标指令代码,下载js静态资源,并且浏览器执行该js静态资源,以请求业务数据。并且,在渲染服务器组装目标网页的HTML页面、浏览器下载该HTML页面、浏览器下载js静态资源以及执行下载js静态资源的过程中,渲染服务器可以并行地请求业务数据,即将请求业务数据的过程,提前到渲染服务器组装目标网页的HTML页面、浏览器下载js静态资源以及执行下载js静态资源这些过程中并行执行。然后,渲染服务器把请求到的业务数据缓存到预先在缓存中创建的数据结构。这样当浏览器执行js静态资源,请求业务数据时,可以向渲染服务器请求业务数据,渲染服务器会从缓存中读取业务数据返回给浏览器。相应地,浏览器会下载该业务数据,从而渲染目标网页。经过上述并行执行,渲染服务器可以在组装HTML页面时,并行地通过homefeed接口请求业务数据,这样当浏览器需要下载业务数据时,渲染服务器可以通过redis接口读取业务数据。
[0160] 下面结合图6并以业务数据为媒体内容,即笔记为例说明本申请的网页渲染过程。
[0161] 参阅图6,图6为本申请实施例提供的另一种网页渲染方法的流程示意图。该方法应用于上述的网页渲染系统。本实施中与图4示出的实施例中相同的内容,不再重复描述。该方法包括但不限于以下步骤中的内容:
[0162] 601:客户端向所述渲染服务器发送网页渲染请求,其中,所述网页渲染请求用于获取目标网页,所述目标网页用于显示与用户相匹配的媒体内容和所述目标网页的基础内容。
[0163] 可选地,该网页渲染请求可以包括用户的标识,以便于业务服务器基于用户的标识,确定与该用户相匹配的媒体内容。
[0164] 602:所述渲染服务器响应于所述网页渲染请求,组装得到所述目标网页的基础数据,并执行所述基础数据中的目标指令代码,生成第一数据获取请求。
[0165] 603:所述渲染服务器向所述业务服务器发送第一数据获取请求,所述第一获取请求用于获取与所述媒体内容对应的媒体数据。
[0166] 可选地,该第一数据获取请求包括用户的标识,以便于业务服务器基于用户的标识,确定与该媒体内容对应的媒体数据。
[0167] 可以理解,此处的业务服务器可以是推荐服务器,则该业务服务器会基于该用户标识,组装出上述媒体数据。
[0168] 604:所述业务服务器响应于所述第一数据获取请求,获取所述媒体数据。
[0169] 示例性的,业务服务器会基于该用户标识,获取到该用户的画像,然后基于该画像,确定与该用户匹配的内容(笔记),然后将该匹配的内容进行组装,得到该媒体数据。
[0170] 605:所述业务服务器将所述媒体数据返回至所述渲染服务器。
[0171] 606:所述渲染服务器在所述业务服务器返回所述媒体内容将所述媒体数据存储至缓存。
[0172] 607:所述渲染服务器向所述客户端发送所述目标网页的基础数据。
[0173] 其中,该基础数据用于渲染出该目标网页的基础内容。
[0174] 608:所述客户端基于所述基础数据进行渲染,以显示所述目标网页的基础内容,并执行所述基础数据中的目标指令代码,生成第二数据获取请求,所述第二数据获取请求用于获取所述媒体数据。
[0175] 609:所述客户端向所述渲染服务器发送所述第二数据获取请求。
[0176] 610:所述渲染服务器响应于所述第二数据获取请求,将所述缓存中的所述媒体数据返回至所述客户端。
[0177] 611:所述客户端基于所述媒体数据进行渲染,显示所述目标网页的媒体内容。
[0178] 示例性的,客户端首先利用基础数据渲染出该目标网页的骨架屏;然后,客户端拿到媒体数据后,即拿到笔记后,会确定每个笔记的封面图,并将每个笔记的封面图渲染到该骨架屏中与每个笔记对应的卡片中,渲染出目标网页的媒体内容,从而渲染出完整的目标网页。
[0179] 参阅图7,图7为本申请实施例提供的一种渲染服务器的示意图。渲染服务器700包括:收发单元701和处理单元702,其中:
[0180] 收发单元701,用于从客户端接收网页渲染请求,所述网页渲染请求用于获取目标网页包括的基础数据和业务数据,以便所述客户端基于所述基础数据和所述业务数据渲染得到所述目标网页;
[0181] 处理单元702,用于组装得到所述目标网页的基础数据,并执行所述基础数据中的目标指令代码,以生成第一数据获取请求,所述第一数据获取请求用于获取所述目标网页的业务数据;
[0182] 收发单元701,还用于向业务服务器发送第一数据获取请求,在所述业务服务器返回所述业务数据之后将所述业务数据存储至缓存;向所述客户端发送所述目标网页的基础数据,以便所述客户端执行所述基础数据中的目标指令代码,以生成第二数据获取请求,所述第二数据获取请求用于获取所述业务数据;从所述客户端接收第二数据获取请求;以及响应于所述第二数据获取请求,所述缓存中的将所述业务数据返回至所述客户端。
[0183] 在本申请的一个实施方式中,在响应于所述第二数据获取请求,将所述缓存中的所述业务数据返回至所述客户端方面,处理单元702,具体用于:
[0184] 响应于所述第二数据获取请求,从所述缓存中查询所述业务数据;
[0185] 若未获取到所述业务数据,则持续从所述缓存中查询所述业务数据直至获取到所述业务数据或者到达定时时长为止;以及 / 或者,
[0186] 若未获取到所述业务数据,则向所述客户端返回针对所述第二数据获取请求的失败响应,所述失败响应用于指示所述渲染服务器未获取到所述业务数据,以使所述客户端基于所述失败响应生成第三数据获取请求,其中,所述第三数据获取请求用于从所述业务服务器获取所述业务数据。
[0187] 在本申请的一个实施方式中,处理单元702,还用于获取所述业务数据的缓存进度;
[0188] 若所述缓存进度指示所述业务数据缓存中,则持续从所述缓存中查询所述业务数据;以及 / 或者,若所述缓存进度指示所述业务数据缓存失败,则向所述客户端返回针对所述第二数据获取请求的失败响应,以使所述客户端基于所述失败响应生成第三数据获取请求。
[0189] 在本申请的一个实施方式中,处理单元702,还用于若将所述业务数据返回至所述客户端,从所述缓存删除所述业务数据。
[0190] 参阅图8,图8为本申请实施例提供的一种客户端的示意图。客户端800包括:收发单元801和处理单元802,其中:
[0191] 收发单元801,用于向渲染服务器发送网页渲染请求,所述网页渲染请求用于获取目标网页包括的基础数据和业务数据;从所述渲染服务器接收所述渲染服务器响应于所述网页渲染请求,组装得到的所述目标网页的基础数据;
[0192] 处理单元802,用于基于所述基础数据进行渲染,以显示所述目标网页的基础内容,并执行所述基础数据中的目标指令代码,生成第二数据获取请求,其中,所述第二数据获取请求用于获取所述目标网页的业务数据;
[0193] 收发单元801,还用于向所述渲染服务器发送所述第二数据获取请求,以获取所述渲染服务器缓存的所述业务数据,所述业务数据是所述渲染服务器向业务服务器发送第一数据获取请求,并在所述业务服务器返回所述业务数据之后缓存得到的,所述第一数据获取请求是所述渲染服务器执行所述基础数据中的目标指令代码生成的,所述第一获取请求用于获取所述目标网页的业务数据;
[0194] 处理单元802,还用于基于所述业务数据进行渲染,以显示所述目标网页的业务内容。
[0195] 在本申请的一个实施方式中,收发单元801,还用于从所述渲染服务器获取到针对所述第二数据获取请求的失败响应;处理单元802,还用于基于所述失败响应,生成第三数据获取请求,其中,所述失败响应用于指示未从所述渲染服务器获取到所述业务数据,所述第三数据获取请求用于从所述业务服务器获取所述业务数据;收发单元801,还用于向所述业务服务器发送所述第三数据获取请求;从所述业务服务器接收所述业务数据。
[0196] 参阅图9,图9为本申请实施例提供的一种网页渲染系统的示意图。网页渲染系统900包括:客户端901、渲染服务器902以及业务服务器903;
[0197] 在本申请的一个实施方式中,当目标网页的业务数据为任意一种数据类型时,
[0198] 所述客户端901,用于向渲染服务器902发送网页渲染请求,所述网页渲染请求用于获取目标网页包括的基础数据和业务数据;
[0199] 所述渲染服务器902,用于响应于所述网页渲染请求,组装得到所述目标网页的基础数据,并执行所述基础数据中的目标指令代码,以生成第一数据获取请求,所述第一数据获取请求用于获取所述目标网页的业务数据;
[0200] 所述渲染服务器902,用于向所述业务服务器903发送第一数据获取请求,并在所述业务服务器903返回所述业务数据之后将所述业务数据存储至缓存;
[0201] 所述渲染服务器902,用于向所述客户端发送所述目标网页的基础数据;
[0202] 所述客户端901,用于基于所述基础数据进行渲染,以显示所述目标网页的基础内容,并执行所述基础数据中的目标指令代码,生成第二数据获取请求,其中,所述第二数据获取请求用于获取所述目标网页的业务数据;
[0203] 所述客户端901,用于向所述渲染服务器发送所述第二数据获取请求;
[0204] 所述渲染服务器902,用于响应于所述第二数据获取请求,将所述缓存中的所述业务数据返回至所述客户端;
[0205] 所述客户端901,用于基于所述业务数据进行渲染,以显示所述目标网页的业务内容。
[0206] 在本申请的一个实施方式中,当目标网页的业务数据为媒体数据时,
[0207] 所述客户端901,用于向所述渲染服务器902发送网页渲染请求,其中,所述网页渲染请求用于获取目标网页,所述目标网页用于显示与用户相匹配的媒体内容和所述目标网页的基础内容;
[0208] 所述渲染服务器902,用于响应于所述网页渲染请求,组装得到所述目标网页的基础数据,并执行所述基础数据中的目标指令代码,生成第一数据获取请求;
[0209] 所述渲染服务器902,用于向所述业务服务器发送第一数据获取请求,所述第一获取请求用于获取与所述媒体内容对应的媒体数据;
[0210] 所述业务服务器903,用于响应于所述第一数据获取请求,获取所述媒体数据;
[0211] 所述业务服务器903,用于将所述媒体数据返回至所述渲染服务器;
[0212] 所述渲染服务器902,用于在所述业务服务器903返回所述媒体内容将所述媒体数据存储至缓存;
[0213] 所述渲染服务器902,用于向所述客户端发送所述目标网页的基础数据;
[0214] 所述客户端901,用于基于所述基础数据进行渲染,以显示所述目标网页的基础内容,并执行所述基础数据中的目标指令代码,生成第二数据获取请求,所述第二数据获取请求用于获取所述媒体数据;
[0215] 所述客户端901,用于向所述渲染服务器发送所述第二数据获取请求;
[0216] 所述渲染服务器902,用于响应于所述第二数据获取请求,将所述缓存中的所述媒体数据返回至所述客户端;
[0217] 所述客户端901,用于基于所述媒体数据进行渲染,显示所述目标网页的媒体内容。
[0218] 此外,关于客户端901、渲染服务器902以及业务服务器903的具体功能,可参见上述方法实施例中关于客户端、渲染服务器以及业务服务器描述,不再重复描述。
[0219] 参阅图10,图10为本申请实施例提供的一种电子设备的示意图。如图10所示,电子设备1000包括收发器1001、处理器1002和存储器1003。它们之间通过总线1004连接。存储器1003用于存储计算机程序和数据,并可以将存储器1003存储的数据传输给处理器1002。可选地,电子设备1000可以为上述的渲染服务器700或者客户端800。
[0220] 可选地,当电子设备为上述的渲染服务器700时,处理器1002用于读取存储器1003中的计算机程序执行以下操作:
[0221] 控制收发器1001从客户端接收网页渲染请求,所述网页渲染请求用于获取目标网页包括的基础数据和业务数据,以便所述客户端基于所述基础数据和所述业务数据渲染得到所述目标网页;
[0222] 组装得到所述目标网页的基础数据,并执行所述基础数据中的目标指令代码,以生成第一数据获取请求,所述第一数据获取请求用于获取所述目标网页的业务数据;
[0223] 控制收发器1001向业务服务器发送第一数据获取请求,在所述业务服务器返回所述业务数据之后将所述业务数据存储至缓存;
[0224] 向所述客户端发送所述目标网页的基础数据,以便所述客户端执行所述基础数据中的目标指令代码,以生成第二数据获取请求,所述第二数据获取请求用于获取所述业务数据;从所述客户端接收第二数据获取请求;以及
[0225] 响应于第二数据获取请求,将所述业务数据返回至所述客户端。
[0226] 具体地,上述收发器1001可为图7所述的实施例的渲染服务器700的收发单元701,上述处理器1002可以为图7所述的实施例的渲染服务器700的处理单元702,不再重复描述。
[0227] 可选地,当电子设备1000为上述的客户端800时,处理器1002用于读取存储器1003中的计算机程序执行以下操作:
[0228] 控制收发器1001向渲染服务器发送网页渲染请求,所述网页渲染请求用于获取目标网页包括的基础数据和业务数据;从所述渲染服务器接收所述渲染服务器响应于所述网页渲染请求,组装得到的所述目标网页的基础数据;
[0229] 基于所述基础数据进行渲染,以显示所述目标网页的基础内容,并执行所述基础数据中的目标指令代码,生成第二数据获取请求,其中,所述第二数据获取请求用于获取所述目标网页的业务数据;
[0230] 控制收发器1001向所述渲染服务器发送所述第二数据获取请求,以获取所述渲染服务器缓存的所述业务数据,所述业务数据是所述渲染服务器向业务服务器发送第一数据获取请求,并在所述业务服务器返回所述业务数据之后缓存得到的,所述第一数据获取请求是所述渲染服务器执行所述基础数据中的目标指令代码生成的,所述第一获取请求用于获取所述目标网页的业务数据;
[0231] 基于所述业务数据进行渲染,以显示所述目标网页的业务内容。
[0232] 具体地,上述收发器1001可为图8所述的实施例的客户端800的收发单元801,上述处理器1002可以为图8所述的实施例的客户端800的处理单元802,不再重复描述。
[0233] 应理解,本申请中的电子设备可以包括智能手机(如Android手机、iOS手机、Windows Phone手机等)、平板电脑、掌上电脑、笔记本电脑、移动互联网设备MID(MobileInternet Devices,简称:MID)或穿戴式设备等。上述电子设备仅是举例,而非穷举,包含但不限于上述电子设备。在实际应用中,上述电子设备还可以包括:智能车载终端、计算机设备等等。
[0234] 本申请各个服务器,比如,数据服务器,渲染服务器,推荐服务器,业务服务器,均可以为云计算服务器、内容分发网络(Content Delivery Network,CDN)服务器、网络时间协议(Network Time Protocol,NTP)、域名解析系统(Domain Name System,DNS)服务器,等其他各种类型的服务器。上述服务器仅是举例,而非穷举,包含但不限于上述服务器。
[0235] 本申请实施例还提供一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行以实现如上述方法实施例中记载的任何一种网页渲染方法的部分或全部步骤。
[0236] 本申请实施例还提供一种计算机程序产品,所述计算机程序产品包括存储了计算机程序的非瞬时性计算机可读存储介质,所述计算机程序可操作来使计算机执行如上述方法实施例中记载的任何一种网页渲染方法的部分或全部步骤。
[0237] 需要说明的是,对于前述的各方法实施例,为了简单描述,故将其都表述为一系列的动作组合,但是本领域技术人员应该知悉,本申请并不受所描述的动作顺序的限制,因为依据本申请,某些步骤可以采用其他顺序或者同时进行。其次,本领域技术人员也应该知悉,说明书中所描述的实施例均属于可选实施例,所涉及的动作和模块并不一定是本申请所必须的。
[0238] 在上述实施例中,对各个实施例的描述都各有侧重,某个实施例中没有详述的部分,可以参见其他实施例的相关描述。
[0239] 在本申请所提供的几个实施例中,应该理解到,所揭露的装置,可通过其它的方式实现。例如,以上所描述的装置实施例仅仅是示意性的,例如所述单元的划分,仅仅为一种逻辑功能划分,实际实现时可以有另外的划分方式,例如多个单元或组件可以结合或者可以集成到另一个系统,或一些特征可以忽略,或不执行。另一点,所显示或讨论的相互之间的耦合或直接耦合或通信连接可以是通过一些接口,装置或单元的间接耦合或通信连接,可以是电性或其它的形式。
[0240] 所述作为分离部件说明的单元可以是或者也可以不是物理上分开的,作为单元显示的部件可以是或者也可以不是物理单元,即可以位于一个地方,或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例方案的目的。
[0241] 另外,在本申请各个实施例中的各功能单元可以集成在一个处理单元中,也可以是各个单元单独物理存在,也可以两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现,也可以采用软件程序模块的形式实现。
[0242] 所述集成的单元如果以软件程序模块的形式实现并作为独立的产品销售或使用时,可以存储在一个计算机可读取存储器中。基于这样的理解,本申请的技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来,该计算机软件产品存储在一个存储器中,包括若干指令用以使得一台计算机设备(可为个人计算机、服务器或者网络设备等)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储器包括:U盘、只读存储器(ROM,Read-Only Memory)、随机存取存储器(RAM,Random Access Memory)、移动硬盘、磁碟或者光盘等各种可以存储程序代码的介质。
[0243] 本领域普通技术人员可以理解上述实施例的各种方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成,该程序可以存储于一计算机可读存储器中,存储器可以包括:闪存盘、只读存储器(英文:Read-Only Memory,简称:ROM)、随机存取器(英文:Random Access Memory,简称:RAM)、磁盘或光盘等。
[0244] 以上对本申请实施例进行了详细介绍,本文中应用了具体个例对本申请的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本申请的方法及其核心思想;同时,对于本领域的一般技术人员,依据本申请的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本申请的限制。< / style>
Claims
1. A webpage rendering method, characterized in that: The method is applied to a rendering server, comprising: Receiving a webpage rendering request from a client, wherein the webpage rendering request is used to obtain basic data and business data included in a target webpage, so that the client renders the target webpage based on the basic data and the business data; In response to the webpage rendering request, assembling and obtaining basic data of the target webpage, and executing target instruction codes in the basic data to generate a first data acquisition request, wherein the first data acquisition request is used to acquire business data of the target webpage; Sending a first data acquisition request to a business server, and storing the business data in a cache after the business server returns the business data; Sending basic data of the target webpage to the client so that the client executes target instruction code in the basic data to generate a second data acquisition request, where the second data acquisition request is used to acquire the business data; receiving a second data acquisition request from the client; and In response to the second data acquisition request, the business data in the cache is returned to the client.
2. The method according to claim 1, characterized in that The step of returning the business data in the cache to the client in response to the second data acquisition request includes: In response to the second data acquisition request, querying the business data from the cache; If the service data is not obtained, continue to query the service data from the cache until the service data is obtained or the timing duration is reached; and / or, If the business data is not obtained, a failure response to the second data acquisition request is returned to the client, and the failure response is used to indicate that the rendering server has not obtained the business data, so that the client generates a third data acquisition request based on the failure response, wherein the third data acquisition request is used to obtain the business data from the business server.
3. The method according to claim 2, characterized in that The method further comprises: Obtaining the cache progress of the business data; If the cache progress indicates that the business data is in the cache, then continue to query the business data from the cache; and / or, If the cache progress indicates that the business data cache fails, a failure response to the second data acquisition request is returned to the client, so that the client generates a third data acquisition request based on the failure response.
4. The method according to any one of claims 1 to 3, characterized in that: The method further comprises: If the service data is returned to the client, the service data is deleted from the cache.
5. A webpage rendering method, characterized in that: Applied to a client, the method comprises: Sending a webpage rendering request to a rendering server, wherein the webpage rendering request is used to obtain basic data and business data included in a target webpage; receiving, from the rendering server, basic data of the target web page assembled by the rendering server in response to the web page rendering request; Rendering is performed based on the basic data to display the basic content of the target webpage, and the target instruction code in the basic data is executed to generate a second data acquisition request, wherein the second data acquisition request is used to acquire the business data of the target webpage; sending the second data acquisition request to the rendering server to acquire the business data cached by the rendering server, the business data being cached after the rendering server sends the first data acquisition request to the business server and the business server returns the business data, the first data acquisition request being generated by the rendering server executing the target instruction code in the basic data, and the first acquisition request being used to acquire the business data of the target webpage; Rendering is performed based on the business data to display the business content of the target webpage.
6. The method according to claim 5, characterized in that The method further comprises: Obtaining a failure response to the second data acquisition request from the rendering server, and generating a third data acquisition request based on the failure response, wherein the failure response is used to indicate that the business data is not obtained from the rendering server, and the third data acquisition request is used to obtain the business data from the business server; Sending the third data acquisition request to the business server; The service data is received from the service server.
7. A rendering server, characterized in that: include: Transceiver unit and processing unit; The transceiver unit is used to receive a webpage rendering request from a client, wherein the webpage rendering request is used to obtain basic data and business data included in a target webpage, so that the client renders the target webpage based on the basic data and the business data; The processing unit is used to assemble and obtain the basic data of the target webpage, and execute the target instruction code in the basic data to generate a first data acquisition request, wherein the first data acquisition request is used to acquire the business data of the target webpage; The transceiver unit is further configured to send a first data acquisition request to the service server, and store the service data in a cache after the service server returns the service data; Sending basic data of the target webpage to the client so that the client executes target instruction code in the basic data to generate a second data acquisition request, where the second data acquisition request is used to acquire the business data; receiving a second data acquisition request from the client; as well as In response to the second data acquisition request, the business data is returned to the client.
8. A client, characterized in that: include: Transceiver unit and processing unit; The transceiver unit is used to send a webpage rendering request to a rendering server, wherein the webpage rendering request is used to obtain basic data and business data included in a target webpage; and receive from the rendering server the basic data of the target webpage assembled by the rendering server in response to the webpage rendering request; The processing unit is used to render based on the basic data to display the basic content of the target webpage, and execute the target instruction code in the basic data to generate a second data acquisition request, wherein the second data acquisition request is used to acquire the business data of the target webpage; The transceiver unit is further used to send the second data acquisition request to the rendering server to acquire the business data cached by the rendering server, the business data is obtained by the rendering server sending the first data acquisition request to the business server and caching after the business server returns the business data, the first data acquisition request is generated by the rendering server executing the target instruction code in the basic data, and the first acquisition request is used to acquire the business data of the target webpage; The processing unit is further used to perform rendering based on the business data to display the business content of the target webpage.
9. A web page rendering system, characterized in that: The webpage rendering system includes a client, a rendering server and a business server; The client is used to send a webpage rendering request to the rendering server, wherein the webpage rendering request is used to obtain a target webpage, and the target webpage is used to display media content matching the user and basic content of the target webpage; The rendering server is used to assemble and obtain basic data of the target web page in response to the web page rendering request, and execute the target instruction code in the basic data to generate a first data acquisition request; The rendering server is used to send a first data acquisition request to the business server, where the first acquisition request is used to acquire media data corresponding to the media content; The service server is configured to obtain the media data in response to the first data acquisition request; The business server is used to return the media data to the rendering server; The rendering server is used for returning the media content to the service server and storing the media data in a cache; The rendering server is used to send basic data of the target webpage to the client; The client is used to render based on the basic data to display the basic content of the target webpage, and execute the target instruction code in the basic data to generate a second data acquisition request, where the second data acquisition request is used to acquire the media data; The client is used to send the second data acquisition request to the rendering server; The rendering server is configured to return the media data in the cache to the client in response to the second data acquisition request; The client is used to render based on the media data to display the media content of the target webpage.
10. An electronic device, characterized in that: include: A processor and a memory, wherein the processor is connected to the memory, the memory is used to store a computer program, and the processor is used to execute the computer program stored in the memory, so that the electronic device executes the method according to any one of claims 1 to 6.
11. A computer-readable storage medium, characterized in that: The computer-readable storage medium stores a computer program, and the computer program is executed by a processor to implement the method according to any one of claims 1 to 6.