BFF - Backend for Frontend - Pattern in Microservices
Say, we are launching an e-commerce website that people can use from their desktop and place orders. We want to render the product details that include - name, description, sellers, variants, reviews, and FAQs. The site did well, and now we decide to launch a mobile app.
Given that the mobile has limited real estate, it is very hard to render the same information that we do on the Web. Hence, we choose not to render Reviews and FAQs. Thus, even if we receive the reviews and FAQs in the response, while rendering we choose not to render them.
This is a waste of user bandwidth, data, and processing power. Ideally, we should not be sending unnecessary fields from the backend. So, how do we implement this?
Backend for Frontend
BFF is a layer that sits between the clients and the backend. Every type of client has a dedicated BFF; for example, Desktop Web has its own BFF, while Mobile has its own.
Depending on the request, the BFF then talks to the backend, grabs the data, filters out the unnecessary fields, and responds. It can also optionally transform the data in a client-specific format.
This way, we keep the backend simple and apply all presentation-level hacks and tweaks to BFF.
BFF and Microservices
BFF acts as a perfect abstraction for underlying microservices. For an API, it can connect to necessary microservices, gather the responses, and respond. This ensures that we are not fetching data that we don't need.
For example, Given compatibility and constraints, a Desktop BFF can talk to Orders, Sellers, and Reviews Services, while a Mobile BFF can talk to Orders, Sellers, and AR services to respond to the same API endpoint.
Advantages
Disadvantages
领英推荐
Adopting BFF
We should adopt BFF when
Here's the video of my explaining this in-depth ?? do check it out
Thank you so much for reading ?? If you found this helpful, do spread the word about it on social media; it would mean the world to me.
If you liked this short essay, you might also like my courses on
I teach an interactive course on System Design where you'll learn how to intuitively design scalable systems. The course will help you
I have compressed my ~10 years of work experience into this course, and aim to accelerate your engineering growth 100x. To date, the course is trusted by 800+ engineers from 11 different countries and here you can find what they say about the course.
Together, we will dissect and build some amazing systems and understand the intricate details. You can find the week-by-week curriculum and topics, testimonials, and other information at https://arpitbhayani.me/masterclass.
Chief Technology Officer, Entrepreneur, Technology & Business Consultant
1 年WunderGraph as an OpenSource project is targeted for BFF Patterns - we started a site to work towards documenting various patterns that exist using BFF at an API level. https://bff-patterns.com
SDE @ Jio Plaforms | 2+ years exp | Backend Development | Node.js | Java | API Design & Security | Microservices & REST APIs | System Integration | Problem Solving |
2 年Wish we had more such Engineers making content about such interesting real life problems rather than making same DSA sheets again and again. ?? Thank you very much Sir.?
Software Engineering - LMTS at Salesforce
2 年Nicely explained ?? Just curious - the GraphQL also would solve the same problem?
Software Engineer 2 | React JS | Javascript | Node JS | Express JS | AWS | MongoDB
2 年Very well explained!!!
More about me: arpitbhayani.me Newsletter: arpitbhayani.me/newsletter Subscribe #AsliEngineering for such in-depth engineering concepts: https://www.youtube.com/c/ArpitBhayani My System Design course: arpitbhayani.me/masterclass