บันทึกการใช้งาน Apollo Engine

ไม่นานมานี้ได้มีโอกาสลองใช้งาน Apollo Engine หนึ่งในเครื่องมืออันทรงพลังของทาง Apollo GraphQL รู้สึกว่าน่าสนใจมาก ๆ เลยถือโอกาสเขียนบล็อกเก็บไว้ เผื่อเป็นประโยชน์ต่อผู้ที่ผ่านไปผ่านมาครับ

Apollo Engine คืออะไร ?

Apollo Engine เป็นเครื่องมือที่ช่วยในการ monitoring เซิฟเวอร์ของเรา ไม่ว่าจะเป็น การตรวจจับปัญหาที่เกิดขึ้น, tracing เพื่อดูการทำงานของเซิฟเวอร์ว่ามันช้าตรงไหนบ้าง รวมไปถึงการทำ caching ด้วย

ก่อนจะเริ่มใช้งาน เรามาดูฟีจเจอร์ที่น่าสนใจกันก่อนดีกว่า

Query Execution Tracing

ฟีจเจอร์นี้จะสามารถบอกให้เราทราบได้ว่า ในหนึ่งรีเควสที่เข้ามายังเซิฟเวอร์ของเรามันใช้เวลาเท่าไหร่ ซึ่งความเจ๋งของมันก็คือ สามารถจับเวลาได้ในระดับของ resolver function เลยครับ ว่าฟังก์ชันไหนใช้เวลาไปเท่าไหร่

Tracing ในระดับ resolver function กันเลย

ปกติเราก็พอจะรู้อยู่แล้ว ว่าหนึ่งรีเควสมันใช้เวลาเท่าไหร่ แต่การที่เรารู้ได้ละเอียดถึงขั้นว่ามันช้าที่ resolver function ไหน ถือว่าดีมาก ๆ ซึ่งนอกจากทำให้เราสามารถเข้าไปแก้ปัญหาได้ตรงจุดแล้ว ยังลดเวลาการดีบักในการหาจุดที่มันช้าอีกด้วย

Error Tracking

ในความเป็นจริงแล้ว การส่งรีเควสอาจจะเกิดปัญหาได้ทุกเมื่อ และจะดีกว่าไหมถ้าเราสามารถรู้ได้ ว่าเกิดปัญหาอะไรขึ้นบ้าง เจ้า Apollo Engine จะมีแดชบอร์ดที่บอกว่าเกิดปัญหาอะไรขึ้นกับเซิฟเวอร์ของเราบ้าง

หน้าแดชบอร์ดบอก error message, path และเวลาที่เกิด error

ฟีจเจอร์นี้สามารถจับปัญหาทั่ว ๆ ไป เช่น ส่ง query ผิดหรือตัวแปรผิดได้ และที่น่าสนใจกว่านั้นคือ ถ้าปัญหาเกิดขึ้นภายใน resolver function ก็จะมีรีพอร์ทบอกตำแหน่งของ resolver function ให้ด้วยนะ

GraphQL Caching

นอกจากการ monitoring แล้ว Apollo Engine ยังสามารถทำ caching ได้ด้วย โดยสามารถทำ caching ให้กับรีเควสทั้งหมด, ทำเฉพาะ type หรือ field ที่เราต้องการได้

สามารถดู hit rate ของการทำ caching ได้

มาลองใช้งานกันเถอะ

จากตัวอย่างด้านล่างเป็น GraphQL เซิฟเวอร์ จาก apollo-server-express นะครับ โดยเราจะยังไม่ได้เปิดใช้งาน Apollo Engine นะ

ปล. โค้ดด้านล่างนี้ใช้เพื่ออธิบายการการใช้งาน Apollo Engine เท่านั้นนะครับ อาจจะตัดโค้ดบางส่วนออก เช่น GraphiQL, GraphQL schema

import express from 'express'
import { graphqlExpress } from 'apollo-server-express'
const app = express()
app.use('/graphql', graphqlExpress({
  schema,
}))
app.listen(4000, () => { console.log('Server started.') })

Query Execution Tracing

สำหรับการเปิดใช้งานฟีเจอร์ query execution tracing เพียงแค่เพิ่มtracing: true เข้าไปใน graphqlExpress ก็เป็นอันเรียบร้อย เมื่อลองเรียก query จาก GraphiQL ดู จะมีผลลัพธ์ของ tracing อยู่ในฟิลด์ extensions.tracing

app.use('/graphql', graphqlExpress({
  schema,
  tracing: true,
}))

ผลลัพธ์เมื่อเปิดใช้งาน tracing

คราวนี้เราจะเอาผลลัพธ์ของ query execution tracing ไปแสดงใน Apollo Engine กัน

yarn add apollo-engine

และเพิ่มโค้ดสำหรับเปิดใช้งาน Apollo Engine

import express from 'express'
import { graphqlExpress } from 'apollo-server-express'
import { ApolloEngine } from 'apollo-engine'
const app = express()
app.use('/graphql', graphqlExpress({
  schema,
  tracing: true,
}))
const engine = new ApolloEngine({
  apiKey: APOLLO_ENGINE_API_KEY,
})
engine.listen({
  port: NODE_PORT,
  expressApp: app,
}, () => { console.log('Server started.') })

สำหรับ APOLLO_ENGINE_API_KEY จะเป็น API key สำหรับใช้งาน Apollo Engine ครับ เข้าไปสมัครกันได้ ที่นี่ เลย

เสร็จแล้วลอง query ดูอีกรอบครับ คราวนี้จะไม่เจอฟิลด์ extensions.tracing ใน GraphiQL แล้ว แต่จะมีผลลัพธ์ขึ้นที่หน้าแดชบอร์ดของ Apollo Engine แทน

แดชบอร์ดแสดง query execution tracing

GraphQL Caching

เราสามารถเปิดใช้งานฟีจเจอร์ caching ได้โดยใส่ cacheControl: true โดยสามารถกำหนดอายุของ cache ได้หลายวิธี เช่น

• ใส่เป็น cacheControl: { defaultMaxAge: 3600 } (หน่วยเป็นวินาที)

app.use('/graphql', graphqlExpress({
  schema,
  tracing: true,
  cacheControl: true,
}))

• ใส่เป็น directive ให้กับ Schema Definition Language (SDL) เลยก็ได้

type User @cacheControl(maxAge: 120) {
  id: String
  name: String @cacheControl(maxAge: 240)
  posts: [Post]
}

ซึ่งเราจะดูจาก tracing ได้ ว่าแต่ละฟิลด์เราแคชไว้เป็นเวลาเท่าไหร่ ตรง TTL ทางขวาเลยครับ

ช่อง TTL แสดงเวลาของการ caching ในแต่ละฟิลด์

เราสามารถดูได้ด้วยนะว่าเวลา query แล้วมีใน cache กับไม่มีใน cache ใช้เวลาเท่าไหร่

ดูระยะเวลาในการรีเควส

Error tracking

Apollo Engine สามารถใช้งานฟีจเจอร์นี้โดยไม่ต้องเซ็ตอัพอะไรอยู่แล้ว ผมจะลอง throw error ภายในโค้ดของผมเองนะ จะได้ผลลัพธ์ใน GraphiQL แบบนี้

ลอง throw error ภายใน resolver function

ในแดชบอร์ดของ Apollo Engine ก็จะบันทึกเอาไว้ว่าเกิดอะไรขึ้นบ้าง

แดชบอร์ดแสดงปัญหาที่เกิดขึ้นทั้งหมด

ความเห็นจากการใช้งาน

จากที่ผมลองใช้เป็นฟรีแพลนนะครับ สามารถใช้ได้หนึ่งล้านรีเควสต่อเดือน และก็ดูข้อมูลย้อนหลังได้หนึ่งวัน แต่ถ้าใครอยากได้มากกว่านั้นก็ต้องอัพแพลนครับ รายละเอียดดูได้ ที่นี่ เลย

ด้วยความสามารถที่เยอะมาก ๆ แถมการเซ็ตอัพก็ง่าย เขียนโค้ดแค่ไม่กี่บรรทัดก็สามารถใช้งานฟีจเจอร์ดี ๆ เหล่านี้ได้แล้ว ส่วนตัวคิดว่าถ้าเดือนนึงมีรีเควสไม่ถึงหนึ่งล้าน ก็ติดตั้งแล้วใช้ฟรีได้สบาย ๆ เลย อย่าไปคิดมาก ถ้าเกินแล้วค่อยว่ากันอีกที 555

ใครลองเล่นแล้วมาพูดคุยกันได้นะครับ แล้วเจอกันใหม่บทความหน้า ขอให้สนุกกับการใช้ Apollo Engine นะครับ