밸~하!

밸로그 여러분 안녕하세요!
오늘 포스팅할 주제는 바로!! 검색입니다!
여러분 네이버부터해서 구글까지 실제로 저희가 사용하고있는 검색홈페이지들이 많죠??
그럼 이때 사용하는 검색은 어떻게 어떤원리로 이뤄지는지 알면 조금더 쉽게 현 트랜드에 다가갈수 있겠죠??
그럼 한번 시작해 볼까요~??

1. 검색은 어떻게 될까??

검색은 도대체 어떻게 될까요??

이전에 썻던것처럼 컴퓨터를 예시로 들어서 설명을 해볼까요??

브라우저에서는 HTML CSS JS 파일을 읽어와서 화면에 그려주게 됩니다
이때 브라우저에서 검색창에 글자를 적고 검색하기를 누르면
백엔드 컴퓨터로 가게 됩니다!

그리고 백엔드 컴퓨터에서는 이미 값을 불러와주는 API를 만들어 놨을겁니담

이때 search나 검색에 관련된 키워드로 백엔드 서버에 요청을 하게됩니다
그렇게 되면 백엔드에서 정보를 정제해서 주게되겠죠??

이렇게 된다면 프론트는 크게 할게 없습니다
하지만 백엔드에서 어떻게 돌아가는지 알아야지 헷갈리지 않을수있겠죠
그럼 백엔드에서는 어떻게 돌아갈까요??

결론부터 말씀을 드리자면 데이터 베이스에서 검색을 해주게됩니다
그럼 어떻게 DB에서 돌아가는지 알아볼까요??
예를들어

USER 라는 테이블이 있다고 가정을 해봅시다
이때 name이라는 column에
철수 영희 훈이 가있다고 했을떄
DB에서 원하는 값을 찾아서 주게 됩니다
어떻게 될수가있는가?
DB를 만든사람들이 어떻게 하면 DB가 더 빠르게 검색을 할 수있을지 고민하다가 적용을 시킨게
검색알고리즘을 적용시켜서 최적화를 해줍니다

이렇게만 들어서는 개발자는 아무것도 안해도 되는가?
라는 생각이 들수도 있지만은
백엔드 개발자의 경우에는 어느정도 알고있어야 어떻게 받을지 정해줄수있게되고
프론트 엔드 개발자의 경우도 어느정도는 알고있어야 원하는 값을 쉽게 받을수 있게됩니다!

자! 그런데 이렇게 간단하다면 포스팅을 할 이유가 없겠죠??

이번엔
새로운 예시를 들어보겠습니다
BOARD라는 TABLE이 있다고 가정을 해볼게요!

그안에column으로 번호와 제목이 있고
1번 나는철수야
2번 오늘점심은 돼지고기지
3번 나는 고기가 좋아
4번 왜냐면 단백질이거든
.
.
.

이렇게 간다고 했을떄
title에 나는 이 들어간 게시글을 가지고 오고싶을때
DB는 나는을 가지고 검증을 하겠죠
1번과 3번 ....한개씩 탐색을 하겠죠
문제는 여기서 발생합니다 간단히 10개정도만 있으면 쉽게 탐색을 하겠지만
이 테이블이 10만개 이상의 데이터를 가지고있다면?
한개한개 비교를 하는데 시간이 오래걸리겠죠??

이부분을 구글에서는
BOARDSEARCH라는 TABLE을 만들어서
단어와 번호를 바꾸어서 저장을 하게됩니다
쉽게 말해

나는 1번
철수 2번
야 3번
고기 4번
.
.
.
이렇게 바꾼 테이블을 한개 생성했다는거죠
이렇게 된다면

나는 1번 3번
철수 1번
야 1번
고기 2번 3번
이렇게 된다는거죠!

이렇게 된다면 10만개이상의 정보를 검색하는게 아니라
가지고 있는단어에 따라서 그 ROW를 가져오면 되니 훨씬 효율성이 높아지고 속도도 빨라지겠죠?!

이런방식을 어떻게 부를까요?
바로

역 Index방식 다른말로는

역 색인 방식이라고 부릅니다!

이것을 영어로

Inverted Index

라고도 부릅니다

