angularsymfony

First API call is slow

I made on a shared OVH hosting an API with Symfony 7 for the backend. The frontend is under Angular 18.2 Everything works fine except for the first API call which is allways slowlier than the other. here we can see the time for the API calls

I did the connector with Curl then i change for Guzzle, it has improved the response time but it is allways too slow. Initialy i did the Front with AngularJS 1.82, and so then i change to Angular 18.2 It does not improved performance but i can use modern tools like RXJS to improve API Calls.

Do you have any ideas for improving first call response time ?

Here is my adaptator code for the token creation and a simple GET Token

    public function generateCreatioToken() {
    $client = new Client();

    $options = [
        'form_params' => [
          'client_id' => $this->clientId,
          'client_secret' => $this->clientSecret,
          'grant_type' => 'client_credentials'
        ]];
    $request = new Request( 'POST', $this->oauthurl .'/connect/token', 
                            ['headers' => ['User-Agent' => null]]);
    $res = $client->sendAsync($request, $options)->wait();

    return json_decode($res->getBody());
}

Get

    /*
 * READ
 * Requête en GET sur CRM
 * $apiQuery: array dont le contenu des éléments est encodé en URL
 */
public function WSGETBPM($collection, $apiQuery, $token, $nbresult = 10000) {

    $client = new Client();
    $headers = [
      'Accept' => 'application/json; odata=verbose',
      'Authorization' => 'Bearer '.$token,
      'User-Agent' => null
    ];
    
    $targetUrl = $this->urlapi . '/0/ServiceModel/EntityDataService.svc/' . $collection;
    if (count($apiQuery) > 0) {
        $targetUrl .= '?' . implode('&', array_map(function ($item) {
            return $item[0] . '=' . $item[1];
        }, array_map(null, array_keys($apiQuery), $apiQuery)));
    }
    $request = new Request('GET', $targetUrl, $headers);
    $res = $client->sendAsync($request)->wait();
    return $res->getBody();
}

With Angular my service code:

  getOrderNumberById(orderId: string): Observable<OrderValidation> {
const options = { params: new HttpParams().set('orderId', orderId) };
return this.http.post<OrderValidation>(this.url + 'Creatio/getOrderNumberById', options).pipe(
  retry(3),
  catchError(this.handleError)
)

}

Using an interceptor:

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
const authToken = this.authService.getAuthToken();

const authReq = request.clone({
  setHeaders: {
    'Authorization': `${authToken}`,
    'Content-Type': 'application/json; charset=utf-8'
  }
})
Solution

  • On my API Adapter i added Guzzle Cache:

        $stack = HandlerStack::create();
    $stack->push(new CacheMiddleware(), 'cache');
    // Initialize the client with the handler option
    $client = new Client(['handler' => $stack]);

    In the .htaccess:

    <ifModule mod_headers.c>
    Header set Connection keep-alive
</ifModule>

    And i added a planned task which make at least an API call per hour.

    It looks good.