Hi!
When I am opening my homepage, it started refreshing several times.
I decided to run diagnostic the page and here are the results:
I opened the "This page has 27 calls to SharePoint" tab and noticed several duplicate calls to the API.
Could you tell me please if exceeding the number of recommended calls can lead to a page refreshing?
And what do these APIs mean?
https://abc.sharepoint.com/sites/ABC/_api/web/GetClientSideComponents
@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?