그래서 이러한 것을 적용시킨 DB가 나오게됩니다
바로
ELasticsearch라는 DB 인데요
이 DB를 쓰게 된다면 궂이 Boardsearch와 같은 table을 만들필요없이
DB에서 만들어주게 됩니다!

이때 검색의 키값이 되는것을 Token이라고 부릅니다!
그리고 이전의 Board테이블에 있는 제목이라는것을 일일히 분해하여 Boardsearch에 담는것을
Tokenizing이라고 합니다!
토큰화 시킨다는거죠

어떠신가요??
조금 어렵지만 훨씬 쉽게 이해가 되셨죠??

조금더 들어가볼까요?

ElasticSearch나 기존의 mysql같은 DB는 결국에는
하드디스크에 저장을 하게됩니다
저희가 변수는 RAM에 저장을 하게되고 DISK에는 파일이 저장이 됩니다
그런데 실제 일을 하는것을 cpu에서 하게되니
disk에서 저장을 하면 느리게 되겠죠?
이것을 디스크 I/O라고 합니다

이러한 것을 해결하기위해
Disk에 저장을 하는것이 아니라
RAM에 저장하는 방식을 사용하는 DB가 나옵니다

바로 메모리기반 DB
Redis 라는것이 나옵니다

이 Redis에서는 어떻게 작동을 하게되는가
DB까지 가지않고 먼저는 백엔드 컴퓨터에서 바로 Redis에 가서 조회를 하게되고
Redis에 없다면 ELasticsearch 에서 찾아서 가져오게 되고
이것을 Front컴퓨터에 보내주기전에 Redis 에 저장을 해주게 되서
다음에 검색을 할때 훨씬 빠르게 할수 있게 만든다는거죠?!

그래서 처음 검색한 사람은 느리지만 다음에 검색한 사람들은 훨씬 빠르게 가져올수 있겠죠??

이것을

cache-aside-pattern이라고 부릅니다!

그다음 볼것은
바로!
Debouncing 입니다!

Debouncing

debounce의 뜻부터 보겠습니다
영어로는 쿵쾅거리다는 뜻입니다
이것을 토대로 한번 봐볼까요?
input창에 값을 클릭할때마다 입력이되곘죠?
예를들어
input 창에 안녕하세요 라고 입력을 하는데 순간마다 요청을 하게되어 서버에 과부하가 걸리게됩니다
그럴때 마지막 값에만 API를 요청하면 되겠죠?

이때 사용하는것이 바로 Debouncing입니다!
즉
특정 시간을 나누어서 시간동안 입력이 없을때 API호출을 하게 되는것이죠
예를들어

1초라고 설정을 해놓게 된다면
안녕하세요 라고 꾸준히 입력을 하게된다면 입력이 지속적으로 들어오게 되니
API를 마지막에 와서 요청을 하게되겠죠??

즉 마지막에 한번만 요청을 하게됩니다
흔히 접할수 있는 예제로는

검색디바운싱이 있겠죠?

이것과 비슷한 방법이 있습니다
바로 !
throttling인데요

throttling

throttling이란?
최초입력을 기준으로 ,특정 시간 이내에 발생한 추가입력을 무시하는것 입니다 !

debouncing의 경우에는 마지막에 한번 요청을 하게되지만
throttling의 경우에는 먼저 요청을 하게됩니다는거죠

throttling의 경우에는 어디에 적용이 될까요??

저희 저번에 포스팅했던 무한스크롤 기억나시나요??
네 ! 맞습니다
바로
무한스크롤을 사용할때 throttling을 사용하게 됩니다 !

어떻게 사용하나구요?

특정시간내에서 무한스크롤을 한 부분만 표현이 되게되고 다른 부분들은 무시하게 된다는거죠!

자 오늘의 포스팅은 여기까지입니당

오늘은 검색을 할때 DB 가 어떻게 돌아가는지와
기초 CS부분을 조금 다루었는데요
프론트엔드 개발자가 되기위해서지만 그래도 백엔드가 어떻게 돌아가는지는 알아야 더욱 소통도 편리하고 할수있겠죠?!

오늘도 조금씩 정보를 쌓아가는 밸로그분들이 되셨으면 좋겠습니당~

그럼 이만
밸~바!