This week, we will pay attention to the systems performance of your software. This includes the running time, bandwidth, battery consumption, and storage. Often, we have to make a decision to trade off between these different resources (e.g., use up more storage to reduce bandwidth). Which resource to optimize depends on what is the most valuable. In software that interacts with users, often we want to minimize the waiting time.
There are some straight forward ways of reducing Web page load time, including reducing image size, remove redundant CSS, minimize your JS, etc. Rather than these, We will focus on optimization that requires deep CS background.
Don’t think about optimization before you start coding. Make the code work first, and then find out where is the bottleneck, and remove the bottleneck.
If the performance is reasonable – do this after you have most of the features implemented. If even you cannot stand how slow your code is, you can optimize now.
Profiling involves running the code and collect usage statistics during run-time. This typically gives you the time taken to call a function (or to execute a line) plus the number of times a function/a line has been executed. Looking at the data, we might identify bottleneck within our code.
silk
.node
has built-in profiler. First run node
with --prof
to create a profiler’s output, then run with --prof-process
to produce human readable results. v8-profiler
and node-inspector
are useful as well.xdebug
and xhprof
XCode
and Android Studio
comes with built-in profiler to instrument your code.
Once you find the bottleneck, you need to analyze the code and interaction between components to see what is dragging the performance.
Here are some of the common performance issues to pay attention to:
As part of your project, you should profile your code and find the bottleneck (if any) and show how your optimize the code. Here is a sample section from CS3281/2 Team Polaris, AY 14/15
We have been looking at making the software run faster. But often, for software components that interact with the users, it is enough to make it feel faster.
Make sure that page load is less than one second, and feedback to interaction (e.g., clicking a button) is less than 1s.
People who wait passively overestimate their waiting time by 36%. So keep users active/occupied while waiting. (e.g., start video playback while video is loading; preload the next page while user is still in the current page).
Example, starts video playback while downloading. Render Web components that are downloaded first.
Show users how long they will be waiting.
Explain to the users what is going on.
At least meet the waiting time of your competitors.
Make your software more useful.
Sometimes, making users wait would make them feel that the service they get is more valuable. (Here’s an example of a placebo progress bar)