WO2021082693A1 - 网页图像加载时长的获取方法、装置及电子设备 - Google Patents

网页图像加载时长的获取方法、装置及电子设备 Download PDF

Info

Publication number
WO2021082693A1
WO2021082693A1 PCT/CN2020/111776 CN2020111776W WO2021082693A1 WO 2021082693 A1 WO2021082693 A1 WO 2021082693A1 CN 2020111776 W CN2020111776 W CN 2020111776W WO 2021082693 A1 WO2021082693 A1 WO 2021082693A1
Authority
WO
WIPO (PCT)
Prior art keywords
loading
image
time
start time
html file
Prior art date
Application number
PCT/CN2020/111776
Other languages
English (en)
French (fr)
Inventor
银国徽
Original Assignee
北京字节跳动网络技术有限公司
Priority date (The priority date 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 date listed.)
Filing date
Publication date
Application filed by 北京字节跳动网络技术有限公司 filed Critical 北京字节跳动网络技术有限公司
Priority to US17/772,628 priority Critical patent/US11886798B2/en
Publication of WO2021082693A1 publication Critical patent/WO2021082693A1/zh

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/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • G06F16/972—Access to data in other repository systems, e.g. legacy data or dynamic Web page generation
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/14—Tree-structured documents
    • G06F40/143—Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
    • 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
    • G06F16/986—Document structures and storage, e.g. HTML extensions
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/445—Program loading or initiating
    • G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading

