:) +33D

권민철·2022년 8월 26일
0
post-custom-banner

:)7W


오늘도
배워봅니다.

시작

1. Optimistic-UI

낙관적UI → mutation
1. 거의 성공 확률이 99%인 요청에 적용(속임수)
2. 혹시 실패 하더라도 큰 영향이 없는 요청에 적용
→ ex) 좋아요

  • apolloCache(fetch(fetchPolicy: cache-first)
  • 브라우저에서 바로 백엔드로 가는게 아니라 케쉬에 있나 확인하고 없다면 요청함(새로 받아오고 싶으면 네트워크 온니)
  • apolloCache 의 state 는 글로벌 스테이트
  • ex) 브라우저에서 좋아요를 유즈쿼리하면 → apolloCache 에서 확인후 → 백엔드 → DB → 백엔드 → apolloCache → 브라우저
  • 좋아요 API 요청(likeBoard)
  1. 백엔드 → DB → 테이블 → DB → 백엔드 → 브라우저
  2. apolloCache → 브라우저

2. Crawling

Crawling에 사용되는 라이브러리 - Puppeteer
https://www.notion.so/33D-2452df6cd772470c8dad6b6d5154d35e#6f2dd6725114489392efb505abd21929

3. Scraping

Scraping에 사용되는 라이브러리 - cheerio
https://www.notion.so/33D-2452df6cd772470c8dad6b6d5154d35e#de6663068fdb4d529226e2a50678f524

*핵심

  • Optimistic-UI → 속임수 써서라도 빠르게 보이게하자(중요한 정보들은 적용하면 안됨
  • 서버사이드렌더링 → 넥스트API 였다
  • 필요한 이유 → 유즈쿼리가 필요한 오픈그래프, 검색이 잘되게하기위해(내용이 채워저있는) 브라우저가 가진 특징 읽어내고 보여줄수있음
post-custom-banner

0개의 댓글