CN114547495B - 一种页面加载方法、装置、设备及可读存储介质 - Google Patents
一种页面加载方法、装置、设备及可读存储介质 Download PDFInfo
- Publication number
- CN114547495B CN114547495B CN202210096006.8A CN202210096006A CN114547495B CN 114547495 B CN114547495 B CN 114547495B CN 202210096006 A CN202210096006 A CN 202210096006A CN 114547495 B CN114547495 B CN 114547495B
- Authority
- CN
- China
- Prior art keywords
- data
- page
- displayed
- area
- current
- 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
Images
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/955—Retrieval from the web using information identifiers, e.g. uniform resource locators [URL]
- G06F16/9566—URL specific, e.g. using aliases, detecting broken or misspelled links
-
- 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/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9574—Browsing optimisation, e.g. caching or content distillation of access to content, e.g. by caching
-
- 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
-
- 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)
- User Interface Of Digital Computer (AREA)
Abstract
本申请公开了一种页面加载方法、装置、设备及可读存储介质,该方法包括:响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,当前页面包括顺序排布的多个区域;通过第一数据接口获取第一待显示数据;将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据。通过实施本申请,从而在用户每次想要显示当前页面时,可以只获取浏览终端当前显示区域需要显示的页面数据,即第一区域的第一待显示数据,并只对第一待显示数据进行渲染并显示,从而可以避免需要一次性获取大量数据并将其进行渲染而耗费大量时间造成页面加载时间长的问题,可以减少客户端的性能消耗,提高用户体验。
Description
技术领域
本申请涉及信息技术领域,尤其涉及一种页面加载方法、装置、设备及可读存储介质。
背景技术
一般浏览终端进行页面加载的过程是:当接收到用户提交的URL(Uniform/Universal Resource Locator,统一资源定位符,也被称为网页地址)请求时(例如,用户在浏览终端的地址栏输入网址),向相应服务器请求页面数据,并将请求到的页面数据下载到浏览终端客户端,然后调用页面渲染装置对该页面数据进行渲染,通过浏览终端窗口展示经渲染处理后的页面。在现有技术中,在浏览终端初始化时会生成遍历请求,即根据所述遍历请求从服务器上获取全部待显示数据,并将所述全部待显示数据渲染成页面,然后通过浏览终端窗口尺寸或者是页面之间的层级,进行对应的页面展示。若待显示数据的数据量过大时,不仅需要反复进行遍历数据操作,而且需要耗费大量时间进行渲染操作,增加了浏览终端的耗能。
发明内容
有鉴于此,本申请实施例通过提供一种页面加载方法、装置、设备及可读存储介质,用以解决现有技术中需要一次性获取大量数据并将其进行渲染的问题。
为了解决上述问题,第一方面,本申请实施例提供了一种页面加载方法,包括:响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,当前页面包括顺序排布的多个区域;通过第一数据接口获取第一待显示数据;将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据。
可选地,页面加载方法还包括:对当前页面的页面滚动事件进行监听;在监听到了页面滚动事件的情况下,确定当前页面滚动的第一距离;在根据第一距离确定当前页面由第一区域滚动至包括至少部分第二区域的情况下,获取当前页面的第二区域对应的第二数据接口;通过第二数据接口获取第二待显示数据;根据第一距离,在第一待显示数据和第二待显示数据中获取对应的第一目标显示数据;将第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的第一目标显示数据。
可选地,页面加载方法还包括:在确定第二数据接口为当前页面的最后一个区域的数据接口的情况下,停止对当前页面的页面滚动事件进行监听。
可选地,根据第一距离确定当前页面由第一区域滚动至包括至少部分第二区域,包括:在确定第一距离大于阈值的情况下,确定当前页面由第一区域滚动至包括至少部分第二区域。
可选地,根据第一距离,在第一待显示数据和第二待显示数据中获取对应的第一目标显示数据,包括:根据第一距离确定当前显示区域中的当前页面对应的坐标数据;从第一待显示数据和第二待显示数据中获取与坐标数据对应的显示数据,作为第一目标显示数据。
可选地,在将第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的第一目标显示数据之后,页面加载方法还包括:在监听到了页面滚动事件的情况下,确定当前页面滚动的第二距离;在根据第二距离确定当前页面未滚动至新的区域的情况下,根据第二距离,在第一待显示数据和第二待显示数据中获取对应的第二目标显示数据;将第二目标显示数据进行渲染,并在当前显示区域中显示渲染后的第二目标显示数据。
可选地,通过第一数据接口获取第一待显示数据,包括:通过第一数据接口从服务器中获取第一待显示数据。
第二方面,本申请实施例提供了一种页面加载装置,包括:第一获取单元,用于响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,当前页面包括顺序排布的多个区域;第二获取单元,用于通过第一数据接口获取第一待显示数据;显示单元,用于将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据。
第三方面,本申请实施例提供了一种电子设备,包括:至少一个处理器;以及与至少一个处理器通信连接的存储器;其中,存储器存储有可被至少一个处理器执行的指令,指令被至少一个处理器执行,以使至少一个处理器执行如第一方面或第一方面任意实施方式中的页面加载方法。
第四方面,本申请实施例提供了一种计算机可读存储介质,计算机可读存储介质存储有计算机指令,计算机指令用于使计算机执行如第一方面或第一方面任意实施方式中的页面加载方法。
本申请实施例提供的页面加载方法、装置、设备及可读存储介质,通过响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,当前页面包括顺序排布的多个区域;通过第一数据接口获取第一待显示数据;将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据,从而在用户每次想要显示当前页面时,可以只获取浏览终端当前显示区域需要显示的页面数据,即第一区域的第一待显示数据,并只对第一待显示数据进行渲染并显示,从而可以避免需要一次性获取大量数据并将其进行渲染而耗费大量时间造成页面加载时间长的问题,可以减少客户端的性能消耗,提高用户体验。
上述说明仅是本申请技术方案的概述,为了能够更清楚了解本申请的技术手段,而可依照说明书的内容予以实施,并且为了让本申请的上述和其它目的、特征和优点能够更明显易懂,以下特举本申请的具体实施方式。
附图说明
图1为本申请实施例中一种页面加载方法的流程示意图;
图2为本申请实施例中一种页面加载装置的结构示意图;
图3为本申请实施例中一种电子设备的硬件结构示意图。
具体实施方式
为使本申请实施例的目的、技术方案和优点更加清楚,下面将结合本申请实施例中的附图,对本申请实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例是本申请一部分实施例,而不是全部的实施例。基于本申请中的实施例,本领域技术人员在没有作出创造性劳动前提下所获得的所有其他实施例,都属于本申请保护的范围。
浏览终端是指可以显示网页服务器或者文件系统的HTML(Hyper Text Mark-upLanguage,超文本标记语言或超文本链接标示语言)文件内容,并让用户与这些文件交互的一种软件工具。浏览终端是访问互联网最常用的工具。随着互联网技术的飞速发展,浏览终端在人们的日常生活、工作和学习中的应用已经越来越频繁。一般浏览终端进行页面加载的过程是:当接收到用户提交的URL请求时(例如,用户在浏览终端的地址栏输入网址),向相应服务器请求页面数据,并将请求到的页面数据下载到浏览终端客户端,然后调用页面渲染装置对该页面数据进行渲染,通过浏览终端窗口展示经渲染处理后的页面。在现有技术中,在浏览终端初始化时会生成遍历请求,即根据所述遍历请求从服务器上获取全部待显示数据,并将所述全部待显示数据渲染成页面,然后通过浏览终端窗口尺寸或者是页面之间的层级,进行对应的页面展示。若待显示数据的数据量过大时,不仅需要反复进行遍历数据操作,而且需要耗费大量时间进行渲染操作,增加了浏览终端的耗能。
本实施例中,为了解决现有数据加载技术中需要一次性获取大量数据并将其进行渲染的技术问题,本申请实施例提供一种页面加载方法,尤其可优化长页面的数据加载方案。页面加载方法具体包括:
S101.响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,当前页面包括顺序排布的多个区域。
在本申请实施例中,当前页面可以是首页,也可以是首页之后的第i页,i≥2。在用户打开APP,或者是打开浏览终端,以及在浏览终端中输入目标网址或者目标关键字等操作,均可触发首页的显示指令。在用户向后翻页过程中,可触发第i页的显示指令。
本申请实施例中,当前页面为长页面,也即需要页面向下或向右滚动,变更浏览终端的显示区域才能浏览完整的页面数据。当前页面设计时,被分成了顺序排布的多个区域。多个区域包括顺序排布的第一区域、第二区域、第三区域……。多个区域排布时,可采用纵向向下依次排布的顺序,也可以采用横向向右依次排布的顺序。每个区域设置有对应数据接口,数据接口用于获取数据。
如果当前页面很长,受限于屏幕的高度,则一般地,在显示当前页面时,只能显示当前页面的第一区域,第一区域为当前页面的首个区域,也即打开当前页面在当前显示区域能够看到的区域,当前显示区域为当前可视区域,则浏览终端在接收到当前页面的显示指令时,可以只获取当前页面的第一显示区域对应的第一数据接口。
例如,在某个系统的首页有大量的图表数据,这些数据可由8个数据接口请求获得。首页采用纵向向下依次排列的布局方式,受限于屏幕高度,用户打开首页时,默认只能看到首页上半部分的4个接口的图表数据,剩下下半部分的4个接口的图表数据,需要页面向下滚动变更显示区域才能进行浏览。因此,在设计首页时,可将首页分成第一区域和第二区域,第一区域对应首页的上半部分,第二区域对应首页的下半部分。并设置好第一区域对应的第一数据接口(上半部分对应的4个接口)和第二区域对应的第二数据接口(下半部分对应的4个接口)。从而当用户打开浏览终端显示该系统的首页时,浏览终端可以获取到首页的第一区域对应的第一数据接口。
S102.通过第一数据接口获取第一待显示数据。
在本申请实施例中,浏览终端可以通过该数据接口可以从服务器、缓存或内存等中获取第一待显示数据。在一个具体地实施方式中,可通过第一数据接口从服务器中获取第一待显示数据。服务器包括云服务器、物理服务器或其结合。通过将第一待显示数据存储在服务器中,并通过第一数据接口从服务器中获取第一待显示数据,可以实现第一待显示数据的共享,从而可以满足多个用户对第一待显示数据的显示需求。
S103.将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据。
本申请实施例提供的页面加载方法,通过响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,当前页面包括顺序排布的多个区域;通过第一数据接口获取第一待显示数据;将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据,从而在用户每次想要显示当前页面时,可以只获取浏览终端当前显示区域需要显示的页面数据,即第一区域的第一待显示数据,并只对第一待显示数据进行渲染并显示,从而可以避免需要一次性获取大量数据并将其进行渲染而耗费大量时间造成页面加载时间长的问题,可以减少客户端的性能消耗,提高用户体验。
在一个可选的实施例中,页面加载方法还包括:对当前页面的页面滚动事件进行监听;在监听到了页面滚动事件的情况下,确定当前页面滚动的第一距离;在根据第一距离确定当前页面由第一区域滚动至包括至少部分第二区域的情况下,获取当前页面的第二区域对应的第二数据接口;通过第二数据接口获取第二待显示数据;根据第一距离,在第一待显示数据和第二待显示数据中获取对应的第一目标显示数据;将第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的第一目标显示数据。
具体地,在进入当前页面之后,可以在当前页面添加一个页面滚动监听事件,用于对当前页面的页面滚动事件进行监听。当用户在当前页面进行了页面滚动的操作,则可以监听到页面滚动事件,则可以认为用户有浏览当前页面的第二区域的需要,此时可以根据页面监听事件反馈的信息,确定当前页面滚动的第一距离。从而根据第一距离确定当前显示区域中的当前页面的区域是否产生了变化,是否由第一区域滚动到了第二区域。
如果当前页面由第一区域滚动至包括至少部分第二区域,例如用户滚动鼠标,使得当前页面向下滚动了一行,且当前显示区域中包括当前页面的第二区域的一行,则可以获取当前页面的第二区域对应的第二数据接口,通过第二数据接口从服务器、缓存或内存等中获取第二待显示数据。然后再根据第一距离从第一待显示数据和第二待显示数据中获取对应的第一目标显示数据,将第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的第一目标显示数据。
例如,在某个系统的首页有大量的图表数据,这些数据可由8个数据接口请求获得。首页采用纵向向下依次排列的布局方式,并设计首页分成纵向依次排布的第一区域和第二区域,第一区域对应4个数据接口,第二区域对应的4个数据接口。当用户打开浏览终端显示该系统的首页时,浏览终端可以获取到首页的第一区域对应的4个数据接口,然后通过该4个数据接口获取第一待显示数据,将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据。当用户滚动鼠标,使得当前页面向下滚动了一行或几行,则当前显示区域将显示第一区域的部分内容和第二区域的部分内容,则可以获取当前页面的第二区域对应的4个数据接口,通过该4个数据接口从服务器、缓存或内存等中获取第二待显示数据。然后再通过当前页面滚动的第一距离,在第一待显示数据和第二待显示数据中确定当前显示区域中第一区域和第二区域的第一目标显示数据,然后将第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的第一目标显示数据。
在本申请实施例中,可以根据实际需要将当前页面分成多个区域,并通过对当前页面的页面滚动事件进行监听,从而可以在当前显示区域中显示的当前页面的区域发生变化时,再获取变化的区域的待显示数据,并从中获取目标显示数据进行渲染和显示,可以保证用户对当前页面的不同区域的显示需求,且可以避免需要一次性获取大量数据并将其进行渲染而耗费大量时间造成页面加载时间长的问题,可以减少客户端的性能消耗,提高用户体验。
在一个可选的实施方式中,根据第一距离确定当前页面由第一区域滚动至包括至少部分第二区域,包括:在确定第一距离大于阈值的情况下,确定当前页面由第一区域滚动至包括至少部分第二区域。
具体地,当第一距离大于阈值,说明为有效滚动,由于当前显示区域显示的是整个第一区域,因此,当用户滚动当前页面并为有效滚动时,可以确定当前页面由第一区域滚动至包括至少部分第二区域,则可以获取第二区域对应的第二数据接口,通过第二数据接口获取第二待显示数据。当第一距离小于阈值,说明为无效滚动,由于当前显示区域显示的是整个第一区域,因此,当用户滚动当前页面并为无效滚动时,可以确定当前页面保持在第一区域,则不需要获取第二区域的第二待显示数据。
在本申请实施例中,由于当前显示区域显示的是整个第一区域,当第一距离大于阈值,说明为有效滚动,从而当用户滚动当前页面并为有效滚动时,可以快速、准确地确定当前页面由第一区域滚动至包括至少部分第二区域。
在一个可选的实施方式中,根据第一距离,在第一待显示数据和第二待显示数据中获取对应的第一目标显示数据,包括:根据第一距离确定当前显示区域中的当前页面对应的坐标数据;从第一待显示数据和第二待显示数据中获取与坐标数据对应的显示数据,作为第一目标显示数据。
具体地,当前页面设计时,第一区域对应有第一尺寸,例如(0,0)至(1000,1000),第二区域对应有第二尺寸,例如(1001,0)至(2000,1000),因此,当前显示区域仅显示第一区域的内容时,当前显示区域的当前显示页面的左上角的坐标数据为(0,0),右下角的坐标数据为(1000,1000),如果用户向下滚动当前页面后,且当前页面向下滚动了200个像素点,则当前显示区域的当前显示页面的左上角的坐标数据为(200,0),右下角的坐标数据为(1200,1000)。
则可以从第一待显示数据中获取坐标数据为(200,0)至(1000,1000)的显示数据,从第二待显示数据中获取坐标数据为(1001,0)至(1200,1000)显示数据,作为第一目标显示数据。
在本申请实施例中,由于页面不同区域对应有坐标数据,因此,确定了第一距离,就可以确定当前显示区域中的当前页面对应的坐标数据,从而准确获取到对应的第一目标显示数据。
在一个可选的实施例中,页面加载方法还包括:在确定第二数据接口为当前页面的最后一个区域的数据接口的情况下,停止对当前页面的页面滚动事件进行监听。
具体地,如果当前页面分为2个区域,则第二数据接口为当前页面的最后一个区域的数据接口,则在获取第二数据接口之后,就可以停止对当前页面的页面滚动事件进行监听,从而减少浏览终端的耗能,提高页面加载的速度,提高用户体验。如果当前页面分为3个区域,则在获取到第三区域对应的第三数据接口之后,就可以停止对当前页面的页面滚动事件进行监听,从而不用使得页面滚动事件的监听一直保存在页面加载的整个生命周期中,可以避免性能的浪费。
在一个可选的实施例中,在将第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的第一目标显示数据之后,页面加载方法还包括:在监听到了页面滚动事件的情况下,确定当前页面滚动的第二距离;在根据第二距离确定当前页面未滚动至新的区域的情况下,根据第二距离,在第一待显示数据和第二待显示数据中获取对应的第二目标显示数据;将第二目标显示数据进行渲染,并在当前显示区域中显示渲染后的第二目标显示数据。
具体地,如果当前页面至少分为3个区域,则在获取到第二数据接口之后,不会立即停止对当前页面的页面滚动事件进行监听。如果再次监听到了页面滚动事件,可以确定当前页面滚动的第二距离。根据第二距离可以确定当前页面是否已经滚动到第三区域,如果当前显示区域中仍然是当前页面的第一区域和第二区域的组合,或完全是第二区域,则不用获取第三区域对应的第三待显示数据,可以根据第二距离,在第一待显示数据和第二待显示数据中获取对应的第二目标显示数据,将第二目标显示数据进行渲染,并在当前显示区域中显示渲染后的第二目标显示数据,从而减少不必要的数据接口请求。
本申请实施例还提供了一种页面加载装置,如图2所示,包括:
第一获取单元21,用于响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,当前页面包括顺序排布的多个区域;具体实施方式详见上述方法实施例步骤S101的描述,在此不再赘述。
第二获取单元22,用于通过第一数据接口获取第一待显示数据;具体实施方式详见上述方法实施例步骤S102的描述,在此不再赘述。
显示单元23,用于将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据。具体实施方式详见上述方法实施例步骤S103的描述,在此不再赘述。
本申请实施例提供的页面加载装置,通过响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,当前页面包括顺序排布的多个区域;通过第一数据接口获取第一待显示数据;将第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据,从而在用户每次想要显示当前页面时,可以只获取浏览终端当前显示区域需要显示的页面数据,即第一区域的第一待显示数据,并只对第一待显示数据进行渲染并显示,从而可以避免需要一次性获取大量数据并将其进行渲染而耗费大量时间造成页面加载时间长的问题,可以减少客户端的性能消耗,提高用户体验。
基于与前述实施例中一种页面加载方法同样的发明构思,本申请实施例还提供一种电子设备,如图3所示,包括:处理器31和存储器32,其中处理器31和存储器32可以通过总线或者其他方式连接,图3中以通过总线连接为例进行说明。
处理器31可以为中央处理器(Central Processing Unit,CPU)。处理器31还可以为其他通用处理器、数字信号处理器(Digital Signal Processor,DSP)、专用集成电路(Application Specific Integrated Circuit,ASIC)、现场可编程门阵列(Field-Programmable Gate Array,FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等芯片,或者上述各类芯片的组合。
存储器32作为一种非暂态计算机可读存储介质,可用于存储非暂态软件程序、非暂态计算机可执行程序以及模块,如本申请实施例中的页面加载方法对应的程序指令/模块。处理器31通过运行存储在存储器32中的非暂态软件程序、指令以及模块,从而执行处理器的各种功能应用以及数据处理,即实现上述方法实施例中的页面加载方法。
存储器32可以包括存储程序区和存储数据区,其中,存储程序区可存储操作系统、至少一个功能所需要的应用程序;存储数据区可存储处理器31所创建的数据等。此外,存储器32可以包括高速随机存取存储器,还可以包括非暂态存储器,例如至少一个磁盘存储器件、闪存器件、或其他非暂态固态存储器件。在一些实施例中,存储器32可选包括相对于处理器31远程设置的存储器,这些远程存储器可以通过网络连接至处理器31。上述网络的实例包括但不限于互联网、企业内部网、局域网、移动通信网及其组合。
上述的一个或者多个模块存储在存储器32中,当被处理器31执行时,执行如图1所示实施例中的页面加载方法。
上述电子设备具体细节可以对应参阅图1所示的实施例中对应的相关描述和效果进行理解,此处不再赘述。
本领域技术人员可以理解,实现上述实施例方法中的全部或部分流程,是可以通过计算机程序来指令相关的硬件来完成,所述的程序可存储于一计算机可读取存储介质中,该程序在执行时,可包括如上述各方法的实施例的流程。其中,所述存储介质可为磁碟、光盘、只读存储记忆体(Read-Only Memory,ROM)、随机存储记忆体(Random AccessMemory,RAM)、快闪存储器(Flash Memory)、硬盘(Hard Disk Drive,缩写:HDD)或固态硬盘(Solid-State Drive,SSD)等;所述存储介质还可以包括上述种类的存储器的组合。
本领域内的技术人员应明白,本申请的实施例可提供为方法、系统、或计算机程序产品。因此,本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程信息处理设备的处理器以产生一个机器,使得通过计算机或其他可编程信息处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程信息处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程信息处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
显然,本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申请的精神和范围。这样,倘若本申请的这些修改和变型属于本申请权利要求及其等同技术的范围之内,则本申请也意图包含这些改动和变型在内。
Claims (9)
1.一种页面加载方法,其特征在于,包括:
响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,所述当前页面包括顺序排布的多个区域;
通过所述第一数据接口获取第一待显示数据;
将所述第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据;
对所述当前页面的页面滚动事件进行监听;
在监听到了所述页面滚动事件的情况下,确定所述当前页面滚动的第一距离;
在根据所述第一距离确定所述当前页面由第一区域滚动至包括至少部分第二区域的情况下,获取所述当前页面的第二区域对应的第二数据接口;
通过所述第二数据接口获取第二待显示数据;
根据所述第一距离,在所述第一待显示数据和第二待显示数据中获取对应的第一目标显示数据;
将所述第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的第一目标显示数据。
2.根据权利要求1所述的页面加载方法,其特征在于,还包括:
在确定所述第二数据接口为所述当前页面的最后一个区域的数据接口的情况下,停止对所述当前页面的页面滚动事件进行监听。
3.根据权利要求1所述页面加载方法,其特征在于,根据所述第一距离确定所述当前页面由第一区域滚动至包括至少部分第二区域,包括:
在确定所述第一距离大于阈值的情况下,确定所述当前页面由第一区域滚动至包括至少部分第二区域。
4.根据权利要求1所述的页面加载方法,其特征在于,所述根据所述第一距离,在所述第一待显示数据和第二待显示数据中获取对应的第一目标显示数据,包括:
根据所述第一距离确定当前显示区域中的当前页面对应的坐标数据;
从所述第一待显示数据和第二待显示数据中获取与所述坐标数据对应的显示数据,作为第一目标显示数据。
5.根据权利要求1所述页面加载方法,其特征在于,在将所述第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的所述第一目标显示数据之后,还包括:
在监听到了所述页面滚动事件的情况下,确定所述当前页面滚动的第二距离;
在根据所述第二距离确定所述当前页面未滚动至新的区域的情况下,根据所述第二距离,在所述第一待显示数据和第二待显示数据中获取对应的第二目标显示数据;
将所述第二目标显示数据进行渲染,并在当前显示区域中显示渲染后的第二目标显示数据。
6.根据权利要求1所述的页面加载方法,其特征在于,所述通过所述第一数据接口获取第一待显示数据,包括:
通过所述第一数据接口从服务器中获取第一待显示数据。
7.一种页面加载装置,其特征在于,包括:
第一获取单元,用于响应于当前页面的显示指令,获取当前页面的第一区域对应的第一数据接口,所述当前页面包括顺序排布的多个区域;
第二获取单元,用于通过所述第一数据接口获取第一待显示数据;
显示单元,用于将所述第一待显示数据进行渲染,并在当前显示区域中显示渲染后的第一待显示数据;对所述当前页面的页面滚动事件进行监听;在监听到了所述页面滚动事件的情况下,确定所述当前页面滚动的第一距离;在根据所述第一距离确定所述当前页面由第一区域滚动至包括至少部分第二区域的情况下,获取所述当前页面的第二区域对应的第二数据接口;通过所述第二数据接口获取第二待显示数据;根据所述第一距离,在所述第一待显示数据和第二待显示数据中获取对应的第一目标显示数据;将所述第一目标显示数据进行渲染,并在当前显示区域中显示渲染后的第一目标显示数据。
8.一种电子设备,其特征在于,包括:
至少一个处理器;以及与所述至少一个处理器通信连接的存储器;其中,所述存储器存储有可被所述至少一个处理器执行的指令,所述指令被所述至少一个处理器执行,以使所述至少一个处理器执行如权利要求1-6任意一项所述的页面加载方法。
9.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质存储有计算机指令,所述计算机指令用于使计算机执行如权利要求1-6任意一项所述的页面加载方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210096006.8A CN114547495B (zh) | 2022-01-26 | 2022-01-26 | 一种页面加载方法、装置、设备及可读存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210096006.8A CN114547495B (zh) | 2022-01-26 | 2022-01-26 | 一种页面加载方法、装置、设备及可读存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN114547495A CN114547495A (zh) | 2022-05-27 |
CN114547495B true CN114547495B (zh) | 2023-03-24 |
Family
ID=81674489
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202210096006.8A Active CN114547495B (zh) | 2022-01-26 | 2022-01-26 | 一种页面加载方法、装置、设备及可读存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN114547495B (zh) |
Families Citing this family (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN116185323B (zh) * | 2023-02-17 | 2024-03-08 | 广东保伦电子股份有限公司 | 一种无限循环滚动显示方法、装置、存储介质及系统 |
Family Cites Families (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US10063645B2 (en) * | 2012-05-10 | 2018-08-28 | Clicktale Ltd. | Method and system for monitoring and tracking browsing activity on handled devices |
CN103853729B (zh) * | 2012-11-29 | 2019-03-26 | 腾讯科技(深圳)有限公司 | 页面加载方法及其系统 |
CN112328939A (zh) * | 2020-11-16 | 2021-02-05 | 北京沃东天骏信息技术有限公司 | 页面处理方法、装置及存储介质 |
-
2022
- 2022-01-26 CN CN202210096006.8A patent/CN114547495B/zh active Active
Also Published As
Publication number | Publication date |
---|---|
CN114547495A (zh) | 2022-05-27 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN106570098B (zh) | 页面刷新的方法及装置 | |
US10620816B2 (en) | System for displaying elements of a scrollable list | |
CN106991154B (zh) | 网页渲染方法、装置、终端及服务器 | |
US9916285B2 (en) | Generating a preview of a web page for a mobile terminal | |
WO2015161658A1 (zh) | 网页资源加载方法及装置 | |
EP2755145A1 (en) | Webpage browsing method and device, and storage medium | |
CN102799372B (zh) | 一种图片信息的上传方法及上传装置 | |
WO2014067413A1 (en) | Method and apparatus for storing webpage access records | |
WO2016150324A1 (zh) | 一种页面模块的渲染方法、装置以及显示设备 | |
CN109740081B (zh) | 页面加载方法及装置 | |
WO2017219524A1 (zh) | 一种页面保存的方法及电子设备 | |
CN112685671A (zh) | 页面显示方法、装置、设备及存储介质 | |
CN109298905A (zh) | 利用前端编程语言优化图片懒加载的方法以及电子设备 | |
CN111796824A (zh) | 页面加载方法、装置、服务器及介质 | |
CN114547495B (zh) | 一种页面加载方法、装置、设备及可读存储介质 | |
US20220237042A1 (en) | Resource pre-fetch using age threshold | |
CN111125575A (zh) | 网页数据处理方法和装置 | |
CN107688650B (zh) | 一种web页面生成方法和装置 | |
CN108038150B (zh) | 网页打开方法、装置及终端设备 | |
CN113626113B (zh) | 一种页面渲染方法和装置 | |
CN103150355A (zh) | 一种网页内容预览的方法、装置及设备 | |
CN113032073A (zh) | 一种基于操作行为的页面展示方法和装置 | |
CN109543127B (zh) | 一种页面刷新方法、装置、设备及可读存储介质 | |
CN110609729A (zh) | 一种基于cmspweb的页面监听滚动渲染方法 | |
CN116521629A (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 | ||
CB02 | Change of applicant information |
Address after: 518066 room 1901, 19 / F, building 31 (Building B), Caihui center, No. 1 Cuiying street, Nansha District, Guangzhou, Guangdong Province (office only) Applicant after: Guangdong Lenovo understand Communication Co.,Ltd. Address before: Room 201, building a, No.1 Qianwan 1st Road, Shenzhen Hong Kong cooperation zone, Shenzhen, Guangdong Province (settled in Shenzhen Qianhai business secretary Co., Ltd.) Applicant before: SHENZHEN LENOVO CONNECT Co.,Ltd. |
|
CB02 | Change of applicant information | ||
GR01 | Patent grant | ||
GR01 | Patent grant |