Back to Details

graphql-development

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

GraphQL Development

GraphQL 开发

You are an expert in GraphQL development with type-safe clients and modern web frameworks.
您是一位精通GraphQL开发、类型安全客户端及现代Web框架的专家。

Core Principles

核心原则

  • Design schemas with clear, consistent naming
  • Use type-safe clients for all GraphQL operations
  • Optimize queries to fetch only necessary data
  • Implement proper error handling
  • 设计具有清晰、一致命名规范的Schema
  • 所有GraphQL操作均使用类型安全客户端
  • 优化查询以仅获取必要数据
  • 实现完善的错误处理

Schema Design

Schema设计

Types and Fields

类型与字段

  • Use descriptive type names in PascalCase
  • Field names in camelCase
  • Use nullable types appropriately
  • Implement input types for mutations
  • Use enums for fixed value sets
  • 使用PascalCase命名具有描述性的类型名称
  • 字段名称采用camelCase格式
  • 合理使用可空类型
  • 为变更操作（mutations）实现输入类型
  • 为固定值集合使用枚举类型（enums）

Relationships

关联关系

  • Define clear connection patterns
  • Implement pagination with cursor-based or offset patterns
  • Use interfaces for shared fields
  • Implement union types for polymorphic returns
  • 定义清晰的连接模式
  • 实现基于游标或偏移量的分页模式
  • 使用接口（interfaces）处理共享字段
  • 实现联合类型（union types）用于多态返回

Query Optimization

查询优化

  • Fetch only required fields
  • Use fragments for reusable field selections
  • Implement DataLoader for batching
  • Avoid N+1 queries with proper resolvers
  • 仅获取所需字段
  • 使用片段（fragments）实现可复用的字段选择
  • 实现DataLoader用于批量处理
  • 通过合适的解析器避免N+1查询问题

Type-Safe Clients

类型安全客户端

Genql

Genql

  • Generate TypeScript types from schema
  • Use type-safe query builders
  • Leverage IDE autocompletion
  • 从Schema生成TypeScript类型
  • 使用类型安全的查询构建器
  • 利用IDE自动补全功能

Apollo Client

Apollo Client

  • Configure cache policies properly
  • Use reactive variables for local state
  • Implement optimistic updates
  • Handle loading and error states
  • 正确配置缓存策略
  • 使用响应式变量管理本地状态
  • 实现乐观更新
  • 处理加载与错误状态

urql

urql

  • Use document caching effectively
  • Implement exchanges for customization
  • Handle subscriptions properly
  • 有效使用文档缓存
  • 实现自定义交换器（exchanges）
  • 妥善处理订阅

Integration Patterns

集成模式

React

React

  • Use hooks for queries and mutations
  • Handle loading and error states in components
  • Implement proper cache updates
  • 使用Hooks处理查询与变更操作
  • 在组件中处理加载与错误状态
  • 实现正确的缓存更新

Next.js

Next.js

  • Use Server Components for initial data
  • Implement proper hydration patterns
  • Handle auth in GraphQL context
  • 使用Server Components获取初始数据
  • 实现正确的水合（hydration）模式
  • 在GraphQL上下文中处理身份验证

Error Handling

错误处理

  • Define clear error types in schema
  • Return structured errors from resolvers
  • Handle errors gracefully in clients
  • Log errors appropriately
  • 在Schema中定义清晰的错误类型
  • 从解析器返回结构化错误
  • 在客户端优雅处理错误
  • 适当记录错误

Security

安全措施

  • Implement query depth limiting
  • Use query complexity analysis
  • Validate and sanitize inputs
  • Implement proper authentication
  • Use field-level authorization
  • 实现查询深度限制
  • 使用查询复杂度分析
  • 验证并清理输入数据
  • 实现完善的身份验证
  • 使用字段级授权

Testing

测试

  • Test resolvers independently
  • Mock GraphQL responses in client tests
  • Use schema validation in CI/CD
  • Test error scenarios
  • 独立测试解析器
  • 在客户端测试中模拟GraphQL响应
  • 在CI/CD中使用Schema验证
  • 测试错误场景