Improving UX with Performance Optimization
This past week, we focused on speeding up the app and making it more responsive for our users. General slowness and “freezes” have been the biggest complaint from our beta users, so we wanted to try and tackle this before we added any new features. While speed and responsiveness is a challenge for any app, it can be even more difficult when building hybrid web/native apps like PowrLine. The hybrid development strategy has many advantages (such as being to push updates without our users needing to download them), but this does come at a cost to general performance.
Thankfully, we were able to find many ways to optimize PowrLine and greatly increase the speed at which it opens, loads, and handles user interaction. There were two main areas of speed and responsiveness we focused on: Initial app load time and post-initial load data display time. All speed tests were performed using PowrLine on an Iphone 11 Pro.
Initial App Load Time
PowrLine’s initial app load time (the time it takes to open the app from a cold inactive state on the phone) was ~16 seconds before we started optimizing. Once that app has been initialized, it loads instantly when opened just like any other app, until the user force closes it completely. However, with new updates going out 2-3 nights a week, our users are having to re-initialize PowrLine pretty regularly, so this metric is and will be important for a while.
We also measured the time it took to open the app from a cold state, navigate to a conversation, and reply to a contact (this being a common action to take when opening the app cold). Before optimization, this action took ~36 seconds to complete. By comparison, Google Voice loads from a cold state in ~1.5 seconds, and cold open to reply to contact can be done in ~5 seconds. To sum it up, PowrLine was “trip to the dentist” slow.
We started our load-time optimization by consolidating 60+ top-level app groups (divs) down into just 22 (and lazy loading all but 4 of them). We also added strategic load limits to data lists (conversations, contacts, messages, calls ets) so instead of loading all items, only the first 15-30 items are loaded until the users scrolls or otherwise indicate they need to see older items.
With these optimizations, PowrLine’s initial load time was decreased to just ~3.5 seconds. Additionally, the cold open app to reply can be completed in ~10 seconds as seen in the provided gif. Though these speeds aren’t quite up there with our slighter-better funded competition, we’re certainly in the neighborhood and well within our users’ expectations for an early stage beta.
Post-Initial Load Data Display Time
This speed metric refers to how quickly data is displayed to the user after requesting it through the UI (tapping on a contact, conversation, call, etc). The two areas in which this is most important are: Conversations and Activity Hubs. These two areas of the app slide out into view when requested by the user. Before optimizing, these two “overlays” would often take ~3 seconds to display a conversation and ~7 seconds to display an activity hub. While Google Voice doesn’t have an activity hub, it’s conversation overlay displays the requested conversations instantly and this is generally what people expect when they open a text conversation, whether it be on their regular phone or in an app.
We carefully picked through every element and line of code we used to build the conversation and activity hub overlays, and were able to simplify and improve much of the logic being used to display each activity or message item to the user. As a result, we were able to get both overlays to load their data instantly like Google Voice. Sometimes, if a conversation or activity hub for a specific contact hasn’t been opened since the last time the app was initialized, there will still be ~1 second of loading/reformatting, but this only happens the first time and sometimes not at all. You can see this ~1 second initial load happening in the first gif of the cold open to reply action.
Best Devices for PowrLine
Despite these improvements, PowrLine runs best on higher-end phones less than 3 years old, and on iPhones. Due to the hybrid app approach and the large amount of data being displayed/handled by the app, PowrLine is pretty slow on older or cheaper phones, especially Android phones. We do hope to optimize Powrline to the point of being lightening fast on almost all devices, but this isn’t a priority at this point in our beta.
