Closed Yuisei-Maruyama closed 2 years ago
現行の実装では、各ラベルごとのIssueの内容をクエリで各ラベル名を指定した形で API を叩いて、取得する実装になっている。
const eachIssues = useCallback(async () => { const labelNames = ['Todo', 'Doing', 'Closed'] await labelNames.forEach(async (labelName: string) => { await request.get(`/repos/${owner}/${repo}/issues?labels=${labelName}&state=all`).then((res: { data: any }) => { if (labelName === 'Todo' && !todoItems?.length) { const payload = convertIssueId(res.data) setTodo(payload) } if (labelName === 'Doing' && !doingItems?.length) { const payload = convertIssueId(res.data) setDoing(payload) } if (labelName === 'Closed' && !closedItems?.length) { const payload = convertIssueId(res.data) setClosed(payload) } }) }) }, [todoItems, doingItems, closedItems])
これでは、パフォーマンスとして良くなく、無駄にレンダリングが発生してしまっているため、一度、全ての Issue の情報を取ってきた上でその情報をもとに各Issueラベルのitemsに格納するように実装を書き換える必要がある。
レンダリング回数を6回に抑えるように実装。
現行の実装では、各ラベルごとのIssueの内容をクエリで各ラベル名を指定した形で API を叩いて、取得する実装になっている。
これでは、パフォーマンスとして良くなく、無駄にレンダリングが発生してしまっているため、一度、全ての Issue の情報を取ってきた上でその情報をもとに各Issueラベルのitemsに格納するように実装を書き換える必要がある。