브렌쏭의 Veritas_Garage

Pagination, 보여줄 건 많은데 화면은 좁고.... 본문

[Project_하다]/[Project_공부]

Pagination, 보여줄 건 많은데 화면은 좁고....

브렌쏭 2022. 4. 18. 14:24

따라서 페이지를 나눠서 보여준다. 당연한거 아닌가? 

물론 당연한 것들이 당연히 안되는 것이 이 바닥이다

놀랍게도 이 페이지화 작업은 단순한 것이 아니라, 백엔드와 프론트 양쪽에서 작업을 해줘야 하는 고난이도의 콤보기술이었던 것이다.

현재 위치 : Offset

데이터가 시작될 위치다. '여기부터 저기까지 주세요' 여기를 담당하고 있다.

보여줄 컨텐츠의 수 : Limit

얼마나 많은 데이터를 한번에 보여줄지 정하는 수이다. 보여줄 컨텐츠의 수, 혹은 한 페이지 안에 보여줄 데이터의 수 라고도 할 수 있겠다.

'여기부터 저기까지 주세요'  에서 지갑을 담당하고 있다.

좀더 깊이 들어가면 이 바닥이 그렇듯 뭔가 층층이 쌓여있다

좀 더 테크니컬한 썸띵:  "커서 기반 페이지네이션"

  • 페이지네이션(Pagination) 이란 한정된 네트워크 자원을 효율적으로 활용하기 위해
  • 쿼리의 결과값으로 리턴된 리소스를 `분할하여 전달`하는 것을 의미한다.
데이터베이스에 만 개의 투두(todo) 아이템이 있을 때, 한 번에 만 개를 돌려주는 대신 0번부터 49번까지 50개씩 돌려주는 것을 의미한다. 여기서 다음 요청이 들어오면 50번부터 99번까지, 또 다음 요청이 들어오면 100번부터 149번까지 돌려준다.
이렇게 함으로써 네트워크의 낭비를 막고, 빠른 응답을 기대할 수 있게 된다

그럼 페이지 기반 페이지네이션이 아니라 커서 기반 페이지네이션은 또 뭐냐, 커서네이션이냐 이런 생각이 드는 것도 당연하다 생각들지만.

커서 = 책갈피

책갈피를 끼워두면 굳이 앞에서부터 페이지를 셀 필요 없이 곧장 읽은 데부터 다시 읽을 수 있다. 이전에 읽은 부분으로 넘어가는 것도 어렵지 않다. 책갈피가 Index의 역할을 하기 때문이다.

https://gompro.postype.com/post/2650985

 

페이지네이션, 커서 기반? 페이지 기반?

이 글은 Velog 에서도 보실 수 있습니다. 들어가며 페이지네이션(Pagination) 이란 한정된 네트워크 자원을 효율적으로 활용하기 위해 쿼리의 결과값으로 리턴된 리소스를 `분할하여 전달`하는 것을

gompro.postype.com

 

'[Project_하다] > [Project_공부]' 카테고리의 다른 글

Elastic Search 했어요~  (0) 2022.04.25
검색 프로세스, Search process  (2) 2022.04.19
ACID, 실패할거면 하지마라 그냥  (0) 2022.04.19
GraphQL, 실제로는 REST.  (0) 2022.04.14
백엔드, 이미지를 업로드  (0) 2022.04.14
CORS, 웹의 신호등  (0) 2022.04.12
Cloud, 디지털 피안  (0) 2022.04.11
Comments