Micro Frontends Patterns#11: Edge Side Composition

Edge Side Composition is a technology that combines content at the edge layer, such as CDN.

Edge Side Composition here is assumed to be a process that assembles and renders Fragments at the Edge Side.

Edge Side Includes

The ESI in the previous section can be a kind of Edge Side Composition.

Edge Side Rendering

In this section, SSR running on the Edge Side are called Edge Side Rendering. For example, Edge Side Rendering with Next.js using Lambda@Edge and Serverless Framework, Edge Side Rendering with Cloudflare Workers using a framework called Flareact.

The Edge Side FaaS can take care of the dynamic Backends that the server is usually in charge of, and can also deliver the static content.

Pros and Cons

Pros

As the name suggests, Edge Side Composition does not require any server resources for composition. Since everything is done on the Edge Side, there is no need to prepare and manage a computing environment for a simple rendering server. Also, in terms of latency, since it delivers just static contents on the Edge Side, it will have an advantage over a simple Node server.

There are also advantages in terms of scaling. For example, when using SSR with React, the nature of Node.js can cause CPU-bound. Edge Side Composition is designed for serverless computing environments, so it reduces the need for infrastructure scaling considerations. In addition, AWS Lambda, for example, scales horizontally on a per-request basis, so the possibility of CPU-bound can be reduced as well.

Cons

We will use some kind of FaaS actually. Because it is managed service, its quota can be a disadvantage. For example, in AWS Lambda, the following limitations exist;

• Timeout - 15 minutes, 5 seconds for Viewer and 30 seconds for Origin in Lambda Edge
• Response size - 6MB, 40KB for Viewer and 1MB for Origin in Lambda Edge
• Size of the function itself - 50MB, 1MB for Viewer and 50MB for Origin in Lambda Edge

For example, in terms of function size, it is necessary to compactly package modules related to rendering. Also, when using configuration management tools such as CloudFormation, you need to consider the limit on the number of resources and the design of IaC. Cold start is another point that needs to be considered. Thus, when using FaaS, it will be necessary to investigate and agree in advance whether it will meet the actual application requirements.

If you don't want to be bothered by the above limitations, you might want to consider an architecture such as Fargate + CDN, or scaling with ECS or EKS in the first place.

Summary

Edge Side Composition is a dream architecture that gives JAMstack the weapon of a computing environment, but I think it needs to be used with a good understanding.