Excessive interface requests are one of the main performance bottlenecks of the Web front-end, and interface merging is a necessity. The interface design of the background has its existing granularity, adding additional combined interfaces for each functional scene is a huge workload, and the scene is difficult to cover. Add a proxy server close to the interface server and define a set of rules for interface merging. The proxy server parses the rules sent by the front end, sends close-range requests to the interface server, and returns after merging.

First, the dilemma of Web development

In Web development, it is not uncommon for the front-end to continuously request multiple interfaces in order to implement one function. Then (step2). Then (step3) (Promise syntax). In Figure 2, step1,step2,step3, although there is no dependency relationship, However, it also needs to interact with apI-server three times. In web applications, every second of waiting means one more copy is lost.

You may complain to your colleagues at the back end why they don’t merge these interfaces, but they will retort: “you need step1->step2->step3 for this scenario, step1->step2 for that page, and even step1 for some pages, how can I merge them for you?” You can continue to say, you can provide three of these interfaces, then the backend colleagues may directly crash, such a scenario how many, add a scene to add an interface, the backend has to send a version.

Interface merging scheme of proxy service

  • PNG proxy-server. PNG and apI-server should be as close as possible. Deploy them on servers in the same equipment room and network segment, or even on the same server. Increase server hardware performance; Load balancing cluster; These are all effective means of “short” network links
  • The front and back ends agree on a set of interface merging rules. The proxy service only needs to resolve the rules and request the merging. Once the deployment remains stable, the initiative of interface merging is controlled by the front end, which can freely combine the merging rules according to the change of scenarios
  • The proxy service and the interface service use the same HTTP/HTTPS protocol. There is no dependency on the interface server, and there is no problem with the front-end directly requesting the interface server. In other words: the old access mode is not affected at all.

Why does this combination greatly improve interface access speed

For a scenario that requires access to three dependent interfaces (figure 1) : The front end of the traditional direct request interface to the server, the front-end with server interaction is equivalent to need three times “distance” (why do you say the front directly connected server considered “distance”, because there is no guarantee that the status of the front-end network, often only for mobile terminal equipment in the 3 g / 4 g under the network environment, and mobile terminal hardware performance is not dominant, And a serial wait is required; Use a proxy server way, however, the front only need to walk a long way “tell the rules to the proxy server, proxy server with it of class interface server to three times the data again (proxy server with interface server access speed is often much higher than the front directly interact with the server access speed, not an order of magnitude)

I deployed the ApI-Server and the Node implementation using the above proxy scheme (FreedomAPI, more on that later) on the same server. The interface server provided two dependent serial interfaces. Mobile phones were used to test the traditional direct connection mode and the merging interface mode of proxy service under different networks, and the test results were as follows:

As can be seen from the figure, in three network environments, the access speed of proxy merger is significantly higher than that of traditional direct connection, and the worse the network condition is, the more obvious it is

Definition of rules

Please click freedom – API

Iv. Online interface process testing tool based on Freedom-API

Please click Facemagic