Worldwide access to the World Wide Web has led to organizations and businesses using web sites as a means to provide information to customers. With faster network speeds to access web sites and increased content on the Web, the performance and speed of operation and navigation of web sites may be important to web site owners. Network providers wish to quantify the performance of web sites and improve the operation and trouble shooting of web sites. While performance management software may be used to collect diagnostic data on web site performance, an administrator or other engineering staff may lack tools for analyzing the diagnostic information and identifying the source of performance problems or mitigate the effects of performance problems.
Various embodiments of the present invention are directed to a method including performing operations follows on a processor. The operations include receiving a user selection of a content item on a web page in a web browser executing on a device, determining a selection time associated with the user selection of the content item, identifying, based on the selection time, a page bucket for a web resource associated with the content item that was selected, associating the web resource with the page bucket that was identified, and communicating, to a network operator, performance information associated with the web page based on the page bucket.
In some embodiments, the method may include determining an occurrence of a route change based on whether a second web address associated with the user selection of the content item is different from a first web address that was used before the user selection of the content item. The identifying the page bucket may further include identifying the page bucket based on a route time associated with the route change. Responsive to a lack of the occurrence of the route change, the processor may perform operations including inspecting an element associated with the content item, determining the selection time based on the element associated with content item, and creating the page bucket for the web resource.
In some embodiments, inspecting the element may include responsive to the receiving the user selection, walking a hierarchy associated with the content item, identifying a single page application (SPA) tag in the hierarchy, and creating the page bucket for the web resource, responsive to the identifying the SPA tag. Identifying the page bucket may include identifying the page bucket associated with the selection time, responsive to a determination that the page bucket associated with the selection time exists, creating a new page bucket, responsive to a determination that page bucket associated with the selection time does not exist, and identifying the new page bucket as the page bucket for the web resource associated with the content item that was selected.
In some embodiments, method may include recording the selection time associated with the user selection, determining that a new page bucket is needed, responsive to the selection time associated with the content item, determining a current time, that is later than the selection time, for creating the new page bucket, creating the new page bucket at the current time, responsive to the determining that the new page bucket is needed, and associating the new page bucket with the selection time that was recorded. Associating the new page bucket with the selection time may include associating the new page bucket with the selection time that was recorded, responsive to a difference in the current time and the selection time being less than a threshold time. Determining that the new page bucket is needed may occur responsive to identification of a single page application (SPA) tag in a hierarchy associated with the content item.
In some embodiments, web resource information associated with the web resource may be in a resource table. The method may include assigning the web resource information that is in a resource table to the page bucket, based on a timestamp associated with the web resource information that is in the resource table. Assigning the web resource information may occur at a harvest time that is after the current time. Assigning the web resource may be based on a periodic polling time interval. The performance information associated with the web page may include performance information associated with the web resource information that was assigned to the page bucket.
In some embodiments, performance information associated with the web page may be organized in a hierarchical structure before being communicated to the network operator. The page bucket may be one of a plurality of page buckets. Identifying the page bucket may include performing a binary search on respective ones of selection times associated with the plurality of page buckets to determine the page bucket for the web resource.
Various embodiments described herein can provide an electronic device including a processor and a memory coupled to the processor and comprising computer readable program code embodied in the memory that when executed by the processor causes the processor to perform operations including receiving a user selection of a content item on a web page in a web browser executing on a device, determining a selection time associated with the user selection of the content item, identifying, based on the selection time, a page bucket for a web resource associated with the content item that was selected, associating the web resource with the page bucket that was identified, and communicating, to a network operator, performance information associated with the web page based on the page bucket.
Various embodiments described herein can provide a computer program product, including a non-transitory computer readable storage medium storing computer readable program code which when executed by a processor of an electronic device causes the processor to perform operations including receiving a user selection of a content item on a web page in a web browser executing on a device, determining a selection time associated with the user selection of the content item, identifying, based on the selection time, a page bucket for a web resource associated with the content item that was selected, associating the web resource with the page bucket that was identified, and communicating, to a network operator, performance information associated with the web page based on the page bucket.
It is noted that aspects described with respect to one embodiment may be incorporated in different embodiments although not specifically described relative thereto. That is, all embodiments and/or features of any embodiments can be combined in any way and/or combination. Moreover, other methods, systems, articles of manufacture, and/or computer program products according to embodiments of the inventive subject matter will be or become apparent to one with skill in the art upon review of the following drawings and detailed description. It is intended that all such additional systems, methods, articles of manufacture, and/or computer program products be included within this description, be within the scope of the present inventive subject matter, and be protected by the accompanying claims. It is further intended that all embodiments disclosed herein can be implemented separately or combined in any way and/or combination.
Other features of embodiments will be more readily understood from the following detailed description of specific embodiments thereof when read in conjunction with the accompanying drawings, in which:
In the following detailed description, numerous specific details are set forth to provide a thorough understanding of embodiments of the present disclosure. However, it will be understood by those skilled in the art that the present invention may be practiced without these specific details. In some instances, well-known methods, procedures, components and circuits have not been described in detail so as not to obscure the present disclosure. It is intended that all embodiments disclosed herein can be implemented separately or combined in any way and/or combination. Aspects described with respect to one embodiment may be incorporated in different embodiments although not specifically described relative thereto. That is, all embodiments and/or features of any embodiments can be combined in any way and/or combination.
Businesses, applications, organizations, and/or groups use web pages as an interface to users. Ubiquitous availability of computers and/or mobile devices provide access to most persons worldwide to a web browser capable of connecting to the internet and accessing websites associated with businesses, applications, organizations, and/or groups. Websites may include numerous web pages that each provides different information to users. Some websites may have a separate web page for each use case, such as a home page (home.html), products page (products.html), about page (about.html), etc. These separate pages may be referred to as hard pages. Some websites do not navigate from web page to web page. These websites may have a single hard page such as, for example, index.html, and dynamically changing content within that page. This dynamic content may be used to update the information on the screen, but it may also be used to change the view of the page entirely. For example, when a user navigates from the home page to the products page the page content changes, but the Uniform Resource Locator (URL) may remain at index.html. This type of web page is often referred to as a single page application (SPA) and navigation to different “pages” (such as home or products) would still occur on the URL index.html. These pages within a single page application may be referred to as soft pages. Additionally, in some embodiments, a hard page may occur, on navigation to a different page may not occur. As a non-limiting example, navigation may proceed to a hard page such as index.html. The web server may choose to respond with specific content when the domain is accessed, but not necessarily with a specific file. As a non-limiting example, the domain www.<domain>.com may include soft page references to the domain page. Soft pages such as www.<domain>.com/softpage1 or www.<domain>.com/softpage2 may be referenced to the www.<domain>.com main page.
Soft pages may present challenges for network operators with respect to performance measurements and identification of poorly performing sections of the website. Various embodiments described herein may arise from a recognition that web page resources associated with web pages may be correlated to user selections, such as clicks on a web page. Specifically, the web page resources may be correlated with time intervals associated with user selections. Therefore, these soft pages may be sorted into logical pages or grouping buckets (i.e. page buckets) to accumulate performance measurements. Additionally, supporting web resources for the soft pages, such as scripts, CSS, images, etc, will then be associated/correlated to the logical page/soft page.
A single page application may include hundreds or even thousands of supporting resources likes scripts, images, CSS files, etc. Various embodiments described herein identify the logical soft pages and correlate resources for each soft page. These techniques may provide a superior organization structure for performance information, which may be beneficial when providing the performance information within a visualization interface to a network operator. Ultimately, increased organization of the performance data may enable a network operator to efficiently perform root cause analysis of poor web page performance.
Referring now to
User selections, such as user mouse click events, may be watched on some or all web page components in order to keep track of the last user selection time/click time. The mouse click by itself may not be sufficient to determine a route change pertaining to a change in the URL. Therefore, a route change may be also monitored since some single page applications trigger on route change events. In some cases, browsers may start downloading resources before a route change is triggered by an event such as a JavaScript event listener call back. A potential problem may occur in these cases since the JavaScript performance resources table may have start time entries prior to a new soft page being loaded. Therefore, when creating a page bucket for the logical soft page, there may be a bias to use the user's selection/click time, which likely was initiated by the route change. Using the user's selection time may be more accurate as long as the click happens sometime earlier in time than the route change time and within some tolerable threshold such as, for example, a threshold time no greater than 1000 msec. By enforcing the threshold time, a stale client click time will not be used, which may occur in cases, such as if the mouse click call back could not be registered on some or all web page components.
Referring now to
If a page bucket has not been previously created for a particular web page a new page bucket may be created. The page bucket is used to associate web resources associated with a particular web page that was accessed based on a user selection. Web resources may include any resources that support the web page such as files, images, scripts, or calls to data via asynchronous web applications such as Asynchronous JavaScript and XML (AJAX). These web resources may be entered into a resource table when they are downloaded, executed, and/or called. The resource table may be harvested at different points in time after creation of the page bucket in order to associate resource table entries such as the web resources with the page bucket.
Implementation of the concepts described herein may include a Document Object Model (DOM), which is a cross-platform and language-independent application programming interface that treats a HTML, XHTML, or XML document as a tree structure wherein each node is an object representing a part of the document. Asynchronous web applications such as Asynchronous Javascript and XML (AJAX) may be used on the web page. Asynchronous Javascript and XML (AJAX) is a set of web development techniques using many web technologies on the client side to create asynchronous web applications. With AJAX, web applications may send and/or retrieve data from a server asynchronously in the background without interfering with the display and behavior of the existing web page. By decoupling the data interchange layer from the presentation layer, AJAX allows for web pages, and by extension web applications, to change content dynamically without the need to reload the entire page. In practice, modern implementations commonly substitute JavaScript Object Notation (JSON) for XML due to the advantages of JSON being native to JavaScript.
The resource table, which may include web resources used by AJAX calls, may be harvested by periodic polling. In a non-limiting example, JavaScript resources (performance.getEntriesByType(“resource”)) may be polled on a regular interval. The entries in the resource table include a start time of when the web resource started to be downloaded after the user clicked on the web page. The start times may be based on the JavaScript object DOMHighResTimeStamp, which may be an offset from the navigation start time of the page that is obtained via performance.timing.navigationStart. The navigation start time of the page may be when the page was opened by the user. Summing the two aforementioned time values may provide a result that can be used to determine which page bucket the web resource should be associated to.
Web table harvesting, according to various embodiments described herein, may be used to provide information related to web page navigation to a network operator and/or data center operator. Information regarding the performance of various web pages and/or web resources may be provided to a client in batches at suitable time intervals. For example, the performance information may be in a Javascript Object Notation (JSON) format and periodically sent to the network operator.
In some embodiments, since there could be hundreds or thousands of web resources in the resource table, efficiently accomplishing harvesting of the resource table may include performing a binary search of the page bucket start times to find an appropriate page bucket for a given web resource. If an index into the binary search of the web sources results in nothing being found, a negative number may be returned by the search. If a positive number is returned from the search, adding 1 and dropping the sign may result in an appropriate location where the item should be inserted.
Still referring to
The web resources of the resource table 510 of
Still referring to
A working example will now be discussed in detail to aid in understanding the operations discussed with respect to
Another working HTML source code example is now provided. <md-tab-item tabindex=“−1” class=“md-tab ng-scope ng-isolate-scope md-active” style=“max-width: 1589px” ng-repeat=“tab in $mdTabsCtrl.tabs” role=“tab” aria-controls=“tab-content-0” aria-selected=“true” aria-disabled=“false” ng-click=“$mdTabsCtrl.select(tab.getIndex( ))” ng-class=“{‘md-active’: tab.isActive( ), ‘md-focused’: tab.hasFocus( ), ‘md-disabled’: tab.scope.disabled}” ng-disabled=“tab.scope.disabled” md-swipe-left=“$mdTabsCtrl.nextPage( )” md-swipe-right=“$mdTabsCtrl.previousPage( )” md-tabs-template=“::tab.label” md-scope=“::tab.parent”><span class=“ng-scope”>Home</span></md-tab-item>.
In this example, “Home” is designed to be a soft page where the URL does not change in the browser display bar. The HTML element “span” is nested under the element “md-tab-item”. In some embodiments described herein, when a user selects a content item on the web page, the click to all HTML elements will be registered. Then a walk of the hierarchy in the above HTML code example will occur, looking for the elements of interest. If the user clicks and an md-tab-item is found, a new page bucket may be created. If the user clicks span element, which is not an out of box item, the walk of the hierarchy proceed to its' parents in the hierarchy. In this case, the parent of span is md-tab-item, such that the walking is exited and a new page bucket is created. This walking of the parents in the hierarchy continues to a top level element. If the two previous conditions did not result in creating a new page bucket, extension/custom code may be utilized to determine if the element should trigger a new page bucket. In additional scenario where nothing substantive on the web page was clicked by the user, no new bucket would be created. However, the clicking action may still cause a hierarchical walk of the parents.
The operations of
As a second example for when the URL does not change, the mouse click may be recorded by a first task as occurring at time, t. A second task may receive a clicked element notification, which triggers walking of the elements and their parents. As used herein “walking” may include traversing an element and the element's immediate parent. Walking may include repetitively traversing the immediate parent's parent and may be implemented in a variety of ways such as, for example, recursively, iteratively, etc. A single page application (SPA) tag may be identified, which explicitly triggers an onpopstate function call. A call is then made to add a new page bucket with current time=t+20 ms A call is made to determineEventTime (lastUserClickTime) which will return time t.
Referring now to
Referring now to
Referring now to
Referring now to
Referring now to
Referring now to
Referring now to
Referring now to
The processor 1830 may include one or more data processing circuits, such as a general purpose and/or special purpose processor (e.g., microprocessor and/or digital signal processor) that may be collocated or distributed across one or more networks. The processor 1830 is configured to execute computer program code 1812 in the memory 1810, described as a non-transitory computer readable medium, to perform at least some of the operations described herein as being performed by an electronic device. The computer program code 1812 when executed by the processor 1830 causes the processor 1830 to perform operations in accordance with one or more embodiments disclosed herein for the electronic device 1800. The electronic device 1800 may further include a user input interface 1820 (e.g., touch screen, keyboard, keypad, mouse, etc.) and/or a display device 1822.
In the above-description of various embodiments of the present disclosure, aspects of the present disclosure may be illustrated and described herein in any of a number of patentable classes or contexts including any new and useful process, machine, manufacture, or composition of matter, or any new and useful improvement thereof. Accordingly, aspects of the present disclosure may be implemented entirely hardware, entirely software (including firmware, resident software, micro-code, etc.) or combining software and hardware implementation that may all generally be referred to herein as a “circuit,” “module,” “component” or “system.” Furthermore, aspects of the present disclosure may take the form of a computer program product comprising one or more computer readable media having computer readable program code embodied thereon.
Any combination of one or more computer readable media may be used. The computer readable media may be a computer readable signal medium or a computer readable storage medium. A computer readable storage medium may be, for example, but not limited to, an electronic, magnetic, optical, electromagnetic, or semiconductor system, apparatus, or device, or any suitable combination of the foregoing. More specific examples (a non-exhaustive list) of the computer readable storage medium would include the following: a portable computer diskette, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or Flash memory), an appropriate optical fiber with a repeater, a portable compact disc read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the foregoing. In the context of this document, a computer readable storage medium may be any tangible medium that can contain, or store a program for use by or in connection with an instruction execution system, apparatus, or device.
A computer readable signal medium may include a propagated data signal with computer readable program code embodied therein, for example, in baseband or as part of a carrier wave. Such a propagated signal may take any of a variety of forms, including, but not limited to, electro-magnetic, optical, or any suitable combination thereof. A computer readable signal medium may be any computer readable medium that is not a computer readable storage medium and that can communicate, propagate, or transport a program for use by or in connection with an instruction execution system, apparatus, or device. Program code embodied on a computer readable signal medium may be transmitted using any appropriate medium, including but not limited to wireless, wireline, optical fiber cable, RF, etc., or any suitable combination of the foregoing.
Computer program code for carrying out operations for aspects of the present disclosure may be written in any combination of one or more programming languages, including an object oriented programming language such as Java, JavaScript, Scala, Smalltalk, Eiffel, JADE, Emerald, C++, C#, VB.NET, Python or the like, conventional procedural programming languages, such as the “C” programming language, Visual Basic, Fortran 2003, Perl, COBOL 2002, PHP, ABAP, LabVIEW, dynamic programming languages, such as Python, Ruby and Groovy, or other programming languages. The program code may execute entirely on the user's computer, partly on the user's computer, as a stand-alone software package, partly on the user's computer and partly on a remote computer or entirely on the remote computer or server. In the latter scenario, the remote computer may be connected to the user's computer through any type of network, including a local area network (LAN) or a wide area network (WAN), or the connection may be made to an external computer (for example, through the Internet using an Internet Service Provider) or in a cloud computing environment or offered as a service such as a Software as a Service (SaaS).
Aspects of the present disclosure are described herein with reference to flowchart illustrations and/or block diagrams of methods, apparatus (systems), and computer program products according to embodiments of the disclosure. It will be understood that each block of the flowchart illustrations and/or block diagrams, and combinations of blocks in the flowchart illustrations and/or block diagrams, can be implemented by computer program instructions. These computer program instructions may be provided to a processor of a general purpose computer, special purpose computer, or other programmable data processing apparatus to produce a machine, such that the instructions, which execute via the processor of the computer or other programmable instruction execution apparatus, create a mechanism for implementing the functions/acts specified in the flowchart and/or block diagram block or blocks.
These computer program instructions may also be stored in a computer readable medium that when executed can direct a computer, other programmable data processing apparatus, or other devices to function in a particular manner, such that the instructions, when stored in the computer readable medium, produce an article of manufacture including instructions which when executed, cause a computer to implement the function/act specified in the flowchart and/or block diagram block or blocks. The computer program instructions may also be loaded onto a computer, other programmable instruction execution apparatus, or other devices to cause a series of operational steps to be performed on the computer, other programmable apparatuses or other devices to produce a computer implemented process such that the instructions which execute on the computer or other programmable apparatus provide processes for implementing the functions/acts specified in the flowchart and/or block diagram block or blocks.
The flowchart and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of systems, methods, and computer program products according to various aspects of the present disclosure. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams and/or flowchart illustration, and combinations of blocks in the block diagrams and/or flowchart illustration, can be implemented by special purpose hardware-based systems that perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.
The terminology used herein is for the purpose of describing particular aspects only and is not intended to be limiting of the disclosure. As used herein, the singular forms “a”, “an” and “the” are intended to include the plural forms as well, unless the context clearly indicates otherwise. It will be further understood that the terms “comprises” and/or “comprising,” when used in this specification, specify the presence of stated features, integers, steps, operations, elements, and/or components, but do not preclude the presence or addition of one or more other features, integers, steps, operations, elements, components, and/or groups thereof. As used herein, the term “and/or” includes any and all combinations of one or more of the associated listed items. Like reference numbers signify like elements throughout the description of the figures.
It will be understood that, although the terms “first,” “second,” etc. may be used herein to describe various elements, these elements should not be limited by these terms. These terms are only used to distinguish one element from another. Thus, a first element could be termed a second element without departing from the teachings of the inventive subject matter.
Unless otherwise defined, all terms (including technical and scientific terms) used herein have the same meaning as commonly understood by one of ordinary skill in the art to which this inventive concept belongs. It will be further understood that terms, such as those defined in commonly used dictionaries, should be interpreted as having a meaning that is consistent with their meaning in the context of the relevant art and this specification and will not be interpreted in an idealized or overly formal sense unless expressly so defined herein.
The description of the present disclosure has been presented for purposes of illustration and description, but is not intended to be exhaustive or limited to the disclosure in the form disclosed. Many modifications and variations will be apparent to those of ordinary skill in the art without departing from the scope and spirit of the disclosure. The aspects of the disclosure herein were chosen and described to best explain the principles of the disclosure and the practical application, and to enable others of ordinary skill in the art to understand the disclosure with various modifications as are suited to the particular use contemplated.