Backend for Frontend (BFF): how to improve efficiency and scalability in your application architecture?

  

  • Short version
  1. Backend For Frontend (BFF) is a microservice design pattern that allows us to consider access to our services from specific user interfaces with specific needs.
  2. The use of a BFF can help solve problems of scalability, complexity and efficiency in backend management in applications with multiple clients or frontend devices.
  3. Its benefits are accompanied by challenges that will have a greater or lesser impact, depending on the solution and context that we are addressing.

  

  • Longer version

 

What is a BFF?

Backend For Frontend (BFF) is a microservices design pattern that allows us to establish an intermediate layer of communication between our client application and our backends, providing a specific API for the target user interface (UI), as well as improving performance and security. This in order to be able to satisfy specific needs of some type of user interface (for example: a web application, a mobile application, IOT devices, etc.).

  

What problem does a BFF come to solve?

In the beginning, having an API that satisfies certain needs for a single type of user interface is fine. But as the business grows, for example, the data initially provided in our API, may not be entirely useful for a new one that can be added to our list of user interfaces.

bff-vs-api

Here is a list of some the problems that we can find in a scenario like this and some others when we work with an API in general:

  1. Redundant data: It refers to the fact that more data is obtained than what we will end up using.

  2. Security issues: APIs can be vulnerable to security attacks, such as denial-of-service (DDoS) attacks or malicious code injection attacks.

  3. Availability issues: APIs can experience interruptions in service, which can affect the functionality of applications that depend on them.

  4. API Changes: There is a possibility that our API initially encountered an XML data transfer type and now we need it to be in JSON format.

  5. Cost issues: APIs can incur costs associated with the use of processing, storage, and bandwidth resources. If the application is used intensively, it can generate high costs for the organization that implements it.

The BFF comes to propose a solution to the problem of complexity and inflexibility in building modern applications, allowing developers to build backend APIs specific to the needs of the user interface (UI) and providing greater security and scalability.

  

Advantages and disadvantages of using a BFF

 

Advantages

  1. Improve user experience: Using a BFF allows developers to adapt and customize the user experience for different devices and platforms, thereby improving the end user experience. In addition, the BFF can help improve the loading speed and responsiveness of the application, which also contributes to a better user experience.

  2. Enhanced security: Better security can be achieved by hiding the complexity of the back-end and allowing control of data access through the front-end. In addition, security measures can be implemented to protect the application and user data.

  3. Increased development efficiency: It allows developers to work more efficiently by allowing them to create back-end APIs specific to the needs of each user interface (UI). This reduces complexity and development time, enabling developers to better adapt the application to business requirements.

  4. Improved version control: It can allow more control over app versions (especially in mobile apps, where you would have more control over releases), which can make managing updates easier.

  5. Better maintainability: By using this pattern, developers can more easily and efficiently maintain and update back-end APIs specific to the needs of each user interface (UI). This can improve the long-term maintainability of the application and reduce maintenance and support costs.

Disadvantages

  1. Increased complexity: Using a BFF adds an extra layer of abstraction to your application, which can increase complexity. This can make the app difficult to understand and maintain, especially for smaller or less experienced development teams.

  2. Higher cost: A higher investment may be required, especially in the initial stages, in terms of time and resources for the development, monitoring and maintenance of the application. This can be a disadvantage, especially for smaller projects with a limited budget.

  3. Code duplication: When there is a BFF for each UI type in an enterprise, it is very likely that duplication will be generated in the different code implementations within these BFFs.

  4. Increased latency: As there is an additional layer of communication between the UI and the backend, there is a chance that you will experience a slight increase in latency due to this new network hop.

  5. Increased development time: Building and maintaining a BFF can take more time and effort than creating a traditional back-end API. This can delay the implementation of new functionality or delay the delivery of the overall project if not managed correctly.

  