Definitions

  • the present disclosure relates to the field of computer technology. Specifically, the present disclosure relates to a method, device, and electronic device for acquiring the loading time of webpage images.
  • the URL of the image is recorded in the image tag of the Hypertext Markup Language (HTML) file of the web page.
  • HTML Hypertext Markup Language
  • the loading time of the image in the webpage cannot be obtained, and the analysis of the web service quality based on the loading time of the image cannot be realized, and data support for improving the quality of the webpage service cannot be provided.
  • the purpose of the present disclosure is to solve at least one of the above-mentioned technical defects.
  • the technical solutions adopted in the present disclosure are as follows:
  • a method for obtaining the loading time of a webpage image including:
  • the embedded point data is obtained through the embedded point set in the HTML file, where the embedded point data includes the loading start time of the HTML file;
  • the loading time of the image is determined.
  • a device for acquiring the loading time of a webpage image including:
  • the embedded point data acquisition module is configured to obtain the embedded point data through the embedded point set in the HTML file when the HTML file of the web page is loaded, where the embedded point data includes the loading start time of the HTML file;
  • the time stamp obtaining module is configured to obtain the time stamp of the loading end event of the image in the web page, and determine the loading time of the image according to the loading start time and the time stamp of the HTML file.
  • an electronic device including: a processor and a memory;
  • Memory configured to store computer programs
  • the processor is configured to execute the method shown in the first aspect of the present disclosure by calling a computer program.
  • a computer-readable storage medium having a computer program stored thereon, and when the program is executed by a processor, the method shown in the first aspect of the present disclosure is implemented.
  • the loading start time of the HTML file is obtained by the preset method of obtaining the buried point data
  • the loading end time of the image is obtained by the time stamp of the loading end event of the image
  • the loading end time of the image can be obtained according to the HTML file
  • the loading start time and the loading end time of the image determine the relative loading time of the image in the web page.
  • the solution provided by the embodiments of the present disclosure can obtain the loading time of the image in the webpage, facilitate the detection of the image loading time, and provide data support for realizing the analysis of the web service quality based on the loading time of the image and improving the service quality of the webpage.
  • FIG. 1 is a schematic flowchart of a method for acquiring the loading time of a webpage image according to an embodiment of the present disclosure
  • FIG. 2 is a schematic structural diagram of an apparatus for acquiring webpage image loading duration according to an embodiment of the present disclosure
  • Fig. 3 is a schematic structural diagram of an electronic device according to an embodiment of the present disclosure.
  • the images in the pages of the webpage may include images directly imported by the image tag, images imported by Cascading Style Sheets (CSS) files, and images imported by iframe tags.
  • CCS Cascading Style Sheets
  • iframe tags images imported by iframe tags.
  • the performance of the browser is usually monitored through the performance interface of the browser (such as the Performance interface, that is, the Performance API), but the loading time of the image in the web page cannot be obtained through the Performance API.
  • the method, device, and electronic device for acquiring the loading time of a webpage image provided by the embodiments of the present disclosure are intended to solve at least one of the above technical problems in the prior art.
  • Fig. 1 shows a schematic flow chart of a method for acquiring the loading time of a webpage image according to an embodiment of the present disclosure. As shown in Fig. 1, the method may include the following steps.
  • Step S110 When the HTML file of the web page is loaded, the embedded point data is obtained through the embedded point set in the HTML file, where the embedded point data includes the loading start time of the HTML file.
  • Step S120 Obtain the time stamp of the loading end event of the image in the web page, so as to determine the loading time of the image according to the loading start time and the time stamp of the HTML file.
  • the loading start time of the HTML file can be obtained by means of preset embedding points and obtaining embedding point data.
  • the loading end event corresponding to the image when each image in the web page is loaded, the loading end event corresponding to the image will be executed.
  • the loading end time of the image can be obtained by obtaining the time stamp of the loading end event of the image.
  • the aforementioned loading end event is an onload event or a loading error (onerror) event.
  • onerror When loading an HTML file, for any image in the page, if the image in the web page is loaded and loaded successfully, the onload event corresponding to the image will be executed, and if the image in the web page fails to load, the corresponding image will be executed
  • the onerror event indicates that the image has been loaded regardless of whether it is loaded successfully or failed. Therefore, the image loading end time can be determined by obtaining the timestamp of the onload event corresponding to the image or the timestamp of the onerror event corresponding to the image.
  • the terminal device After the terminal device obtains the HTML file of the web page from the server, it will start to load the HTML file.
  • the loading start time of the HTML file is before the loading start time of the image in the page corresponding to the HTML file.
  • the time interval between the loading start time of the file and the loading start time of the image is generally very short. Therefore, the loading start time of the image can be characterized by the loading start time of the HTML file of the web page.
  • the time stamp of the loading end event is obtained to obtain the loading end time of the image, and the loading time of the image is obtained based on the loading end time of the image and the loading start time of the image.
  • the loading start time of the HTML file is obtained through the preset method of obtaining the embedded point data, and the loading end time of the image is obtained through the time stamp of the loading end event of the image.
  • the loading start time of the HTML file represents the loading start time of the image, and the relative loading time of the image in the web page can be determined according to the loading start time of the HTML file and the loading end time of the image.
  • the loading time of the image in the webpage can be obtained, which facilitates the detection of the image loading time, and provides data support for realizing the analysis of the web service quality based on the loading time of the image and improving the service quality of the webpage.
  • the execution subject of the foregoing method may be a client or a server.
  • the execution subject of the above method is the client, after obtaining the time stamp of the loading end event of the image in the web page, it may further include:
  • the loading start time and time stamp of the HTML file are sent to the server, and the server determines the loading time of the image according to the loading start time and time stamp of the HTML file.
  • the execution subject of the above method may be a client or a server.
  • the client may detect the loading start time of the HTML file and the time stamp of the loading end event of the image.
  • the server obtains the loading start time of the HTML file and the time stamp of the loading end event of the image from the client, thereby determining the loading time of the image based on the obtained loading start time of the HTML file and the time stamp of the loading end event of the image.
  • the client can directly send to the server after obtaining the loading start time of the HTML file and the time stamp of the loading end event of the image, and the server will send it to the server according to the start loading time of the HTML file and the time stamp of the image.
  • the time stamp of the loading end event which determines the loading time of the image.
  • the client may also send the loading duration of the image to the server after determining the loading duration of the image according to the loading start time of the HTML file and the time stamp of the loading end event of the image.
  • the embedded point is set in the head of the HTML file, and the loading start time of the HTML file is the loading start time of the head.
  • the buried point can be set in the head of the HTML file. Since the head is loaded first when the HTML file is loaded, the loading start time of the head is located after the loading start time of the HTML file, and is located in the image of the page. Before the loading start time, therefore, the loading start time of the head is closer to the actual loading start time of the image in the page than the loading start time of the HTML file. Therefore, the loading start time of the head can be used to characterize the loading start of the image Time, the loading duration of the image determined based on the loading start time of the head and the loading end time of the image is more accurate.
  • the loading start time of the HTML file is the loading start time of the external file introduced in the head.
  • the external file may be a java script (JavaScript, JS) file or a CSS file.
  • the JS file or CSS file in the head When there is a tag that introduces an external JS file or a tag that introduces an external CSS file in the head of the HTML file, the JS file or CSS file in the head will be loaded first, and the loading start time of the JS file or CSS file in the head It is located after the loading start time of the head and before the loading start time of the image in the page. Therefore, the loading start time of the JS file or CSS file in the head is closer to the image in the page than the loading start time of the head. Therefore, the loading start time of the image can be characterized by the loading start time of the JS file or CSS file in the head to determine a more accurate image loading time.
  • FIG. 2 shows a schematic structural diagram of an apparatus for acquiring a webpage image loading duration according to an embodiment of the present disclosure. As shown in FIG. 2, the webpage image loading duration is acquired
  • the device 20 may include a buried point data acquisition module 210 and a time stamp acquisition module 220.
  • the embedded point data acquisition module 210 is configured to obtain embedded point data through embedded points set in the HTML file when loading an HTML file of a web page, where the embedded point data includes the loading start time of the HTML file.
  • the time stamp obtaining module 220 is configured to obtain the time stamp of the loading end event of the image in the web page, and determine the loading time of the image according to the loading start time and the time stamp of the HTML file.
  • the loading start time of the HTML file is obtained through the preset method of obtaining the embedded point data, and the loading end time of the image is obtained through the time stamp of the loading end event of the image.
  • the loading start time of the HTML file of the page represents the loading start time of the image, and the relative loading time of the image in the web page can be determined according to the loading start time of the HTML file and the loading end time of the image.
  • the solution provided by the embodiment of the present disclosure can obtain the loading time of the image in the webpage, facilitate the detection of the image loading time, and provide data support for realizing the analysis of the web service quality based on the loading time of the image and improving the web service quality.
  • the above-mentioned device can be set on the client or the server;
  • the above-mentioned device may further include:
  • the first data processing module is configured to, after obtaining the time stamp of the loading end event of the image in the web page, determine the loading time of the image according to the loading start time and time stamp of the HTML file, and send the loading time of the image to server;
  • the second data processing module is configured to send the loading start time and time stamp of the HTML file to the server after obtaining the time stamp of the loading end event of the image in the web page, so that the server can according to the loading start time of the HTML file And the timestamp to determine the loading time of the image.
  • the above loading end event is an onload event or an onerror event.
  • the buried point is set in the head of the HTML file, and the loading start time of the HTML file is the loading start time of the head.
  • the loading start time of the HTML file is the loading start time of the external file introduced in the head.
  • the external file is a JavaScript file or a CSS file.
  • Terminal devices in the embodiments of the present disclosure may include, but are not limited to, mobile phones, notebook computers, digital broadcast receivers, PDAs (personal digital assistants), PADs (tablets), PMPs (portable multimedia players), vehicle-mounted terminals (e.g. Mobile terminals such as car navigation terminals) and fixed terminals such as digital TVs, desktop computers, etc.
  • the electronic device shown in FIG. 3 is only an example, and should not bring any limitation to the function and scope of use of the embodiments of the present disclosure.
  • the electronic equipment includes a memory and a processor, where the processor here may be referred to as the processing device 601 described below, and the memory may include a read-only memory (ROM) 602, a random access memory (RAM) 603, and a storage device below. At least one of 608, as follows:
  • the electronic device 600 may include a processing device (such as a central processing unit, a graphics processor, etc.) 601, which may be loaded into a random access device according to a program stored in a read-only memory (ROM) 602 or from a storage device 608.
  • the program in the memory (RAM) 603 executes various appropriate actions and processing.
  • various programs and data required for the operation of the electronic device 600 are also stored.
  • the processing device 601, the ROM 602, and the RAM 603 are connected to each other through a bus 604.
  • An input/output (I/O) interface 605 is also connected to the bus 604.
  • the following devices can be connected to the I/O interface 605: including input devices 606 such as touch screens, touch pads, keyboards, mice, cameras, microphones, accelerometers, gyroscopes, etc.; including, for example, liquid crystal displays (LCD), speakers, vibration An output device 607 such as a device; a storage device 608 such as a magnetic tape, a hard disk, etc.; and a communication device 609.
  • the communication device 609 may allow the electronic device 600 to perform wireless or wired communication with other devices to exchange data.
  • FIG. 3 shows an electronic device 600 having various devices, it should be understood that it is not required to implement or have all of the illustrated devices. It may alternatively be implemented or provided with more or fewer devices.
  • the process described above with reference to the flowchart can be implemented as a computer software program.
  • the embodiments of the present disclosure include a computer program product, which includes a computer program carried on a non-transitory computer readable medium, and the computer program contains program code for executing the method shown in the flowchart.
  • the computer program may be downloaded and installed from the network through the communication device 609, or installed from the storage device 608, or installed from the ROM 602.
  • the processing device 601 the above-mentioned functions defined in the method of the embodiment of the present disclosure are executed.
  • the aforementioned computer-readable medium in the present disclosure may be a computer-readable signal medium or a computer-readable storage medium, or any combination of the two.
  • the computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device, or device, or a combination of any of the above. More specific examples of computer-readable storage media may include, but are not limited to: electrical connections with one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable removable Programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read-only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination of the above.
  • a computer-readable storage medium may be any tangible medium that contains or stores a program, and the program may be used by or in combination with an instruction execution system, apparatus, or device.
  • a computer-readable signal medium may include a data signal propagated in a baseband or as a part of a carrier wave, and a computer-readable program code is carried therein. This propagated data signal can take many forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the foregoing.
  • the computer-readable signal medium may also be any computer-readable medium other than the computer-readable storage medium.
  • the computer-readable signal medium may send, propagate or transmit the program for use by or in combination with the instruction execution system, apparatus, or device .
  • the program code contained on the computer-readable medium can be transmitted by any suitable medium, including but not limited to: wire, optical cable, RF (Radio Frequency), etc., or any suitable combination of the above.
  • the client and server can communicate with any currently known or future developed network protocol such as HTTP (HyperText Transfer Protocol), and can communicate with digital data in any form or medium.
  • Communication e.g., communication network
  • Examples of communication networks include local area networks (“LAN”), wide area networks (“WAN”), the Internet (for example, the Internet), and end-to-end networks (for example, ad hoc end-to-end networks), as well as any currently known or future research and development network of.
  • the above-mentioned computer-readable medium may be included in the above-mentioned electronic device; or it may exist alone without being assembled into the electronic device.
  • the above-mentioned computer-readable medium carries one or more programs.
  • the electronic device When the above-mentioned one or more programs are executed by the electronic device, the electronic device: When loading the HTML file of the web page, pass the embedding point set in the HTML file Obtain the buried point data, where the buried point data includes the loading start time of the HTML file;
  • the loading duration of the image is determined.
  • the computer program code used to perform the operations of the present disclosure can be written in one or more programming languages or a combination thereof.
  • the above-mentioned programming languages include but are not limited to object-oriented programming languages such as Java, Smalltalk, C++, and Including conventional procedural programming languages-such as "C" language or similar programming languages.
  • the program code can be executed entirely on the user's computer, partly on the user's computer, executed as an independent software package, partly on the user's computer and partly executed on a remote computer, or entirely executed on the remote computer or server.
  • the remote computer can be connected to the user's computer through any kind of network, including a local area network (LAN) or a wide area network (WAN), or it can be connected to an external computer (for example, using an Internet service provider to pass Internet connection).
  • LAN local area network
  • WAN wide area network
  • each block in the flowchart or block diagram may represent a module, program segment, or part of code, and the module, program segment, or part of code contains one or more for realizing the specified logical function Executable instructions.
  • the functions marked in the block may also occur in a different order from the order marked in the drawings. For example, two blocks shown in succession can actually be executed substantially in parallel, and they can sometimes be executed in the reverse order, depending on the functions involved.
  • each block in the block diagram and/or flowchart, and the combination of the blocks in the block diagram and/or flowchart can be implemented by a dedicated hardware-based system that performs the specified functions or operations Or it can be realized by a combination of dedicated hardware and computer instructions.
  • modules or units involved in the embodiments described in the present disclosure can be implemented in software or hardware.
  • the name of the module or unit does not constitute a limitation on the unit itself under certain circumstances.
  • a buried point data acquisition module can also be described as "a module that will acquire buried point data through a buried point.”
  • exemplary types of hardware logic components include: Field Programmable Gate Array (FPGA), Application Specific Integrated Circuit (ASIC), Application Specific Standard Product (ASSP), System on Chip (SOC), Complex Programmable Logical device (CPLD) and so on.
  • FPGA Field Programmable Gate Array
  • ASIC Application Specific Integrated Circuit
  • ASSP Application Specific Standard Product
  • SOC System on Chip
  • CPLD Complex Programmable Logical device
  • a machine-readable medium may be a tangible medium, which may contain or store a program for use by the instruction execution system, apparatus, or device or in combination with the instruction execution system, apparatus, or device.
  • the machine-readable medium may be a machine-readable signal medium or a machine-readable storage medium.
  • the machine-readable medium may include, but is not limited to, an electronic, magnetic, optical, electromagnetic, infrared, or semiconductor system, device, or device, or any suitable combination of the foregoing.
  • machine-readable storage media would include electrical connections based on one or more wires, portable computer disks, hard disks, random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM or flash memory), optical fiber, portable compact disk read only memory (CD-ROM), optical storage device, magnetic storage device, or any suitable combination of the foregoing.
  • RAM random access memory
  • ROM read-only memory
  • EPROM or flash memory erasable programmable read-only memory
  • CD-ROM compact disk read only memory
  • magnetic storage device or any suitable combination of the foregoing.
  • the present disclosure provides a method for obtaining the loading time of a webpage image, including:
  • the embedded point data is obtained through the embedded point set in the HTML file, where the embedded point data includes the loading start time of the HTML file;
  • the loading time of the image is determined.
  • the execution subject of the method is the client or the server;
  • the execution subject of the above method is the client, after obtaining the time stamp of the loading end event of the image in the web page, it may further include:
  • the loading start time and time stamp of the HTML file are sent to the server, and the server determines the loading time of the image according to the loading start time and time stamp of the HTML file.
  • the loading end event is an onload event or an onerror event.
  • the buried point is set in the head of the HTML file, and the loading start time of the HTML file is the loading start time of the head.
  • the loading start time of the HTML file is the loading start time of the external file introduced in the head.
  • the external file is a JavaScript file or a CSS file.
  • the present disclosure provides a device for acquiring the loading time of a webpage image, which may include:
  • the embedded point data acquisition module is configured to obtain the embedded point data through the embedded point set in the HTML file when the HTML file of the web page is loaded, where the embedded point data includes the loading start time of the HTML file;
  • the time stamp obtaining module is configured to obtain the time stamp of the loading end event of the image in the web page, and determine the loading time of the image according to the loading start time and the time stamp of the HTML file.
  • the foregoing apparatus may be configured as a client or a server;
  • the foregoing device may further include:
  • the first data processing module is configured to, after obtaining the time stamp of the loading end event of the image in the web page, determine the loading time of the image according to the loading start time and time stamp of the HTML file, and send the loading time of the image to the server ;
  • the second data processing module is configured to, after obtaining the time stamp of the loading end event of the image in the web page, send the loading start time and time stamp of the HTML file to the server, and the server determines according to the loading start time and time stamp The loading time of the image.
  • the loading end event is an onload event or an onerror event.
  • the embedded point is set in the head of the HTML file, and the loading start time of the HTML file is the loading start time of the head.
  • the loading start time of the HTML file is the loading start time of the external file introduced in the head.
  • the external file is a JavaScript file or a CSS file.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Software Systems (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

一种网页图像加载时长的获取方法、装置及电子设备。该方法包括：在加载网页页面的超文本标记语言HTML文件时，通过在HTML文件中设置的埋点获取埋点数据，其中，埋点数据包括HTML文件的加载开始时间（S110）；获取网页页面中的图像的加载结束事件的时间戳，以根据加载开始时间和时间戳，确定图像的加载时长（S120）。所述方法能够获取到网页中图像的加载时长，便于对图像加载时长的进行检测，为基于图像的加载时长实现对网页服务质量进行分析，提升网页服务质量提供了数据支持。

Description

网页图像加载时长的获取方法、装置及电子设备 技术领域
本公开涉及计算机技术领域，具体而言，本公开涉及一种网页图像加载时长的获取方法、装置及电子设备。
背景技术
随着互联网技术的高速发展，人们能够获取的信息也越来越多，单纯的文本形式信息已不能满足人们对信息的获取需求。由于图像信息具有直观、表现力强等诸多优点，越来越受到人们的青睐。目前网页中包含的图像信息的比重越来越高，这也对浏览器的图像服务质量提出了更高要求。
网页的超文本标记语言(Hyper Text Markup Language，HTML)文件的图像(image)标签中记载有图像的地址，终端浏览器在加载含有图像的网页的HTML文件时，可以通过image标签中的图像地址获取图像。
现有技术中，无法获取网页中图像的加载时长，也就无法基于图像的加载时长实现对网页服务质量的分析，无法为提升网页服务质量提供数据支持。
发明内容
提供该发明内容部分以便以简要的形式介绍构思，这些构思将在后面的具体实施方式部分被详细描述。该发明内容部分并不旨在标识要求保护的技术方案的关键特征或必要特征，也不旨在用于限制所要求的保护的技术方案的范围。
本公开的目的旨在至少能解决上述的技术缺陷之一。本公开所采用的技术方案如下：
根据本公开的第一方面，提供了一种网页图像加载时长的获取方法，该方法包括：
在加载网页页面的HTML文件时，通过在HTML文件中设置的埋点获取埋点数据，其中，埋点数据包括HTML文件的加载开始时间；
获取网页页面中的图像的加载结束事件的时间戳；以及
根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
根据本公开的第二方面，提供了一种网页图像加载时长的获取装置，该装置包括：
埋点数据获取模块，被配置为在加载网页页面的HTML文件时，通过在HTML文件中设置的埋点获取埋点数据，其中，埋点数据包括HTML文件的加载开始时间；
时间戳获取模块，被配置为获取网页页面中的图像的加载结束事件的时间戳，并根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
根据本公开的第三方面，提供了一种电子设备，该电子设备包括：处理器和存储器；
存储器，被配置为存储计算机程序；
处理器，被配置为通过调用计算机程序，执行如本公开的第一方面的所示的方法。
根据本公开的第四方面，提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现本公开的第一方面所示的方法。
本公开实施例提供的技术方案至少带来的如下有益效果：
本公开实施例的方案，通过预设置的埋点获取埋点数据的方式，获取HTML文件的加载开始时间，通过图像的加载结束事件的时间戳获取图像的加载结束时间，并可以根据HTML文件的加载开始时间与图像的加载结束时间，确定出网页页面中图像的相对的加载时长。本公开实施例提供的方案，能够获取到网页中图像的加载时长，便于对图像加载时长的进行检测，为基于图像的加载时长实现对网页服务质量进行分析，提升网页服务质量提供了数据支持。
附图说明
结合附图并参考以下具体实施方式，本公开各实施例的上述和其他特征、优点及方面将变得更加明显。贯穿附图中，相同或相似的附图标记表示相同或相似的元素。应当理解附图是示意性的，原件和元素不一定按照比例绘制。
为了更清楚地说明本公开实施例中的技术方案，下面将对本公开实施例描述中所需要使用的附图作简单地介绍。
图1为根据本公开实施例的一种网页图像加载时长的获取方法的流程示意图；
图2为根据本公开实施例的一种网页图像加载时长的获取装置的结构示意图；
图3为根据本公开实施例的一种电子设备的结构示意图。
具体实施方式
下面将参照附图更详细地描述本公开的实施例。虽然附图中显示了本公开的某些实施例，然而应当理解的是，本公开可以通过各种形式来实现，而且不应该被解释为限于这里阐述的实施例，相反提供这些实施例是为了更加透彻和完整地理解本公开。应当理解的是，本公开的附图及实施例仅用于示例性作用，并非用于限制本公开的保护范围。
应当理解，本公开的方法实施方式中记载的各个步骤可以按照不同的顺序执行，和/或并行执行。此外，方法实施方式可以包括附加的步骤和/或省略执行示出的步骤。本公开的范围在此方面不受限制。
本文使用的术语“包括”及其变形是开放性包括，即“包括但不限于”。术语“基于”是“至少部分地基于”。术语“一个实施例”表示“至少一个实施例”；术语“另一实施例”表示“至少一个另外的实施例”；术语“一些实施例”表示“至少一些实施例”。其他术语的相关定义将在下文描述中给出。
需要注意，本公开中提及的“第一”、“第二”等概念仅用于对装置、模块或单元进行区分，并非用于限定这些装置、模块或单元一定为不同的 装置、模块或单元，也并非用于限定这些装置、模块或单元所执行的功能的顺序或者相互依存关系。
需要注意，本公开中提及的“一个”、“多个”的修饰是示意性而非限制性的，本领域技术人员应当理解，除非在上下文另有明确指出，否则应该理解为“一个或多个”。本公开实施方式中的多个装置之间所交互的消息或者信息的名称仅用于说明性的目的，而并不是用于对这些消息或信息的范围进行限制。
为使本公开的目的、技术方案和优点更加清楚，下面将结合附图对本公开实施方式作进一步地详细描述。
网页内页面中的图像可以包括由image标签直接引入的图像、由层叠样式表(Cascading Style Sheets，CSS)文件引入的图像以及由行内框架(iframe)标签引入的图像。现有技术中，多通过浏览器的性能接口(如Performance接口，即Performance API)来对浏览器的性能进行监控，但是通过Performance API无法获取到网页中图像的加载时长。
本公开实施例提供的网页图像加载时长的获取方法、装置及电子设备，旨在解决现有技术的如上技术问题中的至少一个。
下面以具体地实施例对本公开的技术方案以及本公开的技术方案如何解决上述技术问题进行详细说明。下面这几个具体的实施例可以相互结合，对于相同或相似的概念或过程可能在某些实施例中不再赘述。下面将结合附图，对本公开的实施例进行描述。
图1示出了根据本公开实施例的一种网页图像加载时长的获取方法的流程示意图，如图1所示，该方法可以包括如下步骤。
步骤S110：在加载网页页面的HTML文件时，通过在HTML文件中设置的埋点获取埋点数据，其中，埋点数据包括HTML文件的加载开始时间。
步骤S120：获取网页页面中的图像的加载结束事件的时间戳，以根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
本公开实施例中，在网页页面的HTML文件的加载过程中，可以通过预设置的埋点并获取埋点数据的方式，来获取HTML文件的加载开始 时间。
本公开实施例中，在网页页面中的各图像在加载结束时，均会执行图像对应的加载结束事件，可以通过获取图像的加载结束事件的时间戳，来获得图像加载结束时间。
作为可选方案，上述的加载结束事件为加载完成(onload)事件或加载错误(onerror)事件。在加载HTML文件时，对于页面中的任一图像，如果网页页面中的图像加载完成且加载成功，则会执行图像对应的onload事件，如果网页页面中的图像加载失败，则会执行图像对应的onerror事件，无论加载成功还是加载失败，都表示图像已经加载完毕，因此，可以通过获取图像对应的onload事件的时间戳或者图像对应的onerror事件的时间戳来确定图像加载结束时间。
在实际使用中，终端设备在从服务器获取到网页页面的HTML文件之后，会开始加载该HTML文件，HTML文件的加载开始时间位于HTML文件所对应的页面中的图像的加载开始时间之前，而HTML文件的加载开始时间与图像的加载开始时间的时间间隔一般很短，因此，可以通过网页页面的HTML文件的加载开始时间表征图像的加载开始时间。之后，再通过获取到上述加载结束事件的时间戳，得到图像的加载结束时间，从而基于图像的加载结束时间和图像的加载开始时间得到图像的加载时长。
在本公开实施例中，如果多次检测到网页页面中的某些图像的加载时长超过合理范围，可以针对这些图像进行分析，确定导致加载时长过长的原因，并确定出相应的处理办法，以保证用户的使用体验。
根据本公开实施例的方法，通过预设置的埋点获取埋点数据的方式，获取HTML文件的加载开始时间，通过图像的加载结束事件的时间戳获取图像的加载结束时间，由于可以通过网页页面的HTML文件的加载开始时间表征图像的加载开始时间，可以根据HTML文件的加载开始时间与图像的加载结束时间，确定出网页页面中图像的相对的加载时长。根据本公开实施例提供的方案，能够获取网页中图像的加载时长，便于对图像加载时长的进行检测，为基于图像的加载时长实现对网页服务质量进行分析，提升网页服务质量提供了数据支持。
在本公开实施例的可选方式中，上述方法的执行主体可以为客户端或服务器。
若上述方法的执行主体为客户端，则获取网页页面中的图像的加载结束事件的时间戳之后，还可以包括：
根据HTML文件的加载开始时间和时间戳，确定图像的加载时长，将图像的加载时长发送至服务器；
或者，
将HTML文件的加载开始时间和时间戳发送至服务器，通过服务器根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
在本公开实施例中，上述方法的执行主体可以为客户端或者服务器，当上述方法的执行主体为服务器时，可以在客户端检测HTML文件的加载开始时间以及图像的加载结束事件的时间戳之后，服务器向客户端获取HTML文件的加载开始时间以及图像的加载结束事件的时间戳，从而基于获取到的HTML文件的加载开始时间以及图像的加载结束事件的时间戳确定出图像的加载时长。
当上述方法的执行主体为客户端时，客户端在获取HTML文件的加载开始时间以及图像的加载结束事件的时间戳之后，可以直接发送给服务器，由服务器根据HTML文件的开始加载时长以及图像的加载结束事件的时间戳，确定图像的加载时长。客户端也可以在根据HTML文件的加载开始时间以及图像的加载结束事件的时间戳，确定图像的加载时长之后，将图像的加载时长发送给服务器。
在本公开实施例的可选方式中，埋点设置在HTML文件的文件头head中，HTML文件的加载开始时间为head的加载开始时间。
在本公开实施例中，可以将埋点设置在HTML文件的head中，由于HTML文件加载时会首先加载head，head的加载开始时间位于HTML文件的加载开始时间之后，并且位于页面中的图像的加载开始时间之前，因此，head的加载开始时间相较于HTML文件的加载开始时间，更为接近页面中的图像的实际的加载开始时间，因此，可以通过head的加载开始时间表征图像的加载开始时间，基于head的加载开始时间以及图像的加 载结束时间确定出的图像的加载时长更为准确。
在本公开实施例的可选方式中，HTML文件的加载开始时间为head中所引入的外部文件的加载开始时间。
在本公开实施例中，HTML文件的head中可以存在引入外部文件的标签，作为可选实施方式，外部文件可以为java脚本(JavaScript，JS)文件或CSS文件。
当HTML文件的head中存在引入外部的JS文件的标签或者引入外部的CSS文件的标签时，会先对head中的JS文件或者CSS文件进行加载，head中的JS文件或者CSS文件的加载开始时间位于head的加载开始时间之后，并且位于页面中的图像的加载开始时间之前，因此，head中的JS文件或者CSS文件的加载开始时间相较于head的加载开始时间，更为接近页面中的图像的实际的加载开始时间，因此，可以通过head中的JS文件或者CSS文件的加载开始时间表征图像的加载开始时间，以确定出更为准确的图像的加载时长。
基于与图1中所示的方法相同的原理，图2示出了根据本公开实施例的一种网页图像加载时长的获取装置的结构示意图，如图2所示，该网页图像加载时长的获取装置20可以包括埋点数据获取模块210和时间戳获取模块220。
埋点数据获取模块210被配置为在加载网页页面的HTML文件时，通过在HTML文件中设置的埋点获取埋点数据，其中，埋点数据包括HTML文件的加载开始时间。
时间戳获取模块220被配置为获取网页页面中的图像的加载结束事件的时间戳，并根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
根据本公开实施例提供的装置，通过预设置的埋点获取埋点数据的方式，获取HTML文件的加载开始时间，通过图像的加载结束事件的时间戳获取图像的加载结束时间，由于可以通过网页页面的HTML文件的加载开始时间表征图像的加载开始时间，可以根据HTML文件的加载开始时间与图像的加载结束时间，确定出网页页面中图像的相对的加载时长。 本公开实施例提供的方案，能够获取网页中图像的加载时长，便于对图像加载时长的进行检测，为基于图像的加载时长实现对网页服务质量进行分析，提升网页服务质量提供了数据支持。
可选地，上述装置可以设置于客户端或服务器；
若上述装置设置于为客户端，则上述装置还可以包括：
第一数据处理模块，其被配置为在获取网页页面中的图像的加载结束事件的时间戳之后，根据HTML文件的加载开始时间和时间戳，确定图像的加载时长，将图像的加载时长发送至服务器；
或者，
第二数据处理模块，其被配置为在获取网页页面中的图像的加载结束事件的时间戳之后，将HTML文件的加载开始时间和时间戳发送至服务器，以使服务器根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
可选地，上述加载结束事件为onload事件或onerror事件。
可选地，埋点设置在HTML文件的head中，HTML文件的加载开始时间为head的加载开始时间。
可选地，HTML文件的加载开始时间为head中所引入的外部文件的加载开始时间。
可选地，外部文件为JavaScript文件或CSS文件。
下面参考图3，其示出了适于用来实现本公开实施例的电子设备(例如图1中的终端设备或服务器)600的结构示意图。本公开实施例中的终端设备可以包括但不限于诸如移动电话、笔记本电脑、数字广播接收器、PDA(个人数字助理)、PAD(平板电脑)、PMP(便携式多媒体播放器)、车载终端(例如车载导航终端)等等的移动终端以及诸如数字TV、台式计算机等等的固定终端。图3示出的电子设备仅仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。
电子设备包括：存储器以及处理器，其中，这里的处理器可以称为下文所述的处理装置601，存储器可以包括下文中的只读存储器(ROM)602、随机访问存储器(RAM)603以及存储装置608中的至少一项，具体如下 所示：
如图3所示，电子设备600可以包括处理装置(例如中央处理器、图形处理器等)601，其可以根据存储在只读存储器(ROM)602中的程序或者从存储装置608加载到随机访问存储器(RAM)603中的程序而执行各种适当的动作和处理。在RAM 603中，还存储有电子设备600操作所需的各种程序和数据。处理装置601、ROM 602以及RAM 603通过总线604彼此相连。输入/输出(I/O)接口605也连接至总线604。
通常，以下装置可以连接至I/O接口605：包括例如触摸屏、触摸板、键盘、鼠标、摄像头、麦克风、加速度计、陀螺仪等的输入装置606；包括例如液晶显示器(LCD)、扬声器、振动器等的输出装置607；包括例如磁带、硬盘等的存储装置608；以及通信装置609。通信装置609可以允许电子设备600与其他设备进行无线或有线通信以交换数据。虽然图3示出了具有各种装置的电子设备600，但是应理解的是，并不要求实施或具备所有示出的装置。可以替代地实施或具备更多或更少的装置。
特别地，根据本公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在非暂态计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信装置609从网络上被下载和安装，或者从存储装置608被安装，或者从ROM 602被安装。在该计算机程序被处理装置601执行时，执行本公开实施例的方法中限定的上述功能。
需要说明的是，本公开上述的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的 组合。在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中，计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读信号介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：电线、光缆、RF(射频)等等，或者上述的任意合适的组合。
在一些实施方式中，客户端、服务器可以利用诸如HTTP(HyperText Transfer Protocol，超文本传输协议)之类的任何当前已知或未来研发的网络协议进行通信，并且可以与任意形式或介质的数字数据通信(例如，通信网络)互连。通信网络的示例包括局域网(“LAN”)，广域网(“WAN”)，网际网(例如，互联网)以及端对端网络(例如，ad hoc端对端网络)，以及任何当前已知或未来研发的网络。
上述计算机可读介质可以是上述电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中。
上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被该电子设备执行时，使得该电子设备：在加载网页页面的HTML文件时，通过在HTML文件中设置的埋点获取埋点数据，其中，埋点数据包括HTML文件的加载开始时间；
获取网页页面中的图像的加载结束事件的时间戳；以及
根据加载开始时间和所述时间戳，确定图像的加载时长。
可以以一种或多种程序设计语言或其组合来编写用于执行本公开的操作的计算机程序代码，上述程序设计语言包括但不限于面向对象的程序设计语言—诸如Java、Smalltalk、C++，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、 部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域网(WAN)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
附图中的流程图和框图，图示了按照本公开各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，该模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。
描述于本公开实施例中所涉及到的模块或单元可以通过软件的方式实现，也可以通过硬件的方式来实现。其中，模块或单元的名称在某种情况下并不构成对该单元本身的限定，例如，埋点数据获取模块还可以被描述为“将通过埋点获取埋点数据的模块”。
本文中以上描述的功能可以至少部分地由一个或多个硬件逻辑部件来执行。例如，非限制性地，可以使用的示范类型的硬件逻辑部件包括：现场可编程门阵列(FPGA)、专用集成电路(ASIC)、专用标准产品(ASSP)、片上系统(SOC)、复杂可编程逻辑设备(CPLD)等等。
在本公开的上下文中，机器可读介质可以是有形的介质，其可以包含或存储以供指令执行系统、装置或设备使用或与指令执行系统、装置或设备结合地使用的程序。机器可读介质可以是机器可读信号介质或机器可读储存介质。机器可读介质可以包括但不限于电子的、磁性的、光学的、电磁的、红外的、或半导体系统、装置或设备，或者上述内容的任何合适组 合。机器可读存储介质的更具体示例会包括基于一个或多个线的电气连接、便携式计算机盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦除可编程只读存储器(EPROM或快闪存储器)、光纤、便捷式紧凑盘只读存储器(CD-ROM)、光学储存设备、磁储存设备、或上述内容的任何合适组合。
根据本公开的一个或多个实施例，本公开提供了一种网页图像加载时长的获取方法，包括：
在加载网页页面的HTML文件时，通过在HTML文件中设置的埋点获取埋点数据，其中，埋点数据包括HTML文件的加载开始时间；
获取网页页面中的图像的加载结束事件的时间戳；以及
根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
根据本公开提供的上述网页图像加载时长的获取方法，上述方法的执行主体为客户端或服务器；
若上述方法的执行主体为客户端，则获取网页页面中的图像的加载结束事件的时间戳之后，还可以包括：
根据HTML文件的加载开始时间和时间戳，确定图像的加载时长，将图像的加载时长发送至服务器；
或者，
将HTML文件的加载开始时间和时间戳发送至服务器，通过服务器根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
根据本公开提供的上述网页图像加载时长的获取方法，加载结束事件为onload事件或onerror事件。
根据本公开提供的上述网页图像加载时长的获取方法，埋点设置在HTML文件的head中，HTML文件的加载开始时间为head的加载开始时间。
根据本公开提供的上述网页图像加载时长的获取方法，HTML文件的加载开始时间为head中所引入的外部文件的加载开始时间。
根据本公开的一个或多个实施例，外部文件为JavaScript文件或CSS文件。
根据本公开的一个或多个实施例，本公开提供了一种网页图像加载时长的获取装置，可以包括：
埋点数据获取模块，被配置为在加载网页页面的HTML文件时，通过在HTML文件中设置的埋点获取埋点数据，其中，埋点数据包括HTML文件的加载开始时间；
时间戳获取模块，被配置为获取网页页面中的图像的加载结束事件的时间戳，并根据HTML文件的加载开始时间和时间戳，确定图像的加载时长。
根据本公开提供的上述网页图像加载时长的获取装置，上述装置可以设置为客户端或服务器；
若上述装置设置为客户端，则上述装置还可以包括：
第一数据处理模块，被配置为在获取网页页面中的图像的加载结束事件的时间戳之后，根据HTML文件的加载开始时间和时间戳，确定图像的加载时长，将图像的加载时长发送至服务器；
或者，
第二数据处理模块，被配置为在获取网页页面中的图像的加载结束事件的时间戳之后，将HTML文件的加载开始时间和时间戳发送至服务器，通过服务器根据加载开始时间和时间戳，确定图像的加载时长。
根据本公开提供的上述网页图像加载时长的获取装置，加载结束事件为onload事件或onerror事件。
根据本公开提供的上述网页图像加载时长的获取装置，埋点设置在HTML文件的head中，HTML文件的加载开始时间为head的加载开始时间。
根据本公开提供的上述网页图像加载时长的获取装置，HTML文件的加载开始时间为head中所引入的外部文件的加载开始时间。
根据本公开提供的上述网页图像加载时长的获取装置，外部文件为JavaScript文件或CSS文件。
以上描述仅为本公开的较佳实施例以及对所运用技术原理的说明。本领域技术人员应当理解，本公开中所涉及的公开范围，并不限于上述技术 特征的特定组合而成的技术方案，同时也应涵盖在不脱离上述公开构思的情况下，由上述技术特征或其等同特征进行任意组合而形成的其它技术方案。例如上述特征与本公开中公开的(但不限于)具有类似功能的技术特征进行互相替换而形成的技术方案。
此外，虽然采用特定次序描绘了各操作，但是这不应当理解为要求这些操作以所示出的特定次序或以顺序次序执行来执行。在一定环境下，多任务和并行处理可能是有利的。同样地，虽然在上面论述中包含了若干具体实现细节，但是这些不应当被解释为对本公开的范围的限制。在单独的实施例的上下文中描述的某些特征还可以组合地实现在单个实施例中。相反地，在单个实施例的上下文中描述的各种特征也可以单独地或以任何合适的子组合的方式实现在多个实施例中。
尽管已经采用特定于结构特征和/或方法逻辑动作的语言描述了本主题，但是应当理解所附权利要求书中所限定的主题未必局限于上面描述的特定特征或动作。相反，上面所描述的特定特征和动作仅仅是实现权利要求书的示例形式。

Claims (11)

  1. 一种网页图像加载时长的获取方法，包括：
    在加载网页页面的超文本标记语言(HTML)文件时，通过在所述HTML文件中设置的埋点获取埋点数据，其中，所述埋点数据包括所述HTML文件的加载开始时间；
    获取所述网页页面中的图像的加载结束事件的时间戳；以及
    根据所述加载开始时间和所述时间戳，确定所述图像的加载时长。
  2. 根据权利要求1所述的方法，其中，所述方法的执行主体为客户端或服务器；
    若所述方法的执行主体为客户端，则在所述获取所述网页页面中的图像的加载结束事件的时间戳之后，还包括：
    根据所述加载开始时间和所述时间戳，确定所述图像的加载时长；以及
    将所述加载时长发送至服务器；
    或者，
    将所述加载开始时间和所述时间戳发送至所述服务器；以及
    通过所述服务器根据所述加载开始时间和所述时间戳，确定所述图像的加载时长。
  3. 根据权利要求1所述的方法，其中，当所述方法的执行主体为服务器时，在客户端检测HTML文件的加载开始时间以及图像的加载结束事件的时间戳之后，所述服务器向所述客户端获取HTML文件的加载开始时间以及图像的加载结束事件的时间戳，从而基于所获取的HTML文件的加载开始时间以及图像的加载结束事件的时间戳确定图像的加载时长。
  4. 根据权利要求1所述的方法，其中，所述加载结束事件为加载完成(onload)事件或加载错误(onerror)事件。
  5. 根据权利要求1所述的方法，其中，所述埋点设置在所述HTML文件的文件头(head)中，所述加载开始时间为所述head的加载开始时 间。
  6. 根据权利要求5所述的方法，其中，所述加载开始时间为所述head中所引入的外部文件的加载开始时间。
  7. 根据权利要求6所述的方法，其中，所述外部文件为JavaScript文件或层叠样式表(CSS)文件。
  8. 一种网页图像加载时长的获取装置，包括：
    埋点数据获取模块，被配置为在加载网页页面的超文本标记语言(HTML)文件时，通过在所述HTML文件中设置的埋点获取埋点数据，其中，所述埋点数据包括所述HTML文件的加载开始时间；
    时间戳获取模块，被配置为获取所述网页页面中的图像的加载结束事件的时间戳，并根据所述加载开始时间和所述时间戳，确定所述图像的加载时长。
  9. 根据权利要求8所述的装置，其中，所述加载结束事件为(onload)事件或(onerror)事件。
  10. 一种电子设备，包括处理器和存储器；
    所述存储器，被配置为存储计算机程序；
    所述处理器，被配置为通过运行所述计算机程序，执行权利要求1-7中任一项所述的方法。
  11. 一种计算机可读存储介质，所述存储介质上存储有计算机程序，所述计算机程序被处理器执行时实现权利要求1-7中任一项所述的方法。
PCT/CN2020/111776 2019-10-28 2020-08-27 网页图像加载时长的获取方法、装置及电子设备 WO2021082693A1 (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
US17/772,628 US11886798B2 (en) 2019-10-28 2020-08-27 Method and apparatus for obtaining loading time length of image in webpage, and electronic device

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201911032128.5 2019-10-28
CN201911032128.5A CN110781437A (zh) 2019-10-28 2019-10-28 网页图像加载时长的获取方法、装置及电子设备

Publications (1)

Publication Number Publication Date
WO2021082693A1 true WO2021082693A1 (zh) 2021-05-06

Family

ID=69387157

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2020/111776 WO2021082693A1 (zh) 2019-10-28 2020-08-27 网页图像加载时长的获取方法、装置及电子设备

Country Status (3)

Country Link
US (1) US11886798B2 (zh)
CN (1) CN110781437A (zh)
WO (1) WO2021082693A1 (zh)

Families Citing this family (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110781437A (zh) 2019-10-28 2020-02-11 北京字节跳动网络技术有限公司 网页图像加载时长的获取方法、装置及电子设备
CN112417240A (zh) * 2020-02-21 2021-02-26 上海哔哩哔哩科技有限公司 网站链接检测方法、装置、计算机设备
CN111695064B (zh) * 2020-04-29 2023-08-18 北京城市网邻信息技术有限公司 一种埋点加载方法及装置
CN113765744A (zh) * 2021-08-13 2021-12-07 北京三快在线科技有限公司 图像加载性能检测方法、装置、电子设备和计算机介质

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109039715A (zh) * 2018-07-17 2018-12-18 中国联合网络通信集团有限公司 用户网页浏览体验评估方法及系统、网络基站配置方法
US20190095408A1 (en) * 2014-12-31 2019-03-28 Quantum Metric, LLC Accurate and efficient recording of user experience, gui changes and user interaction events on a remote web document
CN109815089A (zh) * 2019-01-16 2019-05-28 中国平安财产保险股份有限公司 H5页面监控方法、装置、计算机设备和存储介质
CN110287441A (zh) * 2019-06-27 2019-09-27 广州华多网络科技有限公司 页面加载时长的检测方法、装置、设备和存储介质
CN110781437A (zh) * 2019-10-28 2020-02-11 北京字节跳动网络技术有限公司 网页图像加载时长的获取方法、装置及电子设备

Family Cites Families (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20060218490A1 (en) * 2005-03-24 2006-09-28 Richard Fink Method and apparatus for creating a web page
WO2008052059A2 (en) * 2006-10-25 2008-05-02 Gomez, Inc. Methods and apparatus for real user monitoring
US9009296B1 (en) * 2009-08-07 2015-04-14 Google Inc. System and method of determining latency
EP2495670B1 (en) * 2010-11-29 2019-08-07 Hughes Network Systems, LLC Computer networking system and method with javascript execution for pre-fetching content from dynamically-generated url and javascript injection to modify date or random number calculation
US10002117B1 (en) * 2013-10-24 2018-06-19 Google Llc Translating annotation tags into suggested markup
US9971844B2 (en) * 2014-01-30 2018-05-15 Apple Inc. Adaptive image loading
CN106598821B (zh) * 2015-10-14 2020-11-17 腾讯科技（深圳）有限公司 网页加载速度的测试方法及装置
US10868881B1 (en) * 2015-12-30 2020-12-15 Mingtai Chang Loading web resources using remote resource pushing
US10291738B1 (en) * 2016-01-21 2019-05-14 Instart Logic, Inc. Speculative prefetch of resources across page loads
CN109766256B (zh) * 2018-12-21 2023-02-07 中国平安财产保险股份有限公司 应用程序中h5页面性能测试方法、装置和计算机设备

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20190095408A1 (en) * 2014-12-31 2019-03-28 Quantum Metric, LLC Accurate and efficient recording of user experience, gui changes and user interaction events on a remote web document
CN109039715A (zh) * 2018-07-17 2018-12-18 中国联合网络通信集团有限公司 用户网页浏览体验评估方法及系统、网络基站配置方法
CN109815089A (zh) * 2019-01-16 2019-05-28 中国平安财产保险股份有限公司 H5页面监控方法、装置、计算机设备和存储介质
CN110287441A (zh) * 2019-06-27 2019-09-27 广州华多网络科技有限公司 页面加载时长的检测方法、装置、设备和存储介质
CN110781437A (zh) * 2019-10-28 2020-02-11 北京字节跳动网络技术有限公司 网页图像加载时长的获取方法、装置及电子设备

Also Published As

Publication number Publication date
US11886798B2 (en) 2024-01-30
CN110781437A (zh) 2020-02-11
US20220374582A1 (en) 2022-11-24

Similar Documents

Publication Publication Date Title
WO2021082693A1 (zh) 网页图像加载时长的获取方法、装置及电子设备
CN111274760B (zh) 富文本数据处理方法、装置、电子设备及计算机存储介质
CN111597065B (zh) 用于采集设备信息的方法和装置
WO2021135626A1 (zh) 菜单项选择方法、装置、可读介质及电子设备
WO2021249196A1 (zh) 视频播放方法、装置、存储介质和电子设备
US20230353515A1 (en) Information display method and apparatus, and electronic device
WO2021190129A1 (zh) 页面处理方法、装置、电子设备及计算机可读存储介质
US11861381B2 (en) Icon updating method and apparatus, and electronic device
CN111258736B (zh) 信息处理方法、装置和电子设备
CN112269959B (zh) 展示内容的控制方法、装置、可读介质和电子设备
WO2022199376A1 (zh) 内容的打印方法、装置、设备及存储介质
WO2022233311A1 (zh) 展示方法、装置和电子设备
WO2021082600A1 (zh) 网页图像的监控方法、装置、电子设备及计算机可读存储介质
CN116225600A (zh) 应用程序录制方法、回放方法、装置、介质及电子设备
CN112954056B (zh) 监控数据处理方法、装置、电子设备及存储介质
WO2021082599A1 (zh) 网页图像的监控方法、装置、电子设备及计算机可读存储介质
CN113050942A (zh) 页面生成方法、装置、可读介质及电子设备
CN111209205B (zh) 配置方法、装置和电子设备
CN110855655B (zh) 一种信息验证方法、装置、设备和存储介质
CN109408387B (zh) 页面测试方法及装置
CN111708680A (zh) 报错信息解析方法、装置、电子设备及存储介质
CN116662193A (zh) 页面测试方法和装置
WO2023045694A1 (zh) 数据传输方法、装置、可读介质及电子设备
WO2022218028A1 (zh) 页面加载方法、装置、设备及存储介质
WO2022206287A1 (zh) 商服交互方法、装置、设备及存储介质

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 20880492

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 20880492

Country of ref document: EP

Kind code of ref document: A1

32PN Ep: public notification in the ep bulletin as address of the adressee cannot be established

Free format text: NOTING OF LOSS OF RIGHTS PURSUANT TO RULE 112(1) EPC (EPO FORM 1205A DATED 310822)

122 Ep: pct application non-entry in european phase

Ref document number: 20880492

Country of ref document: EP

Kind code of ref document: A1