Using Charles Proxy to Optimize Mobile App Performance（手机抓包工具）

原文地址：https://blog.safaribooksonline.com/2012/11/18/using-charles-proxy-to-optimize-mobile-app-performance/

内容比较简单，不需要翻译了。

下载地址：http://download.csdn.net/detail/mtt1987/7747155

Registered name: anthony ortolani

License key: a4036b2761c9583fda（好孩子看不到）

With today’s metered data plans and intolerance for slow apps, mobile app users are very sensitive to excessive data consumption and underperformance.

Even a well-functioning app can have underlying inefficiencies, and a great way to fully understand your app’s data usage pattern is by running all its traffic through an HTTP proxy like Charles.
When connected to the proxy you can complete tasks as a user would, to see exactly what’s being requested by your app, what’s being returned by the servers, and even the server response times.

Set up a Charles environment

(NOTE: Device and PC must be on the same Wi-Fi network)

On your computer:

Download and run Charles
Go To Help -> Local IP and write down the IP Address
If you use SSL for your data requests:

Go to Proxy -> Proxy Settings -> SSL -> Check “Enable SSL” and add the host and port for your requests
You may also want to disable Desktop and web proxies from the Proxy dropdown so you can better isolate your app traffic

On your device:

Install the Charles SSL Certificate on your device, visit one of these URLs on your device, and accept the security warning:

iOS: http://charles.noodlewerk.com/
Android: http://charlesproxy.com/charles.crt

Configure Device

For Android: go to Settings -> Wifi -> Tap and hold wi-fi SSID -> Modify Network -> Show advanced Options -> Proxy Settings -> Manual

Server = IP address from Step 2
Port = 8888

For iOS: go to Settings -> Wi-Fi -> (>) button for Wifi SSID -> Proxy=Manual ->

Server = IP address from Step 2
Port = 8888

You might want to turn off cellular data to ensure all traffic is run through Wi-Fi/Charles Proxy

NOTE: If you quit Charles the device will have no connection until you undo the items in step 2b or 2c.

Fire it up

Launch Charles and switch to the “sequence” tab in the top window to see each call and status as they are made in real-time, including response size and duration. Click on a request to view details in the bottom pane including: Overview, Request, Response
& Summary.

Make sure you explore the options for the different data types. For example, if your response is an image, you can see the actual image and dimensions. If your app consumes JSON, you have a choice of a JSON Tree Navigator, or you can “copy response” by right-clicking
the request in the top “Sequence” tab. Paste the results into something like http://www.uize.com/examples/json-prettifier.html for
easy-to-read output.

I typically start with a fresh install of my application to ensure nothing is being read from the cache and that all data comes from the server, and then I start a new session. Here’s my list of some things to consider to ensure data transfer is optimized and
the app doesn’t have to work harder than is necessary:

Things to check during app launch

Is your app making a reasonable amount of data requests to balance startup time and pre-fetching, to speed up “next pages”?
Is any request fetching more data than necessary?
Are the response times high due to server configuration or a poorly performing backend?

Things to check during app usage

Is there a common navigation path that is slow and could benefit from pre-fetching at launch?
Is data actually coming from the cache rather than initiating a new data request?
Is any tracking data being sent (e.g. Omniture, Google Analytics, or other third-party services), and if so is it sent properly ?
Are there any requests being made erroneously or repeatedly due to a coding error?
If you serve video, is the proper encoding/format selected? (Charles can throttle speeds to mimic wireless phone connections.)
Are images appropriately sized for the device?

More Resources:

http://www.charlesproxy.com/