add cache to the player data fetching on the player page to speedup initial page loads

src/app/(pages)/player/[...slug]/page.tsx

@@ -8,6 +8,7 @@ import { redirect } from "next/navigation";
 import { Colors } from "@/common/colors";
 import ScoreSaberPlayerScoresPageToken from "@/common/model/token/scoresaber/score-saber-player-scores-page-token";
 import { getAverageColor } from "@/common/image-utils";
+import { cache } from "react";
 
 const UNKNOWN_PLAYER = {
   title: "ScoreSaber Reloaded - Unknown Player",
@@ -30,7 +31,8 @@ type Props = {
  * @param fetchScores whether to fetch the scores
  * @returns the player data and scores
  */
-async function getPlayerData({ params }: Props, fetchScores: boolean = true) {
+const getPlayerData = cache(
+  async ({ params }: Props, fetchScores: boolean = true) => {
     const { slug } = await params;
     const id = slug[0]; // The players id
     const sort: ScoreSort = (slug[1] as ScoreSort) || "recent"; // The sorting method
@@ -55,7 +57,8 @@ async function getPlayerData({ params }: Props, fetchScores: boolean = true) {
       player: player,
       scores: scores,
     };
-}
+  },
+);
 
 export async function generateMetadata(props: Props): Promise<Metadata> {
   const { player } = await getPlayerData(props, false);