CN115186216B - 一种页面渲染方法、装置、设备、存储介质 - Google Patents
一种页面渲染方法、装置、设备、存储介质 Download PDFInfo
- Publication number
- CN115186216B CN115186216B CN202210893187.7A CN202210893187A CN115186216B CN 115186216 B CN115186216 B CN 115186216B CN 202210893187 A CN202210893187 A CN 202210893187A CN 115186216 B CN115186216 B CN 115186216B
- Authority
- CN
- China
- Prior art keywords
- time interval
- rendering
- server
- webpage
- client
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 238000009877 rendering Methods 0.000 title claims abstract description 173
- 238000000034 method Methods 0.000 title claims abstract description 57
- 238000012545 processing Methods 0.000 claims abstract description 18
- 238000004590 computer program Methods 0.000 claims description 16
- 230000008569 process Effects 0.000 claims description 5
- 238000012423 maintenance Methods 0.000 abstract description 4
- 238000004891 communication Methods 0.000 description 7
- 238000010586 diagram Methods 0.000 description 7
- 230000004044 response Effects 0.000 description 7
- 239000000463 material Substances 0.000 description 4
- 230000003068 static effect Effects 0.000 description 4
- 230000001186 cumulative effect Effects 0.000 description 3
- 238000005516 engineering process Methods 0.000 description 3
- 238000005457 optimization Methods 0.000 description 3
- 238000013519 translation Methods 0.000 description 3
- 238000013473 artificial intelligence Methods 0.000 description 2
- 238000004422 calculation algorithm Methods 0.000 description 2
- 238000004364 calculation method Methods 0.000 description 2
- 238000007405 data analysis Methods 0.000 description 2
- 230000008570 general process Effects 0.000 description 2
- 230000002035 prolonged effect Effects 0.000 description 2
- 230000006399 behavior Effects 0.000 description 1
- 230000005540 biological transmission Effects 0.000 description 1
- 239000012141 concentrate Substances 0.000 description 1
- 230000001934 delay Effects 0.000 description 1
- 238000013461 design Methods 0.000 description 1
- 230000000694 effects Effects 0.000 description 1
- 238000007689 inspection Methods 0.000 description 1
- 238000010801 machine learning Methods 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000000750 progressive effect Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/90—Details of database functions independent of the retrieved data types
- G06F16/95—Retrieval from the web
- G06F16/953—Querying, e.g. by the use of web search engines
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本申请公开了一种页面渲染方法、装置、设备、存储介质,涉及网页处理技术领域,包括:在两次写入同一资料表的当前时间段内,基于客户端在当前时间段内读取网页要求的次数对当前时间段进行划分,以确定相应的时间区间;基于每个时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过服务器渲染产生相应的网页页面;将网页页面反馈至客户端,完成页面渲染。通过本申请可以让服务器端渲染不要集中在特定时间,减少了服务器在尖峰时间的负载与工作量,或者预判客户端要求的网页资料,事先通过服务器端渲染,能自动学习客户端的操作偏好,改进服务器端渲染的时间点,可以大幅减少额外的系统运维人力。
Description
技术领域
本发明涉及网页处理技术领域,特别涉及一种页面渲染方法、装置、设备、存储介质。
背景技术
在使用者使用网页内容服务时,如果采用客户端渲染CSR(Client Side Render)的技术,会先下载html,CSS,script,image图片,font字型档案这些网页资源(webresource)档案后,才能开始渲染画面,当完成渲染网页画面后,才能使用这些网页资源所产生的网页服务。而下载这些网路资源所需的时间取决于网路的频宽。而完成整个网页的渲染与显示取决于script是否执行完毕。因为网页执行script时可能会再次跟服务器要求一些即时资料,当拿到这些即时资料,整个网页渲染动作才能完成。当script跟服务器要求即时资料,服务器端迟迟没有提供资料。那么整个网页的渲染时间,就会因为服务器端无法提供即时资料而大幅延长。如果要改善这种情况,可以用服务器端渲染SSR(Server SideRender)的方式,先将整个网页在服务器渲染完成。客户端的浏览器一拿到网页资料就可以直接显示资料。可以节省下script执行渲染后再跟服务器拿即时资料的时间。这样作的好处可以让搜寻引擎可以更容易搜索到网站的资料,改善SEO(Search EngineOptimization,搜索引擎优化),增加网站的曝光度与排名。带来更多网站流量。因为script语言的渲染工作大多在服务器端执行完毕,客户端的浏览器不需要花大量的运算资源执行script。但由于SSR的网站大部分的script运算都在服务器端,渲染运算量都在服务器上。如果客户端的使用人数太多,就会造成服务器的运算量大幅增加。
现有技术中,一般的服务端渲染的流程,是客户端对服务器端提出网页request(要求)。而服务器端根据客户端的网页request,渲染网页后产生response(回应)。然后再将response回传给客户端。这边服务器端只能被动根据客户端的网页request,渲染网页后,才能产生response。
综上,如何选择服务器端预先渲染的时间点,避免服务器端运算量集中在小范围的时间点,让服务器端渲染服务更多数量的客户端,减少客户端的浏览器获取服务器端渲染网页的等待时间,直接获取服务器端渲染完成的网页的静态档案是本领域有待解决的技术问题。
发明内容
有鉴于此,本发明的目的在于提供一种页面渲染方法、装置、设备、存储介质,能够选择服务器端预先渲染的时间点,避免服务器端运算量集中在小范围的时间点,让服务器端渲染服务更多数量的客户端,减少客户端的浏览器获取服务器端渲染网页的等待时间,直接获取服务器端渲染完成的网页的静态档案。其具体方案如下:
第一方面,本申请公开了一种页面渲染方法,应用于服务器端,包括:
在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间;
基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面;
将所述网页页面反馈至客户端,完成页面渲染。
可选的,所述基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间,包括:
基于历史时间段内客户端读取网页要求的次数计算所述历史时间段的读取比率以及所述客户端在所述当前时间段内读取网页要求的次数,计算所述当前时间段的读取比率;
基于时间段划分规则并通过所述当前时间段的读取比率对所述当前时间段进行划分,以确定相应的时间区间。
可选的,所述基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染之前,还包括:
利用中央处理器在历史时间段内的各个时间点的负载情况,计算所述各个时间区间的当前中央处理器负载。
可选的,所述基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,包括:
基于每个所述时间区间的起始点的中央处理器负载的检查结果,判断每个所述时间区间的起始点的所述当前中央处理器负载与预设处理器负载区间的位置关系;
基于所述位置关系确定所述目标时间区间。
可选的,所述基于所述位置关系确定所述目标时间区间,包括:
若检查的时间区间的起始点的所述当前中央处理器负载位于所述预设处理器负载区间时,则将当前时间区间的起始点作为所述目标时间区间的起始点,并在所述目标时间区间的起始点启动服务器端渲染。
可选的,所述基于所述位置关系确定所述目标时间区间,包括:
若检查的时间区间的起始点的所述当前中央处理器负载不位于所述预设处理器负载区间时,则基于所述当前中央处理器负载选择前移/后移一个时间区间,确定出待检查时间区间;
将所述待检查时间区间确定为目标时间区间,并将所述待检查时间区间的起始点作为所述目标时间区间的起始点,并在所述目标时间区间的起始点启动服务器端渲染。
可选的,所述基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染过程中,还包括:
基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在当前时间段中的目标时间区间之前的时间区间启动客户端渲染。
第二方面,本申请公开了一种页面渲染装置,应用于服务器端,包括:
区间划分模块,用于在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间;
页面渲染模块,用于基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面;
页面反馈模块,用于将所述网页页面反馈至客户端,完成页面渲染。
第三方面,本申请公开了一种电子设备,包括:
存储器,用于保存计算机程序;
处理器,用于执行所述计算机程序,以实现前述公开的页面渲染方法的步骤。
第四方面,本申请公开了一种计算机可读存储介质,用于存储计算机程序;其中,所述计算机程序被处理器执行时实现前述公开的页面渲染方法的步骤。
可见,本申请公开了一种页面渲染方法,应用于服务器端,包括:在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间;基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面;将所述网页页面反馈至客户端,完成页面渲染。由此可见,通过客户端的使用资讯,自动指示服务器端渲染采用时间上的平移,让服务器端渲染不要集中在特定时间,减少服务器在尖峰时间的负载与工作量,或者是预判客户端要求的网页资料,事先通过服务器端渲染,提前准备好,通过本申请会自动学习客户端的操作偏好,自动改进服务器端渲染的时间点,不需要人工的干预,可以大幅减少额外的系统运维人力。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据提供的附图获得其他的附图。
图1为本申请公开的一种页面渲染方法流程图;
图2为本申请公开的一种具体的页面渲染方法流程图;
图3为本申请公开的一种根据资料分析服务器决定用CSR或SSR的方式渲染网页示意图;
图4为将SSR渲染的工作向后移动示意图;
图5为本申请公开的一种Request与CPU负载的示意图;
图6为本申请公开的一种具体的页面渲染方法流程图;
图7为本申请公开的一种页面渲染装置结构示意图;
图8为本申请公开的一种电子设备结构图。
具体实施方式
下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例,都属于本发明保护的范围。
在使用者使用网页内容服务时,如果采用客户端渲染CSR的技术,会先下载html,CSS,script,image图片,font字型档案这些网页资源档案后,才能开始渲染画面,当完成渲染网页画面后,才能使用这些网页资源所产生的网页服务。而下载这些网路资源所需的时间取决于网路的频宽。而完成整个网页的渲染与显示取决于script是否执行完毕。因为网页执行script时可能会再次跟服务器要求一些即时资料,当拿到这些即时资料,整个网页渲染动作才能完成。当script跟服务器要求即时资料,服务器端迟迟没有提供资料。那么整个网页的渲染时间,就会因为服务器端无法提供即时资料而大幅延长。如果要改善这种情况,可以用服务器端渲染SSR的方式,先将整个网页在服务器渲染完成。客户端的浏览器一拿到网页资料就可以直接显示资料。可以节省下script执行渲染后再跟服务器拿即时资料的时间。这样作的好处可以让搜寻引擎可以更容易搜索到网站的资料,改善SEO,增加网站的曝光度与排名。带来更多网站流量。因为script语言的渲染工作大多在服务器端执行完毕,客户端的浏览器不需要花大量的运算资源执行script。但由于SSR的网站大部分的script运算都在服务器端,渲染运算量都在服务器上。如果客户端的使用人数太多,就会造成服务器的运算量大幅增加。
现有技术中,一般的服务端渲染的流程,是客户端对服务器端提出网页request。而服务器端根据客户端的网页request,渲染网页后产生response。然后再将response回传给客户端。这边服务器端只能被动根据客户端的网页request,渲染网页后,才能产生response。
为此,本申请提供了一种页面渲染方案,能够选择服务器端预先渲染的时间点,避免服务器端运算量集中在小范围的时间点,让服务器端渲染服务更多数量的客户端,减少客户端的浏览器获取服务器端渲染网页的等待时间,直接获取服务器端渲染完成的网页的静态档案。
参照图1所示,本发明实施例公开了一种页面渲染方法,应用于服务器端,包括:
步骤S11:在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间。
本实施例中,在两次写入同一资料表的当前时间段内,可以理解的是,例如:在Request W1时刻与Request W2时刻分别写入同一个Database Table(资料表)到ReqeustAPI,然后记录下当前时间段内客户端有多少个Request Read次数,然后基于Request Read次数对当前时间段进行划分,以确定相应的时间区间,例如:假设Request W1到Request W2之间的Request Read有100次,累计达到25次就是25%的百分比,这时候就是第1时间区间,而累计达到50次就是50%的第2时间区间,剩下区间以此类推。这样可以如下表所示划分成4个时间区间。
表1:
步骤S12:基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面。
本实施例中,基于每个所述时间区间的起始点的中央处理器负载的检查结果,例如:参照表1所示,在Request W1与Request W2时间段之间分成了4个时间区间,然后,分别确定在第1时间区间、第2时间区间、第3时间区间、第4时间区间的每个时间区间的起始点的CPU负载的检查结果,然后基于所述检查结果选择一个时间区间作为目标时间区间,并且在目标时间区间的起始点启动SSR,以便通过所述服务器渲染产生相应的网页页面。
步骤S13:将所述网页页面反馈至客户端,完成页面渲染。
本实施例中,由于网页在服务端进行了SSR渲染,客户端只需要下载渲染完成的档案就可以显示网页。不用再从服务器下载所有的网页资源后,接着完成渲染网页动作,才能将网页显示出来。让渲染网页的相关的运算在服务器端执行。客户端的浏览器只要下载服务器端提供的静态档案,就可以直接显示网页了,本实施例通过分析读取网页资料的要求,自动划分执行SSR渲染的时间区间,更贴近使用者实际操作的行为,SSR服务器端渲染比起CSR客户渲染不用跟服务器要求多笔资料。只要要求一笔渲染好的网页资料就可以显示。节省下不少与服务器沟通往返的次数。因为客户端每当跟服务器要求资料的时候,服务器与客户端都会花额外的网路封包确认资料下载是否正确。如果客户端从服务器下载的档案比较多。这种要求档案,确认档案的行为会造成封包通讯的往返次数变得比较多。甚至整个网页渲染的速度,取决于下载最慢的那个档案。也就是说相对传输比较少档案资料的SSR渲染方法会比CSR渲染方法显示速度更快。因为从服务器端下载的档案较少,不容易受到网路频宽影响外,也不用在客户端花费额外的时间渲染网页才能将网页显示出来,所以SSR渲染可以节省这两部份的时间。
可见,本申请公开了一种页面渲染方法,应用于服务器端,包括:在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间;基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面;将所述网页页面反馈至客户端,完成页面渲染。由此可见,通过客户端的使用资讯,自动指示服务器端渲染采用时间上的平移,让服务器端渲染不要集中在特定时间,减少服务器在尖峰时间的负载与工作量,或者是预判客户端要求的网页资料,事先通过服务器端渲染,提前准备好,通过本申请会自动学习客户端的操作偏好,自动改进服务器端渲染的时间点,不需要人工的干预,可以大幅减少额外的系统运维人力。
参照图2所示,本发明实施例公开了一种具体的页面渲染方法,相对于上一实施例,本实施例对技术方案作了进一步的说明和优化。具体的:
步骤S21:在两次写入同一资料表的当前时间段内,基于历史时间段内客户端读取网页要求的次数计算所述历史时间段的读取比率以及所述客户端在所述当前时间段内读取网页要求的次数,计算所述当前时间段的读取比率;基于时间段划分规则并通过所述当前时间段的读取比率对所述当前时间段进行划分,以确定相应的时间区间。
本实施例中,在两个Request Write之间,会从历史资料中分析Reqeust W1与Reqeust W2之间有多少个Request Read次数,将Request Read的次数以百分比表示,并基于所述读取比率对所述当前时间段进行划分,以确定相应的时间区间。每当资料表被写入进来,就必须启动服务器端的SSR,藉此更新SSR渲染后的最新资料。一般是在Request比率W1之后立刻进行SSR的渲染动作。但是这样会造成运算量集中在极短的时间段内。例如:将两个Request Write之间的时间长度设置为待划分时间段,获取历史资料中的Reqeust W1与Reqeust W2时间段内的Request Read次数以及对应的时间,并计算在每一个划分的历史时间段内的Request Read比率,其中,Request Read比率计算公式为:Request Read比率=Request Read次数/出现Request Read次数的时间段,然后,当获取到当前时间段内的Request Read次数之后,根据历史资料中的Request Read比率计算在预设Request Read次数的条件下所对应的各自的时间划分区间,如:历史资料中,在两个Request Write之间的时间长度过程中出现了100次的Request Read次数,而发生到第25次的Request Read次数出现的时间段为0秒至5秒,出现第25次到第50次的Request Read次数的时间段为5秒到8秒,出现第50次到第75次的Request Read次数的时间段为8秒到12秒,出现第75次到第100次的Request Read次数的时间段为12秒到20秒,因此,可以分别计算出每个时间段的Request Read比率,也即,0秒至5秒的时间段的Request Read比率为25%,5秒至8秒的时间段的Request Read比率为25%,8秒至12秒的时间段的Request Read比率为25%,12秒至20秒的时间段的Request Read比率为25%,因此就可以将历史时间段按照Request Read比率以及出现的时间点进行时间段的划分,而根据历史资料来看,当前两次写入同一资料表的Reqeust API时,基于历史资料的信息,以及当前时间段的读取比率划分当前时间段,并确定相应的时间区间;根据上表1的资料分析,在Request W1发生后5秒内有读取ReadRequest的比率只有25%。而超出5秒有Read Request有75%。如果系统如果在5秒后才产生SSR的结果。就可以用SSR渲染的功能来加速75%的Read Request了。而在这5秒内的读取Request就用其他渲染方式来代替,例如:客户端渲染CSR(Client Side Render)。客户端渲染与服务器端渲染的差别在与CSR将html,css,image,script网页资源档案下载后,才执行网页的渲染然后产生网页。在执行script语言的时候,还可能向服务器要求资料。所以使用者等待的时间会比较久。而SSR渲染,因为在服务器端渲染完成,所以script发出读取的Read Request其实不会等待服务器端的资料回传。而是直接使用服务器端渲染完成的网页资料。向服务器发送Request只要检查有没有最新的资料。如果没有最新的资料,就可以使用原本已经下载好的SSR渲染网页资料。这样子可以节省下像服务器要求资料并下载资料的时间。
步骤S22:基于每个所述时间区间的起始点的中央处理器负载的检查结果,判断每个所述时间区间的起始点的所述中央处理器负载与预设处理器负载区间的位置关系;基于所述位置关系确定所述目标时间区间。
本实施例中,SSR渲染虽然可以让网页显示速度变得比较快,但所需的渲染运算资源集中服务器端,反而造成服务器的运算资源负担。常常导致服务器因为运算量过大而造成响应延迟。所以如图3、图4所示把SSR渲染的工作往后移动到服务器运算量较少的时候。就可以让服务器端的运算量不要集中在某一个时间区间。至于要将SSR渲染移动多少时间才能减少运算量集中在某一小段时间,可以按照以下方法决定SSR渲染要移动到那个时间区间才能避开运算量高峰期,让更多的Request Read要求可以使用SSR渲染来加速网页显示。如表1,先分析在两次Request Write之间,在每个时间段内有多少Request Read的比率。例如Request W1与Request W2之间在5秒内有25%的Read Request。在5秒之外有75%的Read Request。所以在5秒内完成SSR渲染后,可以让后面75%的Read Request可以用SSR加速网页的显示。而服务器的负载量可以由CPU Loading来区分。大于85%可以归类为高负载,低于35%可以归类为低负载,35%-85%之间为中度负载。判断每个所述时间区间的起始点的所述中央处理器负载与预设处理器负载区间的位置关系,选择合适的中央处理器负载的时刻确定所述目标时间区间。
本实施例中,基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染之前,还包括:利用中央处理器在历史时间段内的各个时间点的负载情况,计算所述各个时间区间的当前中央处理器负载。可以理解的是,利用中央处理器在各个时间段时间点的历史负载情况的资料,预测并计算当前的每个时间区间的中央处理器负载情况。
步骤S23:在所述目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面。
本实施例中,若检查的时间区间的起始点的所述当前中央处理器负载位于所述预设处理器负载区间时,则将当前时间区间的起始点作为所述目标时间区间的起始点,并在所述目标时间区间的起始点启动服务器端渲染;若检查的时间区间的起始点的所述当前中央处理器负载不位于所述预设处理器负载区间时,则基于所述当前中央处理器负载选择前移/后移一个时间区间,确定出待检查时间区间;将所述待检查时间区间确定为目标时间区间,并将所述待检查时间区间的起始点作为所述目标时间区间的起始点,并在所述目标时间区间的起始点启动服务器端渲染。可以理解的是,若检查的时间区间的起始点的所述当前中央处理器负载大于所述预设处理器负载区间时,则将后一个时间区间作为当前待检查的时间区间,直至检查到的时间区间的起始点的所述当前中央处理器负载位于所述预设处理器负载区间为止,则将当前时间区间的起始点作为所述目标时间区间的起始点,并在所述目标时间区间的起始点启动服务器端渲染;若检查的时间区间的起始点的所述当前中央处理器负载小于所述预设处理器负载区间时,则将前一个时间区间,作为当前待检查的时间区间,直至检查到的时间区间的起始点的所述当前中央处理器负载位于所述预设处理器负载区间为止,则将当前时间区间的起始点作为所述目标时间区间的起始点,并在所述目标时间区间的起始点启动服务器端渲染。根据图5与表2的SSR渲染周期例子,在两个Request Write的时间段内可以根据Request Read的累计比率分成4个时间区间。而时间区间的开头是CPU负载的检查点。0%-25%是第1个时间区间,而这个时间区间的开头是第一个CPU负载检查点。25%-50%是第2个时间区间,这个时间区间开头是第二个CPU负载检查点。当服务器收到第一个Request W1后,会在0%-25%这个时间点检查CPU的负载。然后按照表三的规则,如果CPU负载大于85%,在这个时间区间就不执行SSR渲染。然后将检查点移往下一个时间区间再做检查。如果CPU负载在35%-85%之间就执行SSR渲染,检查点维持在这个时间区间不再移动。而当CPU负载小于35%时,也会执行SSR渲染。但是会把检查点移往前一个时间区间,让下一次决定SSR渲染的行为周期可以提早一个时间区间做检查。而最后一个CPU负载检查点是在时间区间75%-100%开头这个检查点,因为这是最后一个检查点,就算CPU负载大于85%也不会将检查点往后移动。而整个SSR渲染周期时间区间,可以由过往的Request W1运行的历史资料得知,并计算出时间区间的百分比与对应CPU负载检查点,表2如下所示:
是否执行SSR渲染 | CPU负载检查点前移或后移 | |
CPU负载大于85% | 否 | 检查点后移一个时间区间 |
CPU负载在35%-85%之间 | 是 | 检查点所在时间区间不变 |
CPU负载小于35% | 是 | 检查点前移一个时间区间 |
步骤S24:将所述网页页面反馈至客户端,完成页面渲染。
其中,步骤S24中更加详细的处理过程请参照前述公开的实施例,在此不再进行赘述。
由此可见,本实施例通过调整SSR的时间点,可以让服务器运算不会集中在同一个时间点,达到分散运算负载的效果,通过分析服务器负载的历史数据,自动计算出SSR渲染最佳时间点,每次SSR渲染的时间点都由之前使用者的对服务器的要求数据得来,随着使用者的操作而变化。更能贴近使用者的使用行为。
参照图6所示,本发明实施例公开了一种具体的页面渲染方法,相对于上一实施例,本实施例对技术方案作了进一步的说明和优化。具体的:
步骤S31:在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间。
其中,步骤S31中更加详细的处理过程请参照前述公开的实施例,在此不再进行赘述。
步骤S32:基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在当前时间段中的目标时间区间之前的时间区间启动客户端渲染。
本实施例中,参照上述表1,基于中央处理器负载的检查结果,若5秒之后选择进行SSR渲染页面的渲染方式,那么则需要在前面5秒内的Read Request由CSR的方式产生网页页面。让客户端自行下载网页资源档案并且在客户端进行网页的渲染。等到5秒过后,服务器端已经将SSR服务器端渲染执行完毕并产生相对应的网页。这时候客户端发出的request直接拿SSR渲染的完毕的网页就好。就不用在客户端再渲染一次。可以加速网页的显示。参照图2所示,在Request W1之后,就开始在服务器端进行SSR的渲染工作。但是Request R1由客户端向服务器端要求网页资料时。因为服务器端渲染SSR还未完成,所以会先使用客户端渲染产生网页。而到了Request R2的时候,因为服务器端渲染SSR已经完成。所以服务器端就可以直接回应SSR资料。向客户端发送网页资源档案,以便所述客户端利用所述网页资源档案在在当前时间段中的目标时间区间之前的时间区间启动客户端渲染。需要注意的是,还可以增加不同SSR的判断条件,让机器能纪录判断条件所优化网页渲染的速度。让开发人员第一时间选择较佳的优化对策,根据经常优化的对策。也可以设计成自动优化的程序,以减少开发人员人力的负担。
步骤S33:将所述客户端渲染完成的页面显示在浏览器页面上,以便用户使用。
本实施例中,为满足用户的需求,可以选择客户端自行从服务器中下载相应的资料,并在客户端进行CSR,然后将渲染完成的网页页面提供给用户使用。
由此可见,本实施例提供一种自动切换SSR渲染与CSR的方法,让服务器可以根据自身的负载状况自动选择SSR或CSR渲染网页的方法。可以兼具SSR渲染的网页显示速度。并在适当时机使用CSR渲染分散运算负载到客户端。
参照图7所示,本发明实施例公开了一种具体的页面渲染装置,应用于服务器端,包括:
区间划分模块11,用于在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间;
页面渲染模块12,用于基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面;
页面反馈模块13,用于将所述网页页面反馈至客户端,完成页面渲染。
可见,本申请公开了一种页面渲染方法,应用于服务器端,包括:在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间;基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面;将所述网页页面反馈至客户端,完成页面渲染。由此可见,通过客户端的使用资讯,自动指示服务器端渲染采用时间上的平移,让服务器端渲染不要集中在特定时间,减少服务器在尖峰时间的负载与工作量,或者是预判客户端要求的网页资料,事先通过服务器端渲染,提前准备好,通过本申请会自动学习客户端的操作偏好,自动改进服务器端渲染的时间点,不需要人工的干预,可以大幅减少额外的系统运维人力。
进一步的,本申请实施例还公开了一种电子设备,图8是根据一示例性实施例示出的电子设备20结构图,图中的内容不能认为是对本申请的使用范围的任何限制。
图8为本申请实施例提供的一种电子设备20的结构示意图。该电子设备20,具体可以包括:至少一个处理器21、至少一个存储器22、电源23、通信接口24、输入输出接口25和通信总线26。其中,所述存储器22用于存储计算机程序,所述计算机程序由所述处理器21加载并执行,以实现前述任一实施例公开的页面渲染方法中的相关步骤。另外,本实施例中的电子设备20具体可以为电子计算机。
本实施例中,电源23用于为电子设备20上的各硬件设备提供工作电压;通信接口24能够为电子设备20创建与外界设备之间的数据传输通道,其所遵循的通信协议是能够适用于本申请技术方案的任意通信协议,在此不对其进行具体限定;输入输出接口25,用于获取外界输入数据或向外界输出数据,其具体的接口类型可以根据具体应用需要进行选取,在此不进行具体限定。
其中,处理器21可以包括一个或多个处理核心,比如4核心处理器、8核心处理器等。处理器21可以采用DSP(Digital Signal Processing,数字信号处理)、FPGA(Field-Programmable Gate Array,现场可编程门阵列)、PLA(Programmable Logic Array,可编程逻辑阵列)中的至少一种硬件形式来实现。处理器21也可以包括主处理器和协处理器,主处理器是用于对在唤醒状态下的数据进行处理的处理器,也称CPU(Central ProcessingUnit,中央处理器);协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。在一些实施例中,处理器21可以在集成有GPU(Graphics Processing Unit,图像处理器),GPU用于负责显示屏所需要显示的内容的渲染和绘制。一些实施例中,处理器21还可以包括AI(Artificial Intelligence,人工智能)处理器,该AI处理器用于处理有关机器学习的计算操作。
另外,存储器22作为资源存储的载体,可以是只读存储器、随机存储器、磁盘或者光盘等,其上所存储的资源可以包括操作系统221、计算机程序222等,存储方式可以是短暂存储或者永久存储。
其中,操作系统221用于管理与控制电子设备20上的各硬件设备以及计算机程序222,以实现处理器21对存储器22中海量数据223的运算与处理,其可以是Windows Server、Netware、Unix、Linux等。计算机程序222除了包括能够用于完成前述任一实施例公开的由电子设备20执行的页面渲染方法的计算机程序之外,还可以进一步包括能够用于完成其他特定工作的计算机程序。数据223除了可以包括电子设备接收到的由外部设备传输进来的数据,也可以包括由自身输入输出接口25采集到的数据等。
进一步的,本申请还公开了一种计算机可读存储介质,用于存储计算机程序;其中,所述计算机程序被处理器执行时实现前述公开的页面渲染方法。关于该方法的具体步骤可以参考前述实施例中公开的相应内容,在此不再进行赘述。
本说明书中各个实施例采用递进的方式描述,每个实施例重点说明的都是与其它实施例的不同之处,各个实施例之间相同或相似部分互相参见即可。对于实施例公开的装置而言,由于其与实施例公开的方法相对应,所以描述的比较简单,相关之处参见方法部分说明即可。
专业人员还可以进一步意识到,结合本文中所公开的实施例描述的各示例的单元及算法步骤,能够以电子硬件、计算机软件或者二者的结合来实现,为了清楚地说明硬件和软件的可互换性,在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行,取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能,但是这种实现不应认为超出本申请的范围。结合本文中所公开的实施例描述的方法或算法的步骤可以直接用硬件、处理器执行的软件模块,或者二者的结合来实施。软件模块可以置于随机存储器(RAM)、内存、只读存储器(ROM)、电可编程ROM、电可擦除可编程ROM、寄存器、硬盘、可移动磁盘、CD-ROM、或技术领域内所公知的任意其它形式的存储介质中。
最后,还需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。
以上对本发明所提供的一种页面渲染方法、装置、设备、存储介质进行了详细介绍,本文中应用了具体个例对本发明的原理及实施方式进行了阐述,以上实施例的说明只是用于帮助理解本发明的方法及其核心思想;同时,对于本领域的一般技术人员,依据本发明的思想,在具体实施方式及应用范围上均会有改变之处,综上所述,本说明书内容不应理解为对本发明的限制。
Claims (9)
1.一种页面渲染方法,其特征在于,包括:
在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间;
基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面;
将所述网页页面反馈至客户端,完成页面渲染;
所述基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间,包括:
基于历史时间段内客户端读取网页要求的次数计算所述历史时间段的读取比率以及所述客户端在所述当前时间段内读取网页要求的次数,计算所述当前时间段的读取比率;
基于时间段划分规则并通过所述当前时间段的读取比率对所述当前时间段进行划分,以确定相应的时间区间。
2.根据权利要求1所述的页面渲染方法,其特征在于,所述基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染之前,还包括:
利用中央处理器在历史时间段内的各个时间点的负载情况,计算所述各个时间区间的当前中央处理器负载。
3.根据权利要求2所述的页面渲染方法,其特征在于,所述基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,包括:
基于每个所述时间区间的起始点的所述中央处理器负载的检查结果,判断每个所述时间区间的起始点的所述当前中央处理器负载与预设处理器负载区间的位置关系;
基于所述位置关系确定所述目标时间区间。
4.根据权利要求3所述的页面渲染方法,其特征在于,所述基于所述位置关系确定所述目标时间区间,包括:
若检查的时间区间的起始点的所述当前中央处理器负载位于所述预设处理器负载区间时,则将当前时间区间的起始点作为所述目标时间区间的起始点,并在所述目标时间区间的起始点启动服务器端渲染。
5.根据权利要求3所述的页面渲染方法,其特征在于,所述基于所述位置关系确定所述目标时间区间,包括:
若检查的时间区间的起始点的所述当前中央处理器负载不位于所述预设处理器负载区间时,则基于所述当前中央处理器负载选择前移/后移一个时间区间,确定出待检查时间区间;
将所述待检查时间区间确定为目标时间区间,并将所述待检查时间区间的起始点作为所述目标时间区间的起始点,并在所述目标时间区间的起始点启动服务器端渲染。
6.根据权利要求1至5任一项所述的页面渲染方法,其特征在于,所述基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染过程中,还包括:
基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在当前时间段中的目标时间区间之前的时间区间启动客户端渲染。
7.一种页面渲染装置,其特征在于,应用于服务器端,包括:
区间划分模块,用于在两次写入同一资料表的当前时间段内,基于客户端在所述当前时间段内读取网页要求的次数对所述当前时间段进行划分,以确定相应的时间区间;
页面渲染模块,用于基于每个所述时间区间的起始点的中央处理器负载的检查结果,并在目标时间区间的起始点启动服务器端渲染,以便通过所述服务器渲染产生相应的网页页面;
页面反馈模块,用于将所述网页页面反馈至客户端,完成页面渲染;
所述区间划分模块,具体用于基于历史时间段内客户端读取网页要求的次数计算所述历史时间段的读取比率以及所述客户端在所述当前时间段内读取网页要求的次数,计算所述当前时间段的读取比率;基于时间段划分规则并通过所述当前时间段的读取比率对所述当前时间段进行划分,以确定相应的时间区间。
8.一种电子设备,其特征在于,包括:
存储器,用于保存计算机程序;
处理器,用于执行所述计算机程序,以实现如权利要求1至6任一项所述的页面渲染方法的步骤。
9.一种计算机可读存储介质,其特征在于,用于存储计算机程序;其中,所述计算机程序被处理器执行时实现如权利要求1至6任一项所述的页面渲染方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210893187.7A CN115186216B (zh) | 2022-07-27 | 2022-07-27 | 一种页面渲染方法、装置、设备、存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210893187.7A CN115186216B (zh) | 2022-07-27 | 2022-07-27 | 一种页面渲染方法、装置、设备、存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN115186216A CN115186216A (zh) | 2022-10-14 |
CN115186216B true CN115186216B (zh) | 2024-02-09 |
Family
ID=83522071
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202210893187.7A Active CN115186216B (zh) | 2022-07-27 | 2022-07-27 | 一种页面渲染方法、装置、设备、存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN115186216B (zh) |
Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN112230923A (zh) * | 2020-11-05 | 2021-01-15 | Oppo广东移动通信有限公司 | 用户界面渲染方法、用户界面渲染装置及服务器 |
CN112749358A (zh) * | 2021-01-13 | 2021-05-04 | 中国工商银行股份有限公司 | 页面渲染方法和装置、电子设备以及存储介质 |
-
2022
- 2022-07-27 CN CN202210893187.7A patent/CN115186216B/zh active Active
Patent Citations (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN112230923A (zh) * | 2020-11-05 | 2021-01-15 | Oppo广东移动通信有限公司 | 用户界面渲染方法、用户界面渲染装置及服务器 |
CN112749358A (zh) * | 2021-01-13 | 2021-05-04 | 中国工商银行股份有限公司 | 页面渲染方法和装置、电子设备以及存储介质 |
Also Published As
Publication number | Publication date |
---|---|
CN115186216A (zh) | 2022-10-14 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US8078691B2 (en) | Web page load time prediction and simulation | |
US20090119302A1 (en) | Asynchronous client to server updates | |
EP3731499A1 (en) | Optimizing user interface data caching for future actions | |
US8291078B2 (en) | Multi-process browser architecture | |
CN109213948B (zh) | 网页加载方法、中间服务器和网页加载系统 | |
US8516041B1 (en) | Pre-fetching asynchronously requested content | |
CN106682176A (zh) | 页面的加载方法、装置和设备 | |
WO2017107570A1 (zh) | 一种基于HTML5应用缓存的移动Web缓存优化方法 | |
US20160217116A1 (en) | Online content management system with undo and redo operations | |
US8375383B2 (en) | Rolling upgrades in distributed applications | |
US11537789B2 (en) | Systems and methods for seamless application of autocorrection and provision of review insights through adapted user interface | |
US10417317B2 (en) | Web page profiler | |
CN103152367A (zh) | 一种缓存的动态维护更新方法及系统 | |
JP5847361B2 (ja) | 動的情報を取得する方法及び装置 | |
US20150200832A1 (en) | Adaptive Document Autosaving Rate Based on Different Conditions | |
US10733044B2 (en) | Use of cache for content validation and error remediation | |
US20160182673A1 (en) | Dynamic cache injector | |
CN111782692A (zh) | 一种频率控制方法及装置 | |
US11556560B2 (en) | Intelligent management of a synchronization interval for data of an application or service | |
CN103716319A (zh) | 一种Web访问优化的装置和方法 | |
CN103684823A (zh) | 网络日志记录方法、网络访问路径确定方法及相关装置 | |
CN115186216B (zh) | 一种页面渲染方法、装置、设备、存储介质 | |
US8402367B1 (en) | Smart reload pages | |
US20150326501A1 (en) | Container contract for data dependencies | |
CN110704777A (zh) | 用于实现灰度发布的方法和系统 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |