🔏
PexpA
  • Home
  • Knowledge
    • Design Pattern
    • RxJS
    • Computer Graphics
      • Phép biến đổi hình học
    • Javascript
      • Generator function và Yield trong javascript
      • Asynchronous và Synchronous
    • GraphQL
      • Core Concepts
      • Xây dựng GraphQL sử dụng NodeJS
    • Analysis and System Design
    • SEO
    • Database
      • NoSQL
        • MongoDB
      • SQL
    • ReactJS
      • React Fragment
      • Lifecycle trong component
      • HOCs
      • What is Ref ?
      • Context API
      • React Hooks
        • useState Hook
        • useEffect Hook
        • useLayoutEffect Hook
        • Khi nào dùng useLayoutEffect và useEffect
        • useContext Hook
        • useReducer Hook
        • useCallback Hook
        • useMemo Hook
        • useRef Hook
        • Building Your Own Hooks
      • Redux
    • React Native
      • Animations
    • Angular
    • Python
      • Object Oriented Programming
      • Decorator
      • Multi Threading
      • Generators
      • Iterators
    • Java
    • Blockchain
      • Ethereum Development Overview
      • Solidity Document
      • JSON RPC Protocol
  • Package
    • React Router V4
    • API Documentation
      • API Blueprint
      • Swagger
    • Lazyload image
    • React Helmet
    • React Spring
    • React Apollo
    • ImmerJS
    • Styled components
  • Experience
    • Sử dụng Latex trên VSCode
    • Linked List in C++
    • How to using Date, Time, TimeStamp for Java to connect Database
    • Pass props to a component rendered by React Router v4
    • Forking Workflow
  • Deploy
    • Heroku
      • How to deploy React App with Express
      • How to deploy React App with Python
      • How to deploy React App with Java
  • About me
Powered by GitBook
On this page
  • GraphQL là gì ?
  • Tại sao cần GraphQL ?!
  • Data fetching with REST vs GraphQL
  • Giải pháp

Was this helpful?

  1. Knowledge

GraphQL

PreviousAsynchronous và SynchronousNextCore Concepts

Last updated 4 years ago

Was this helpful?

GraphQL là gì ?

GraphQL là một cú pháp mô tả cách yêu cầu lấy dữ liệu, và thường được dùng để load data từ một server cho client. GraphQL bao gồm 3 điểm đặc trưng bao gồm cho phép client xác định chính xác những gì dữ liệu họ cần, làm cho việc tổng hợp dữ liệu từ nhiều nguồn dễ dàng hơn và nó sử dụng một type system để mô tả dữ liệu.

Tại sao cần GraphQL ?!

GraphQL bắt đầu từ ông lớn Facebook, thế nhưng ngay cả những app đơn giản đôi khi vẫn gặp phải trường hợp “nghẽn cổ chai” do sự hạn chế của REST APIs.

Thí dụ bạn muốn hiển thị một list posts, và ở dưới mỗi post là một list like, bao gồm cả tên người dùng và avatar. Cách giải quyết đơn giản là thay đổi API của ‘posts’ để nó bao gồm a ‘like’ array chứa thông tin về người dùng.

Thế nhưng khi làm như vậy cho các app mobile thì bạn sẽ phát hiện ra tốc độ của chúng chạy quá chậm. Vì thế mà giờ đây bạn sẽ cần tới 2 endpoints, một với likesvà một thiếu chúng.

Giờ thì còn có thêm một vấn đề khác xuất hiện: trong khi postsđược lưu trữ trong một MySQL database thì likes lại được lưu tại Redis store! Bạn biết mình phải làm gì trong trường hợp này không ?

Mở rộng vấn đề trên ra với việc Facebook phải quản lí vô số data source và API clients thì cũng là điều dễ hiểu khi REST APIs bị đánh giá là cũ kĩ bởi những hạn chế của nó.

Data fetching with REST vs GraphQL

Với REST API, bạn thường thu thập dữ liệu bằng cách truy cập những endpoint

Xét ví dụ sau

Để muốn lấy thông tin người dùng Mary đã post bài Learn GraphQL today có bao nhiêu người follow thì cần call các API

/users/<id>
/users/<id>/posts
/users/<id>/fllowers

Nhưng trong GraphQL đơn giản bạn chỉ cần gửi một query tới GraphQL server với những yêu cầu của bạn và GraphQL server sẽ trả về đầy đủ thông tin mà bạn cần

Ví dụ

Giải pháp

Giải pháp mà Facebook đưa ra đến từ một ý tưởng rất đơn giản: Thay vì có đến hàng tá “endpoint” ngu ngốc, sao lại không dùng chỉ một “endpoint” thông minh với khả năng tiếp thu những Query phức tạp rồi đưa ra output data với loại type tùy theo yêu cầu của client.

Thế tế mà nói, GraphQL như là một layer nằm giữa client và data source, sau khi nhận yêu cầu của client thì nó sẽ kiếm những thông tin cần từ các data source và đưa lại cho client theo format họ muốn. Vẫn chưa hiểu? Thế thì đến lúc dùng ví dụ ẩn dụ rồi đây!

Như bạn thấy đấy, REST model cũ giống y như việc bạn đặt cái bánh Pizza, rồi gọi ship hàng online và kêu bên tiệm giặt ủi đem đồ đến cho bạn. Tất cả diễn ra với 3 cuộc gọi và 3 cửa hàng.

GraphQL mặt khác lại giống như là thư kí riêng của bạn vậy: Sau khi bạn đưa địa chỉ của 3 cửa hàng và nói yêu cầu của bạn thì GraphQL sẽ làm hết mọi chuyện còn lại trong khi bạn chỉ việc chờ chúng được chuyển đến cho mình.

With REST, you have to make three requests to different endpoints to fetch the required data. You’re also overfetching since the endpoints return additional information that’s not needed.
Using GraphQL, the client can specify exactly the data it needs in a query. Notice that the structure of the server’s response follows precisely the nested structure defined in the query.