작은 도서관
article thumbnail
Published 2025. 1. 21. 17:09
[prisma] pagination 구현 개발/개발일지

prisma에서 pagination을 구현하는 두 가지 방식을 소개한다.

prisma는 orm으로서 갖춰야 할 기능을 여러 메서드로 제공하는데, pagination은 findMany 메서드에서 구현하는 방법을 제공한다.

offset 방식

offset 방식이란 n개의 데이터를 보여줄 때, 앞에서 {skip}개 만큼 건너 뛴 데이터를 {take}개 만큼 가져오는 방식을 의미한다.

prisma.repository.findMany({
	skip: number,
    take: number
})

실제 사용할때는 skip을 take만큼 증가시키며 사용한다.(위 그림에서, 다음 skip은 7이 될 것이다) 

cursor 방식

cursor 방식이란 데이터를 보여줄 때, 특정 데이터로부터 {take}개 만큼 가져오는것을 의미한다.

위 그림에서, 9부터 27까지 가져오기 위해서 9를 cursor로 사용하고, take를 4로 사용한다.

prisma.repository.findMany({
    take: number,
    cursor: { 
    	// 여기에 cursor의 쿼리를 작성합니다.
    },
    skip: number, // cursor로부터 n개의 데이터를 건너뛰기도 가능합니다.
});

실제 사용할때는 cursor를 이전에 가져온 데이터의 마지막 데이터로 재설정하여 사용한다.(위 그림에서, 커서를 27로 사용한다.)

이 때, cursor가 데이터의 맨 앞(위 그림에서, 1)일때를 제외하고는 skip을 1로 설정하여야 하는 점에 주의한다.

또한 page-based pagination은 제한적인 상황에서만 사용 가능하다.

1. 데이터가 커서를 기준으로 순차 정렬 되어있을 때.

2. 특정한 데이터를 찾을 필요가 없을 때(예를들어, 400번 데이터를 요청하기 위해선 1~399번중 아무 데이터를 최소한 한 번 요청해야한다.)

응용: page-based pagination

offset 방식을 응용하면 책장을 넘기는 형식의 pagination을 구현 가능하다.

이 경우 고정된 size를 take로 사용하고, 앞에서 가져온 데이터 만큼을 skip한다.

prisma.repository.findMany({
    skip: (page - 1) * size,
    take: size,
});

실제 사용할 때는 사용자로부터 page만을 받아오며, size는 고정되어야 한다.

1번부터 100번까지 순차 정렬된 데이터가 있고, size가 10일때:

page가 1이라면 skip: 0, 1번부터 10번까지,

page가 2라면 skip: 10, 11번부터 20번까지...

이런 식으로 pagination을 구현할 수도 있다.

레퍼런스

https://www.prisma.io/docs/orm/prisma-client/queries/pagination

profile

작은 도서관

@Flrea

포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!