Adfin | Smoother, smarter, sleeker: Adfin’s ongoing UI evolution

Adfin has been rapidly growing in the past months. The entirety of it is the grace of both fantastic management and engineering. Today we will talk about our frontend engineering team at Adfin.

Introduction

What makes building the user interface for our platform unique is the rapid pace of product change and development. Time to market is critical. At the same time, Product Quality and User Experience are non-negotiable at Adfin. We don’t cut corners.

As a result, our frontend engineers must carefully balance speed with the right level of effort when building new features and interfaces.

Diving deeper

So, how do we actually achieve that? Teamwork plays a significant role in our success, and our approach is closely aligned with DORA (DevOps Research and Assessment) principles: we place a strong emphasis on minimising lead times and increasing deployment frequency, whilst maintaining the reliability of our product and reducing mean time to restore when incidents occur.

Most crucially, this is only possible with the support of our management team at Adfin. Championing a culture of autonomy and ownership, our management team enables engineers to work in the way top performers in our industry should operate.

For example, when it comes to writing code (more specifically building our React components), we always choose to create reusable components. Rather than reaching for overly abstract or generic components that attempt to solve multiple use cases at once, we prioritise simplicity. This allows us to keep our codebase maintainable, reduce duplication, and make future changes faster and safer.

Concrete example

Over the past few months, Adfin has quickly evolved from using slightly modified Material components, which bundled both logic and styling, to building its own components using headless solutions with a proprietary look and feel.

One such migration is our table component, which was recently launched into the live environment in our last release.

The story of our previous table started on August 13th, 2024. At the time it was built entirely with Material UI’s Data Grid component only. We managed to keep it live until a few days ago, when we decided to rebuild it with TanStack’s Table, in order to support resizeable columns and sub-rows for our upcoming payouts dashboard updates.

Having rebuilt the table ourselves, I can personally say that building a table is hard.

Would this have been feasible back in August 2024? Not really. As Adfin was growing fast, we were releasing new features every week (and I mean, full-fledged features, not just a new modal or input here and there).

And… would Adfin have needed a custom table at the time? Not at all, and it is why it’s only now, almost a year later that we’ve built it. Once again, time to market is critical, and building a table component would have taken one of our engineers 1–2 weeks (instead of launching at least two full features in the same timeframe!).

Wrap up!

Our intentional focus on keeping things simple is driven by the fact that we’re operating in a rapidly evolving environment. Our components are designed to solve today’s needs, not hypothetical ones. However, if an engineer can anticipate future use cases without adding significant complexity, they’re encouraged to account for it and implement it. Conversely, if the win is very small, and the effort is very large, we will not do it.

Clear, pragmatic code wins every time. Timing is key for Adfin, and we’re going to keep employing strategic choices in our product development cycle.

‍

Smoother, smarter, sleeker: Adfin’s ongoing UI evolution

Read more

Meet Sergiu Dinu, our new AI Engineer

Meet Lena Gryn, our new Head of Product Design

Nicola Hageman swapped faceless tools for support that listens