Efficiency and Velocity: How Duolingo Adopted MVVM on Android

Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on reddit

[ad_1]


Posted by Kateryna Semenova, Android Developer Relations Engineer

illustration of hand holding up a chart with the Duolingo bird sitting on top

Government Abstract

Duolingo’s app started to expertise rising pains as a result of scalability points of their Android software program structure. They have been in a position to resolve these efficiency issues and regain developer productiveness, by refactoring to a Mannequin-View-ViewModel structure and utilizing Android Jetpack’s Dagger and Hilt for dependency injection. To study extra about how this impacted their enterprise, learn the accompanying article right here.

Introduction

Duolingo is the world’s hottest language studying app, with over ten million day by day learners, as a result of they’ve managed to make one thing folks discovered daunting really feel straightforward and enjoyable. This continued success depends on a continuing stream of improvements and updates — and a smooth-running app that may ship all of them. To Duolingo, a single unresponsive app in a tool wherever on the earth might imply a learner doubtlessly discouraged. This commits them to app excellence, significantly on the Android units utilized by sixty p.c of their learners, together with their CEO, who retains monitor of the app from an entry-level cellphone. And so, when Duolingo’s Android improvement workforce registered a rise in “App not Responding” errors, dropped frames — and even obtained a hand-written grievance — they took motion instantly.

Their scenario wasn’t that unusual. Apps that lack scalable structure and clear finest practices typically carry out effectively originally however present indicators of technical debt as they develop. Duolingo’s Android codebase was designed to permit them so as to add and launch new options quickly, however the lack of an agreed-upon structure was manifesting in more and more frequent efficiency regressions. It was beginning to undergo from unreliable body charges, visually inconsistent or damaged interactions, and a rising assortment of recent bugs. These regressions not solely inconvenienced learners but in addition price the workforce substantial improvement effort to diagnose and restore. Duolingo’s Android improvement workforce realized that in the event that they wished to maintain transport new options whereas offering the goal degree of consumer expertise, a brand new strategy to their codebase was wanted.

Discovery

First, they needed to resolve what precisely was happening. A deep dive into the numbers uncovered that, as they added new performance, the app’s rendering efficiency was regressing 5-10% each month. In reality, one significantly unwieldy launch had elevated crashes by 10%, slowed body renders by 25%, and noticed classes beginning 70% slower on entry-level units.

Additional evaluation of their code led them to the conclusion that many of the app’s points could possibly be traced again to a single bottleneck: a world state object referred to as DuoState, which was accountable for sustaining state throughout totally different options of the app. Plenty of widespread options (like expertise factors and day by day streak monitoring) have been utilizing it to entry very important info. Centralizing their knowledge on this method had as soon as enabled the workforce to iterate quickly. They merely added properties to DuoState each time a brand new function wanted to share info throughout the app. However now the unoptimized and frequent entry to the thing was inflicting rising efficiency regressions.

DuoState was so tightly coupled to the whole codebase that even small adjustments might affect the remainder of the app. The workforce feared {that a} minor new function might have the unexpected facet impact of triggering many inside updates to the app, inflicting the whole launch to be too sluggish for a lot of units. These efficiency regressions grew to become extra frequent because the app grew, and the workforce onboarded new engineers to maintain up with the accelerating product roadmap. In 2020, as they added extra builders, they have been beginning to see vital regressions cropping up as typically as each 90 days. Upon nearer inspection, the chance of a regression in a given launch was proportional to the variety of adjustments it applied. At this fee, these regressions would fully derail the product roadmap inside just a few years.

This outdated structure had develop into a bottleneck for each the efficiency of the app and the speed of the workforce. After a lot inside debate, they stopped improvement of recent options, together with some intently tied to their backside line. For 2 full months, Duolingo’s improvement workforce went all-in on refactoring their Android app in an effort they referred to as the “Android Reboot”.

The Android Reboot

