The page exceeds the baseline number of recommended calls to SharePoint.

ganeshsanap Yes, I'm using graph api to get users from Azure AD and render at the webpart. 

public getAllUsers(): Promise<Array<Person>> {
    return graph
      .users
      .select("givenName", "surname", "employeeHireDate", "id", "userPrincipalName", "jobTitle", "companyName",  "createdDateTime")
      .get({
        headers: { ConsistencyLevel: "eventual" }
      })
      .then((usersList) => {
        return usersList.map((item: any) => {
          return {
            id: item.id,
            firstName: item.givenName,
            lastName: item.surname,
            email: item.userPrincipalName,
            userId: Number(item.id),
            eventDate: moment(item.createdDateTime),
            eventType: "New Arrival",
            type: "newcomer",
            jobTitle: item.jobTitle,
            photoUrl: `${this._ctx.pageContext.web.absoluteUrl}/_layouts/15/userphoto.aspx?size=M&accountname=${item.userPrincipalName}`,
          };
        });
      });
  }

This service I initialized in webpart .ts :

public onInit(): Promise<void> {
    return super.onInit().then(_ => {
      sp.setup({
        spfxContext: this.context as any
      });
    });
  }

  public render(): void {
    const service = new PersonService(this.properties.timeIntervalToDisplay, this.context);
    const element: React.ReactElement<INewComersProps> = React.createElement(
      NewComers,
      {
        description: this.properties.description,
        context: this.context,
        service: service,
        profilePageUrl: this.properties.profilePageUrl,
        person: this.properties.person,
        title: this.properties.title,
        seeAllLink: this.properties.showAllLink,
        showAll: this.properties.showAll,
        isOpenInNewTab: this.properties.shouldOpenNewTab,
        displayNumber: this.properties.numberOfItemsToDisplay
      }
    );
    ReactDom.render(element, this.domElement);
  }

And in the component I call this service and set values in the componentDidMount():

public componentDidMount(): void {
    this.loadData().then(data => {
      this.setState({
        items: data,
        isLoaded: true
      });
    }).catch(error => { console.error(error); });
  }

private loadData(): Promise<Array<Person>> {
    return this.props.service.getAllUsers().then((result: Array<Person>) => {
      return result.sort((b, a) => a.eventDate.valueOf() - b.eventDate.valueOf());
    });
  }

 I have only one request after loading the page.

Strange then, why is the diagnostic showing multiple calls to this api /_api/web/GetClientSideComponents?