CLIENT CLEANUP: 2020 Recap & What’s Ahead

We’re recapping 2020's progress and going over plans for 2021.
Dev

We've made a commitment to share recurring updates on the work we're doing to improve the performance and reliability of the League Client.

Today's update is the sixth blog in the series. (See the first, the second, the third, fourth, and fifth here.)

TL;DR: We spent 2020 improving client start up time, architecture, champ select, end of game, memory leaks / client crashes and bug-fixing. We're in the middle of planning for Q1 2021, with a core focus on improving the social panel and continuing to improve the overall stability of the client.


2020 Recap

Our team formed late in 2019, and a lot of our early work was going through the process of understanding the state of the League Client. As a part of that process, we decided to focus on which parts of the client players globally (all of you!) were most vocal about to determine what we work on to make the client better. We still have work to do, but looking back at 2020, we were able to make meaningful improvements to the Client.

  • Launched our global client player survey, which we use to determine what to work on. Most accomplishments you see below are a result of what players wanted to see addressed.
  • We got client bootstrap (startup) time down to 16 seconds for 90 percent of players globally (from 29.5 seconds at the start of 2020).
    • This was accomplished by architecture work, including a 63% reduction in bootstrap ember apps (ones that load on client start-up), and a 57% reduction in plugins within the client. In other words, we cleaned up a bunch of code.
  • Improved the responsiveness and reliability of champ select when picking and banning champions
    • Fixed performance issues while filtering through champions, and made improvements to the champ select grid itself
    • Investigated the usage of certain features in Champ Select. We'll talk more about this below.
    • Improved time to lock-in & ban champions
    • Fixed memory leaks in and around Champ Select (highlighted below)
  • Addressed the client completely freezing and black-screening when players return to it via the End of Game (EOG) flow after a game ends
  • Addressed the client hanging on the ‘Reconnect’ button during EOG, when it shouldn't have showed up at all
  • 175 bugs fixed in 2020, ranging from small stuff to issues that've been around forever.
    • Player names showing as “...” in chat
    • Taskbar not lighting up when receiving a message in chat
    • New players missing the Social Panel
    • Settings resetting when a player logs on from a different computer
    • Gift notifications repeating on login
    • Players returning to a black home screen after various actions in the client
  • Improved responsiveness of the Collections tab and each of its sub-sections
  • Reduced the Runes tab loading time by 40%, made the Runes interface smoother and more reliable to use
  • Addressed 30 memory leaks across the client. This is a particularly difficult area we discovered later in the year so we're especially happy we were able to ship improvements before the holidays.
    • Memory leaks are caused when a part of the program fails to release it’s memory after completing a task. This leaves less overall memory for other programs running on the system. The compounding results are always bad, but the causes are notoriously difficult to pin down, especially in large applications.
    • Prior to our first memory leak fixes in 10.23, players in Riot regions experienced 193,000 out-of-memory crashes each patch. By the last patch of 2020, patch 10.25, we saw a 55% drop in these crashes!

As we mentioned, we used your responses to the global client survey to guide decisions on where to focus our efforts. The above improvements represent progress in the areas you were most vocal about, but ultimately this only matters if you all feel things are moving in the right direction. That's why we're happy to report that, in addition to game-based metrics, we've seen positive survey trends across the board, meaning more and more players are feeling a less frustrating client experience!

...Less frustrating. We still have a lot of things to accomplish this year, and we'll continue to provide updates.


Low-Use Champ Select features

If you had a chance to read our previous post, we mentioned we were investigating removing some low-use Champ Select features to improve overall performance. After evaluating favorites, missions, and emotes, we decided against removing any of them and will instead work on optimizing them. We've already fixed an issue with emotes, and are currently working on making sure favorites and missions are working as expected.


What’s on deck

We're currently finishing up planning for the first quarter of the year, but here's what we currently aim to address next for the League Client:

Social Panel

We've seen an uptick in issues regarding the social panel over the course of last year. In December, we fixed an issue where hovercards for friends in-game weren't displaying the game type or champion. Here are the next issues we plan to address:

  1. Social panel not connecting
  2. Friends list not loading, incorrect status being displayed, friends not populating
  3. Player won't be sent a friend request if their friend list is full
  4. Ranked information disappears from hovercard when a player is in a normal game
  5. Chat stutters when typing messages in quick succession
  6. Folders reorder themselves between sessions
  7. LoR and Valorant folders go missing when sorting by "Group Games & Servers"
  8. Clicking ‘Show Dates” in chat box will cause text boxes to overlap
  9. Friend Request notification only appears when the option is toggled off, and vice-versa

We're also going to deprecate an old Javascript framework (more on JS in a sec) and move the social panel entirely to ember. That transition is a good opportunity to go through and clean up rough spots in the code, leading to more reliability and fewer bugs.

Client Stability

We're now going to introduce two new focus areas for improving League Client stability: Client crashes and Javascript errors, which can have any number of effects, including.... client crashes. Rather than focus on a specific portion of the client for this work (ex. champ select, client bootstrap), we're taking a broad approach across the client. Together with the stability work we were already prioritizing, here are the four different buckets:

  • Reducing crashes: In patch 10.25, players across 16 Riot regions experienced 2.2 million client crashes. After our initial investigation, it seems the best option for us to address the majority of crashes is to upgrade our version of Chromium. This is the web browser at the heart of the League Client's architecture.
  • Reducing Javascript errors: In Patch 10.25, players across 16 Riot Regions experienced 36 million Javascript (JS) errors in the client. While not all JS errors result in a crash or performance hit, even invisible errors can eventually stack up, leading to those bigger types of impacts. Driving this number down will lead to a range of benefits across the client.
  • Continue to fix memory leaks: Fixing some of these were a big win for us last year. We want to keep big-winning this year.
  • Continued architecture work to clean up our codebase: To upgrade Chromium as mentioned above, we have to complete a bunch of prerequisite work which, itself, will further improve client performance. We plan to complete this work and kick off a Chromium upgrade by the middle of the year or so.
    • The last time we updated Chromium was December 2019, a few months before the Client Cleanup Campaign kicked off. We saw good results from that upgrade (CTRL+F "Chromium") and we'll highlight the improvements that come with this next upgrade once we're closer to launching it.

We appreciate the feedback we continually receive around the client, and we are listening! We had a good 2020, and are going to continue with the high momentum to improve the client for our players!