[GraphQL] 개발자들의 많은 관심을 받고있는 차세대 언어!

 

GraphQL은 2016년 facebook에서 만든 오픈소스 쿼리언어이고, 쿼리 언어중에서도 Server API를 통해 정보를 주고받기 위해 사용하는 쿼리언어이다. 많은 개발자들이 GraphQL에 대해 알고있고, 굉장히 인기있는 언어이다. 필자도 React를 배우기도 전인 시절 (프론트엔드 부트캠프 참여전)부터 알고있었을 정도로 개발자들 사이에서 높은 인지도를 가지고있다.

---

GraphQL을 사용하는 이유?

GraphQL은 이름에서 알 수 있듯이 그래프 자료구조를 이용해 표현한다.

그래프 자료구조는 인간의 뇌 구조 및 언어적인 설명과 비슷하기 때문에 현실세계에서 많은 현상들을 모델링 할 수 있는 도구인데, 흔히 아는 마인드맵이 그래프자료구조와 비슷하다.

 

프론트엔드 개발자의 관점에서 GraphQL을 사용하는게 좋은 이유는 서버로 부터 받아올 자료를 클라이언트에서 주도적으로 요청할 수 있다는 점에 있다.

 

GraphQl 은 /graphql이라는 하나의 Endpoint로 query,  mutation등의 정보를 담아 Post 요청을하고,  이용해 필요한 정보를 받아오게된다.  이러한 특성 덕분에 클라이언트가 주도적으로 필요한 정보를 받아올 수 있고, 클라이언트의 구조가 변경되어도 Under/Over Fetching이 발생하지 않게되는 큰 장점이 있다.

query {
	책(ISBN이 "9780674430006") {
		책 이름
		저자 {
			이름
		}
	}
}

{
	책 : {
		책 이름 : "GraphQL은 어렵지 않다",
		저자 : [
			{ 이름 : "김코딩"},
			{ 이름 : "박해커"},
		]
	}
}

위의 예시가 GraphQL을 이용해 서버로부터 응답을 받아오는 예시인데, 프론트엔드(클라이언트) 입장에서 받아올 정보를 정할 수 있어서 OverFetching , UnderFetching 을 피할 수 있다.

---

기존 Rest API의 한계

Over/Under Fetching

Over/Under Fetching 은 기존의 REST Api 의 한계 라고 할 수 있는데, 필요한 정보 이상의 응답을 받아와서 Resource (서버자원)낭비가 발생하는 상황을 OverFetching, 반대로 응답의 정보가 부족해서 여러번 다른 엔드포인트로 요청을 보내야 하는 상황이 UnderFetching 이라고 할 수 있다.

 

REST API를 사용하게되면 URI의 Endpoint와  Method를 통해 서버에 응답을 요청하고, 이에 맞는 응답을 보내준다. 여기서 OverFetching과 UnderFetching이 발생할 수 있는데.

 

클라이언트 구조 변경에 대한 유연한 대응이 힘듬

기존의 Rest API를 사용하게 되면 프론트엔드에서 화면에 표시하고자 하는 정보가 변경되면 EndPoint나 데이터의 수정이 불가피하다.

잘 설계를 하고 구현에 들어간다면 이런 경우를 피할 수 있겠지만 이런일은 생각보다 자주 일어난다. 갑작스런 기획의 변경등의 이유로 프론트엔드단에 표시할 정보가 변경된다면 Under/OverFetching을 피할 수 없다. 이러한 경우에 유연하게 대처하기 힘들다 

 

GraphQL의 단점

높은  러닝커브(Learning Curve)

Rest API에 익숙한 개발자의 경우, GraphQL을 학습하는데 다소 시간이 걸릴 수 있는 단점이 있다. 

 

REST보다 훨씬 복잡한 캐싱

HTTP에서는 각 메소드에 따른 캐싱이 구현되어있다. 하지만 GraphQL을 사용하면 POST 메소드만을 이용해서 요청을 하기 때문에, 각 메소드에 따른 캐싱을 지원받을 수 없다. 이를 보완하기위해 Apollo엔진의 캐싱과, 영속쿼리 등이 등장하게 되었다.

 

고정된 요청, 응답만 필요할 시, 요청의 크기가 커진다.

고정된 요청, 응답만 필요할 시 서버측에 보내는 요청의 크기가 REST API보다 훨씬 커지게 되는데 이는 필요한 정보를 모두 쿼리에 담아서 보내야하기 때문이다.

 

이러한 단점들이 있지만, 러닝커브의 경우, 한번 배워두면 사라지는 단점이고, 잘 익혀서 적재적소에 RestAPI와 GraphQL을 활용할 줄 안다면, 서버통신 최적화에 큰 이점이 된다고 생각한다.

 

 

GraphQL의 구조에 대해 알고싶다면?

https://jobkaehenry.tistory.com/24?category=1075109 

[GraphQL] GraphQL 구조