| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | 2 | 3 | 4 | 5 | ||
| 6 | 7 | 8 | 9 | 10 | 11 | 12 |
| 13 | 14 | 15 | 16 | 17 | 18 | 19 |
| 20 | 21 | 22 | 23 | 24 | 25 | 26 |
| 27 | 28 | 29 | 30 |
Tags
- 이것저것
- server component
- 자바스크립트
- 에세이
- 회고
- MicroFrontEnd
- Webworker
- 티스토리챌린지
- frontend
- 아키텍처
- vite
- 리액트
- context.api
- 프론트엔드
- react
- CRA
- JavaScript
- TypeScript
- 리팩토링
- 클린코드
- MFA
- Web
- provider 패턴
- radixui
- 웹워커
- 오블완
- CustomHook
- sharedworker
- virtaullist
- 합성 컴포넌트
Archives
- Today
- Total
목록virtaullist (1)
Lighthouse of FE biginner
[React] Table 가상 리스트(Virtual List) 도입기
들어가며프론트엔드에 있어서 테이블 컴포넌트는 중요한 컴포넌트 입니다.모든 프로덕트에 테이블 컴포넌트가 들어가지는 않지만, 데이터를 다루는 프로덕트에서는 대부분 테이블 컴포넌트를 구현해서 사용하고 있습니다.리액트에서 테이블을 다룰수 있는 방법은 여러가지 방법이 있습니다.1. table 태그를 사용해 직접 구현하기2. UI 라이브러리의 힘을 빌려 구현하기3. headless UI 라이브러리의 힘을 빌려 구현하기 이 중 저는 headless UI 라이브러리의 힘을 빌려 테이블 컴포넌트를 구현했습니다. 테이블 컴포넌트를 구현하는 포스팅은 다음 포스팅에서 작성할 예정이고, 오늘은 작업한 컴포넌트에 가상 리스트를 도입했던 과정을 남겨보도록 하겠습니다. 가상 리스트란?가상 리스트란 가상화 기술을 활용해 테이블의 로우..
[WEB] 프론트엔드
2024. 7. 17. 14:22