One of many workforce’s first key takeaways was that their code lacked clear boundaries. The DuoState object was available at any level within the code, inviting builders to entry it continuously in inefficient methods. They wanted to create a higher separation of issues throughout the codebase. They determined to tease aside every function into its personal, clearly-defined module, utilizing the Mannequin-View-ViewModel architectural sample. MVVM allowed them to take away calls to the monolithic DuoState object, letting many modules work in separate threads.

Diagram showing before and after implementing the Model-View-ViewModel architectural pattern

The workforce’s familiarity with MVVM, and Google’s help for it, made it an apparent alternative. It allowed them to obviously doc what logic ought to go into what recordsdata (together with views, view fashions and repositories). This helped make their function structure extra constant. With a transparent path to observe, the workforce rapidly started refactoring their monolithic code into units of courses with clear boundaries and duties.

Together with MVVM, the workforce used Dagger and Hilt (additionally included in Android Jetpack) to implement repository patterns to interchange DuoState. Dagger generates clear readable code that gives verbose error logging designed to assist builders perceive precisely what their code is doing, eliminating useless stack traces to mirrored properties; and Hilt reduces the quantity of boilerplate code wanted to put in writing for this.

This new structure allowed the workforce to separate DuoState into smaller objects. This instantly decreased pointless coupling between domains. For instance, the code accountable for monitoring a consumer’s progress might now entry their expertise factors however not the variety of occasions they’ve logged in throughout a month. These new structure tips meant that whereas no single factor was too tough to vary, it took coordination and planning to vary it throughout the app. Implementing the brand new structure throughout the code base drove vital efficiency good points in combination.

MVVM structure facilitates a separation of issues between the area knowledge, the interface the learners see, and the logic for the way these two realms work together. It gave Duolingo’s builders a extra deliberate approach to management how the app responds to inside state updates. They might now develop extra advanced consumer experiences with out the danger of triggering regressions, or affecting the underlying enterprise guidelines.

Developer Productiveness

Previously, inconsistent utility of improvement patterns made totally different components of the codebase tougher to know and preserve. With out consensus, every developer applied code as they noticed match.

MVVM, Dagger, and Hilt, offered the workforce with a extra detailed understanding of how new options ought to be applied. Following these finest practices made the code simpler and extra predictable. Builders might now help in debugging options that they hadn’t initially labored on. And new builders could possibly be onboarded extra effectively; so long as they understood the structure, they might contribute meaningfully immediately. This new readability considerably boosted the workforce’s improvement velocity.

Making certain High quality

Crucially, the brand new structure additionally revealed that sure animation options within the app have been underperforming on entry-level units. Accordingly, the opposite core focus of the Android Reboot was the discount of jank, dropped frames, and “App Not Responding” (ANR) errors. The workforce used repository patterns to assist streamline the sharing of knowledge between threads. These patterns ensured that they might extra effectively use machine sources with a number of threaded modules. Transferring work off the primary thread improved responsiveness, total body fee, and led to smoother animations on entry-level units. Efficiency on flagship units improved as effectively.

A Higher General Android Expertise

Within the six months working with the brand new structure, Duolingo’s Android workforce has continued to ship new options with out recording vital efficiency regressions. The times the place they needed to halt function manufacturing to hunt and repair bugs are safely behind them.

The app’s day by day ANR fee dropped 41%. The share of time that the app’s body fee fell under goal decreased by 28%. And importantly, customers skilled a 40% improve in velocity when scrolling by classes, the leaderboard, and tales within the app.

The reboot allowed Duolingo to persistently present their trademark enjoyable, efficient, and pleasant language studying expertise on a a lot wider vary of Android units.

Conclusion

Duolingo’s dedication to their mission made them the world’s prime app within the language studying house. Their dedication to app excellence — creating innovative instructional experiences with out compromising accessibility — is what stored them there.

For those who’re occupied with getting your workforce on board to your personal Android Reboot, try our condensed case research for product house owners and executives linked right here.

Supply feedproxy.google.com

Recent Posts