7 steps to build and implement a BFF in your project successfully

  1. Identify application requirements and assess team members: Before you begin building the BFF, it is important to identify your specific application requirements and user interface (UI) needs. This will help determine what features must be present in the BFF. Likewise, it is suggested that the team that would participate in the development and/or maintenance of the BFF should already begin to be evaluated and/or defined.

  2. Select the right technology: Once the application requirements have been identified, the right technology must be selected to build the BFF. This may include the use of frameworks such as Express, Flask, or Spring, as well as programming languages such as JavaScript, Python, Java or others. In addition to the choice of programming language, it is important to also consider the use of a query language such as: GraphQL. This with the purpose of being able to optimize and customize the communication at the data level that we would have between the backend and the frontend.

  3. Design the BFF architecture: It should be designed to provide an abstraction layer between the user interface (UI) and the back-end services. The architecture must be scalable and modular to allow for easy expansion and maintenance.

  4. Implement BFF functions: After the BFF architecture is designed, application-specific functions such as authentication, authorization, and error handling must be implemented. Specific application programming interfaces (APIs) for the user interface (UI) must also be developed.

  5. Integrate the BFF with the backend services: Once the BFF functions have been implemented, it must be integrated with the backend services to provide the full functionality of the application. This may include integration with authentication services, databases, and other back-end services.

  6. Testing and debugging the BFF: Before launching your application, it is important to thoroughly test the BFF to ensure that it is working properly and that all bugs have been fixed. You must also ensure that the BFF is secure and complies with data security regulations.

  7. Launch and maintain the BFF: Finally, once the BFF has been tested and debugged, the application can be launched. It is important to perform regular maintenance on the BFF to ensure that it continues to function properly and that any problems have been fixed as they arise. These maintenance should consider aspects such as monitoring, automated tests, security patches, load tests, software updates, among others. It is worth mentioning that in this step you should already have a work team set up to maintain this BFF.

  

How to deal with the disadvantages of a BFF?

domino-mitigate-issue

Some ideas to mitigate the disadvantages of a BFF are:

  1. Complexity: It is important to document and maintain a clear design of the BFF architecture and use proven design patterns to ensure scalability and maintainability. Also, it is important to invest time in automating the implementation and deployment process of the BFF, using tools such as Kubernetes, Docker or others.

  2. Cost: For cost, I often suggest making direct but gradual changes, this means that if you have a website and a mobile app, initially starting with a BFF for just one UI type would be fine. Even in the case of mobile applications, you could start by testing with a dedicated BFF per operating system (OS), that is, a dedicated BFF per UI for Android platform and another dedicated for iOS platform; all this in order to evaluate if the impact after its implementation brings us benefits or, on the contrary, comes with more difficulties for our context.

  3. Code duplication: If we have more than one BFF to maintain, having a generic functionality library shared between both BFFs could be the solution to code duplication problems. In this section I recommend considering the rule of three as suggested by Martin Fowler in his book Refactoring, which talks about when is a good time to refactor our duplicate code.

  4. Latency: Cache, CDNs, microservices architecture, client-side caching, and data size reduction are effective ways to minimize or avoid latency when using a BFF. By applying these techniques, you can improve the performance of your application and ensure that your users have a smooth and seamless experience.

  5. Time: Code reuse, automation, focus on critical functionality, iterative development, and selecting the right tools are effective ways to minimize or avoid the increase in development time when using a BFF. By applying these techniques, you can reduce development time and costs and ensure that your application is delivered on schedule.

  

When and when not to use a BFF

Depending on business needs, a BFF might be more suitable in certain contexts than others. I summarize some in the following comparison table:

Situation to be coveredBFFAPI
small applications and/or with a single UI
security priority
development speed priority
multi-service integration
the UI between different clients varies significantly
efficient versioning and errors(bug) handling
manageable scalability
priority on quick integrations
very limited resources (time, cost, technical knowledge)
standardize communication protocol (XML, JSON)

 

Symbology

  • ✅ (Benefit) = Represents an achievable situation.
  • ❌ (Challenge) = Represents a difficult situation to obtain.

  

Final conclusions and recommendations

  1. I recommend considering using GraphQL in a BFF, because it can provide greater flexibility, reduce application complexity, improve performance, have good documentation, and be supported by a large developer community.

  2. Although there are associated costs (in several areas), I would advise evaluating its use (BFF), especially if you have a product that meets characteristics that could invite its implementation, because the investment after its use is ultimately to improve the user experience, guaranteeing consistency, satisfying their diverse and changing needs that arise after each new UI available on the market.

  3. In general, when using a BFF, it's important to make sure it's designed to meet the needs of the target UI, select the right tools, monitor performance, handle errors effectively, choose the right time to implement it, and document it properly. These recommendations can help ensure that the BFF is effective, maintainable, and beneficial to the overall project.

  

Thank you for reading 🙂

blog