A walk-through shows you how to use a free Chrome extension to measure web page loading times.
You would think measuring how long it takes for a web page to load would be a trivial topic. Unfortunately, this can be anything but simple, and I'm sure those of you who tried can attest to that.
Loading a webpage involves quite a bit of network and coding interaction to present the user with a webpage within a reasonable time.
When I was teaching an onsite class, someone asked if we can use their intranet portal in our live exercises. When I asked why, he said that everyone complains about how long it takes to load the main page and blames the network. We started a Wireshark capture (since it was a Wireshark Class) and noticed that it took the webpage over 1 minute to completely load with many pauses along the way. I asked where the server was located, and they said, "one floor down in the data center.” I then asked if there are any other applications or websites on that server and they said, “yes." So right there we realized it couldn't be the network or the physical server. When we reviewed the trace, we determined that nine images were 8 to 10 MB each. Then we dug a bit deeper and found a lot of php coding errors as well as broken links. In the end, it was just a poorly designed page.
To understand where performance problems can creep in, I want to walk you through some of the high-level aspects of loading a webpage:
- You enter www.networkcomputing into your browser address bar
- Your computer needs to use ARP to resolve its router IP address to a MAC address
- Resolve the domain name to an IP address
- Load the main web page and process any php, CSS, or other commands
- As the page loads, there will be references to other domain names
- Resolve other domain names
- Rinse and repeat ;)
Load time testing
Trying to develop a consistent way to measure the load time can be tricky at best. I will walk you through a manual methodology, so you clearly see the steps involved. Understanding the methodology is helpful to use when reviewing how you may be performing this same task.
This is my methodology used from a Microsoft client computer:
- I installed the Chrome Page Load Time extension or search for Page Load Time
- Start Chrome and load the page you want to test and wait for it to load
- Clear your Chrome temporary files by pressing Ctrl+Shift+Del, check the Cached images and files and click Clear Data
- Go to command prompt as administrator and clear arp cache arp –d
- Clear DNS cache ipconfig /flushdns
- Press the Refresh icon or F5
- Record time reported by the extension
- Repeat Steps
I'm sure you can find a way to automate this process, but at that point, you might want to look into a product that does that already. If you already have a product that does this automatically, you should compare your manual results with your current or proposed solution.
In my opinion, if the methodology is repeatable and understood then your results are “right.” Many products will report different results because they measure differently, take averages, or don’t clear caches. Don’t get too caught up on trying to figure out who is right. I would rather you get comfortable and understand your solution and results.
Watch the entire process in this video: