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

Safari (or Webkit) has a neat debug­ging fea­ture built in. It is avail­able in both OS X and Windows ver­sions. When test­ing per­form­ance of web­sites through applic­a­tion inspec­tion on fire­walls or load bal­an­cer it can be a use­ful tool to get vis­ib­il­ity.
Step 1 — Open Safari (I recom­mend 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 tool­bar “Develop”. See below:

Close the pref­er­ences windows.

Step 2 — open the web page that you want to ana­lyse in the usual way. I recom­mend http://​eth​er​e​al​mind​.com

Step 3 — Open the Develop menu, select “Disable Caches” (since local cach­ing in the browser will inter­fere with accur­ate test­ing), and then select “Show Web Inspector”

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

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

Evaluating per­form­ance

By hov­er­ing over a single ele­ment you can see how long it took for your web server to estab­lish the con­nec­tion. In the pic­ture below, it took 10.07s for the first con­nec­tion (far too long) and 612 mil­li­seconds to com­plete the HTTP request.

Selecting the ele­ment will show the con­tents of the request, and you can also look at the HTTP Header.

Some things that you should look for

Check the size of the TOTAL down­load and the check the dif­fer­ent ele­ments 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 ele­ments as lis­ted and make sure they are what you are expect­ing. Sometimes web­sites call external ele­ments that are broken and can slow down the performance.

Check the latency of the con­nec­tion request and the response. If the latency is high, think about whether that is packet delay or the firewall/​load bal­an­cer caus­ing that delay.

Please rate this post:

(No Ratings Yet)

 Loading ...