Mogami Facts

Tech Stack

  • Backend: Kotlin, Spring, JUnit, Flyway, GraphQL
  • DB: PostgreSQL 10.0, Jooq
  • Frontend: TS, React, Enzyme + Jest
  • DevOps: Docker, Kubernetes, Terraform
  • Computing: Google Cloud

Methodology, Tools

  • PMS: Club House
  • Design: Figma
  • Documentation: Google Docs, Storybook & Bitbucket

Overview

The client has a team of professionals that worked for PayPal, T-Mobile, Uber, LinkedIn, and Samsung, and built over 10 businesses. With Mogami, our client aims at improving the way people save and spend their money, through an effective tool for guided personal finance. Since the start, they had a great vision to build a complete financial planning application for current and future needs without any hassles such as appointments, fees, and unnecessary jargon.

SPD Group’s partnership with Mogami started many years back in 2013. While working on a startup, Co-Founder and CTO of the project, Sasha Ovsiankin, worked with us and for his new startup, he invited our team to take over remote software development.

In the first iteration of this project, the web-only application was successfully developed by our team. In September 2019, the client planned to build an entirely new application from scratch and hired our team for the job. Initially, the app faced some architectural limitations, that made it difficult to add new features and scaleup, thus not contributing to the vision of the client. One of the main reasons for this remake is based on a decision by Chief Technical Officer to shift to mobile platforms and was not a part of the original application.

Business Goals

The main goal of this business is to develop a modern Progressive Wen Application, that would allow a user, regardless of age, net worth or assets, to make an effective personal finance plan, achieve their goals and obtain great results. The application must cover various aspects of life, including suggestions on vacation savings, educational goals, daily expenses, and retirement plans. Our team was given the responsibility to build a Progressive Web Application to offer users this functionality and the best customer experience.

Technical Challenges

The app’s performance became the biggest challenge of the project. The app needed personal banking information of all the users for transaction analysis to offer a comprehensive financial advice. Before the incorporation of the banking integration feature, all went well. However, allowing users to connect their profiles with bank accounts, slowed down the app’s performance dramatically. The slow loading of multiple screens in the app became a major issue.

Solution

The old application was built using React and Java. that got shut down completely in 2018 and switched to the Progressive Web Application approach. PWA allows evading App Store and Google Play, and is feasible to set it up on the user’s desktop. This is a tab for a website, but looks like an app on mobile devices for the end-user. The client decided that PWA is ideal for the project.

As mentioned earlier, the biggest obstacle for the second iteration of the app is performance lags. To deal with this, our team implemented a microservice architecture, separating financial business logic from core application processes.

To track the exact cause of the performance problem, we used the logs. Our team tracked the time taken for the same request post a quick check-up, bank integration, and addition of pay stubs to compare the time of execution. The request time for each profile’s task on the localhost was 26-30ms, however, in production, for the actual users, this number was as high as 175-200ms. Repository execution time was also higher at production between 5-15ms compared to 5-8ms at localhost.

Logs helped us understand that there were problems with certain elements in the profile. We discovered that the performance was slowing down immediately at the repository level once pay stubs were added. Because we were decrypting them for each request when a profile was needed. The plan was to move pay stubs and job info out of the profile and call them with fetchers to avoid changing of graphQL schema.

We decided to extract problematic elements from the profile as separated entities. Each entity became represented by a table. We extracted each entity with the help of fetchers. It solved the problem of overall application performance when pay stubs connected.

Mogami Case Study

This caused changes in a lot of files, and many of them needed to switch the place of taking and storing paychecks and bank info from profile to a repository, but these changes were necessary and became the first steps after extracting transactions for refactoring profile.

 Results

Our team from SPD Group managed to build an entirely new application from scratch, release it and improve its performance thanks to the request optimization. Here is how the interface of an application looks like.

Mogami Interface

The client is highly satisfied with the performance of our team, but there is still a lot of work yet to be done. As of June 2021, we continue our collaboration with Mogami in testing and the feature improvement process. The next big goal we have in mind is to wrap up React code of an app into React Native and place it in Google Play. We will start this process sometime in the near future and shall describe it in great detail in one of our next articles

Testimonials

“SPD-Ukraine has done a great job of maintaining the lifeblood of their codes. They’re transparent with prices and deliver within budget. Their dedicated team acts as an extension of the partner’s company. Responsibility and a committed long-term partnership are two hallmarks of their work.”
— Alex Samano, Co-Founder & CEO, Life Dreams Inc.

ARE YOU INTERESTED IN DEVELOPING A PROGRESSIVE WEB APPLICATION?

Contact our experts to get a free consultation and time&budget estimate for your project.

Contact Us
Roman Chuprina Technical journalist at SPD Group, covering AI/ML, IoT, and Blockchain topics with articles and interviews. July 20, 2021