What is a Backend of Frontend and why is it popular ?

In the Backends for Frontends (BFF) pattern, a dedicated backend service is allocated for each distinct frontend or client type. This strategic approach enables the optimization of the backend to align precisely with the unique requirements and user experience specifications of each specific frontend interface. Implementing Backends for Frontends enhances overall system efficiency and responsiveness, ensuring tailored solutions for diverse user interactions. [Source]
It boils down to the following simple problems
Have a backend that servers the interface for your frontend clients so the actual logic can be changed.
Separate domain logic from client communication logic.
Allows for optimizations.
The backend logic and APIs can change without impacting client.
Since clients do not talk to backends directly, you can keep changing your backends as you please. Client updates are expensive. Server updated are cheap. This means if you change your backend apis or introduce new microservices, you can simply change your backend for frontend logic without changing the APIs that face the app clients.
Source of truth business logic is separated for frontend logic
Business logic is often driven by business needs, laws and hard truths. For example an API that is supposed to return to you your bank balance must always return an amount which is accurate. Everyone using this API knows this expectation. However for say privacy reasons you might not want to render the amount on the screen, may be you want to show only last 3 digits as such.
If you do not have backend for frontend, where do you place this logic ? You might have to place it in the client code where you fetch the real amount but chose not to show it. This is unsafe and harder to update the logic. Also if you have 4 different type of frontends this logic gets repeated at 4 different places.
A backend for frontend might fetch you bank balance from the backend but then chose to render it differently to the client. This means your backend does not have to worry about what client is showing and the client apps can be really dumb and show whatever the API call returned.
This principle is sometimes called "separation of concerns".