2 September 2010

OS X:Using Web Kit for HTTP, Website Analysis and Network Testing

Safari (or Webkit) has a neat debugging feature built in. It is available in both OS X and Windows versions. When testing performance of websites through application inspection on firewalls or load balancer it can be a useful tool to get visibility.
Step 1 – Open Safari (I recommend you use Webkit) and then open the Preferences Menu, Choose Advanced and tick the “Show Develop Menu in the menu bar”. Now you will see an extra Menu option in the toolbar “Develop”. See below:

webkit-analysis-5.jpg

Close the preferences windows.

Step 2 – open the web page that you want to analyse in the usual way. I recommend http://etherealmind.com :-)

Step 3 – Open the Develop menu, select “Disable Caches” (since local caching in the browser will interfere with accurate testing), and then select “Show Web Inspector”

webkit-analysis-6.jpg

This will open the Web Inspector is a separate Windows (if it is blank, you didn’t open a web page after enabling the Developers menu). It should look something like this:

webkit-analysis-7.jpg

In the bottom left hand corner, you will see square with a dark line at the bottom. Clicking this will anchor the Network timeline inside the web page:

webkit-analysis-3.jpg

Evaluating performance

By hovering over a single element you can see how long it took for your web server to establish the connection. In the picture below, it took 10.07s for the first connection (far too long) and 612 milliseconds to complete the HTTP request.

webkit-analysis-8.jpg

Selecting the element will show the contents of the request, and you can also look at the HTTP Header.

webkit-analysis-9.jpg

Some things that you should look for

Check the size of the TOTAL download and the check the different elements for size.. Sometimes developers use the wrong image and you can see a multi-megabit image that takes tens of seconds to download.

Check the elements as listed and make sure they are what you are expecting. Sometimes websites call external elements that are broken and can slow down the performance.

Check the latency of the connection request and the response. If the latency is high, think about whether that is packet delay or the firewall/load balancer causing that delay.

Please rate this post:

1 Star - It\\\'s Crud2 Stars - It\\\'s Tosh3 Stars - Something\\\'s missing4 Stars - Needs works5 Stars - Good Enough6 Stars - Good7 Stars - Excellent8 Stars - Brilliant9 Stars - Astonishing10 Stars - Awesomely Godlike? (No Ratings Yet)
Loading ... Loading ...

About Greg Ferro
Greg is a Network and Security Architect / Designer / Engineer working freelance in the UK and worked for Resellers, DotCom's, Large Corporate's and Service Providers across a variety of products & Vendors. He prefers to work for end users, believes in the life cycle, total cost of ownership and that near enough is often good enough. He likes talking about himself in the first person to feel "royal", even when hosting the Packet Pushers Podcast on Data Networking. More about Greg at http://etherealmind.com/who-am-i/ and you can follow him on Twitter.

Speak Your Mind

*