optics-ts vs graphql-codegen vs graphql-tag vs graphql-tools
GraphQL Development Tools
optics-tsgraphql-codegengraphql-taggraphql-toolsSimilar Packages:

GraphQL Development Tools

GraphQL Development Tools are libraries and utilities that assist developers in building, managing, and optimizing GraphQL APIs. These tools provide functionalities such as schema generation, type safety, query optimization, and more, making the development process more efficient and reliable. They help in automating repetitive tasks, ensuring better code quality, and enhancing the overall developer experience when working with GraphQL. graphql-codegen is a tool that generates TypeScript types, React hooks, and other artifacts from your GraphQL schema and queries, ensuring type safety and reducing manual coding. graphql-tag is a small library that allows you to write GraphQL queries using template literals, making it easier to embed queries directly in your JavaScript or TypeScript code. graphql-tools is a set of utilities for building and manipulating GraphQL schemas, including schema stitching, type merging, and creating mock servers, which helps in developing and testing GraphQL APIs more effectively. optics-ts is a library for tracking and analyzing GraphQL query performance and usage, providing insights into query execution times, frequency, and other metrics to help optimize your GraphQL API and improve its efficiency.

Npm Package Weekly Downloads Trend

3 Years

Github Stars Ranking

Stat Detail

Package
Downloads
Stars
Size
Issues
Publish
License
optics-ts361,372900137 kB213 years agoMIT
graphql-codegen03,042-367-MIT
graphql-tag02,331-1004 years agoMIT
graphql-tools05,4232.61 kB1614 days agoMIT

Feature Comparison: optics-ts vs graphql-codegen vs graphql-tag vs graphql-tools

Type Safety

  • optics-ts:

    optics-ts is designed for type-safe query analysis and performance tracking, providing a type-safe API for instrumenting and analyzing your GraphQL queries.

  • graphql-codegen:

    graphql-codegen generates TypeScript types based on your GraphQL schema and queries, ensuring type safety throughout your application and reducing the risk of runtime errors.

  • graphql-tag:

    graphql-tag does not provide type safety on its own, but it works well with tools like graphql-codegen to generate types from the queries you define using its template literals.

  • graphql-tools:

    graphql-tools does not focus on type safety, but it allows you to define and manipulate your GraphQL schema in a type-safe manner if used with TypeScript.

Query Embedding

  • optics-ts:

    optics-ts does not embed queries; it analyzes queries at runtime to provide performance insights and metrics.

  • graphql-codegen:

    graphql-codegen does not embed queries directly; instead, it generates code based on the queries you provide, which can be defined anywhere in your codebase.

  • graphql-tag:

    graphql-tag allows you to embed GraphQL queries directly in your code using template literals, making it easy to define and reuse queries in a readable format.

  • graphql-tools:

    graphql-tools does not handle query embedding, as it focuses on schema creation and manipulation rather than query definition.

Schema Manipulation

  • optics-ts:

    optics-ts does not manipulate the schema; it works with the existing schema to analyze query performance and usage patterns.

  • graphql-codegen:

    graphql-codegen does not manipulate the schema; it reads the schema to generate types and other artifacts.

  • graphql-tag:

    graphql-tag does not manipulate the schema; it simply provides a way to define queries and fragments in a declarative manner.

  • graphql-tools:

    graphql-tools provides extensive utilities for schema manipulation, including merging multiple schemas, stitching them together, and creating mock implementations for testing.

Performance Optimization

  • optics-ts:

    optics-ts helps optimize your GraphQL API by providing insights into query performance, allowing you to identify and address slow or inefficient queries.

  • graphql-codegen:

    graphql-codegen optimizes the development process by generating code automatically, but it does not optimize query performance at runtime.

  • graphql-tag:

    graphql-tag has a minimal impact on performance when embedding queries, but it does not provide any optimization features for query execution.

  • graphql-tools:

    graphql-tools can help optimize schema design by allowing you to create more efficient schemas through stitching and merging, but it does not provide runtime performance optimization.

Ease of Use: Code Examples

  • optics-ts:

    Performance tracking with optics-ts

    import { createOpticsLink } from 'optics-ts';
    const link = createOpticsLink({
      url: '/graphql',
      client: myGraphQLClient,
    });
    
  • graphql-codegen:

    TypeScript types generation with graphql-codegen

    documents: './src/**/*.graphql'
    config:
      scalars:
        Date: string
        JSON: any
    plugins:
      - typescript
      - typescript-resolvers
    
  • graphql-tag:

    Query embedding with graphql-tag

    import { gql } from 'graphql-tag';
    const GET_USERS = gql`
      query GetUsers {
        users {
          id
          name
        }
      }
    `;
    
  • graphql-tools:

    Schema stitching with graphql-tools

    import { mergeSchemas } from '@graphql-tools/schema';
    const schema1 = makeExecutableSchema({ typeDefs, resolvers });
    const schema2 = makeExecutableSchema({ typeDefs, resolvers });
    const mergedSchema = mergeSchemas({ schemas: [schema1, schema2] });
    

How to Choose: optics-ts vs graphql-codegen vs graphql-tag vs graphql-tools

  • optics-ts:

    Choose optics-ts if you want to gain insights into your GraphQL query performance and usage, helping you identify slow queries and optimize your API for better efficiency.

  • graphql-codegen:

    Choose graphql-codegen if you want to automate the generation of TypeScript types and other artifacts from your GraphQL schema and queries, ensuring type safety and reducing boilerplate code.

  • graphql-tag:

    Choose graphql-tag if you need a lightweight solution for embedding GraphQL queries in your JavaScript or TypeScript code using template literals, making your queries more readable and maintainable.

  • graphql-tools:

    Choose graphql-tools if you are building complex GraphQL schemas and need utilities for schema stitching, type merging, and creating mock servers, which can help in developing and testing your API more effectively.

README for optics-ts

optics-ts

Build

optics-ts provides type-safe, ergonomic, polymorphic optics for TypeScript:

  • Optics allow you to read or modify values from deeply nested data structures, while keeping all data immutable.
  • Ergonomic: Optics are composed with method chaining, making it easy and fun!
  • Polymorphic: When writing through the optics, you can change the data types in the nested structure.
  • Type-safe: The compiler will type check all operations you do. No any, ever.

Documentation

Features

optics-ts supports lenses, prisms, traversals, removing items from containers, and much more!

Since optics-ts v2.2.0, there are two syntaxes for defining optics: method chaining (the default) and standalone optics (experimental). See the docs for more info!

Getting started

Installation:

npm install optics-ts

or

yarn add optics-ts

Here's a simple example demonstrating how lenses can be used to drill into a nested data structure:

import * as O from 'optics-ts'

type Book = {
  title: string
  isbn: string
  author: {
    name: string
  }
}

// Create a lens that focuses on author.name
const optic = O.optic_<Book>().prop('author').prop('name')

// This is the input data
const input: Book = {
  title: "The Hitchhiker's Guide to the Galaxy",
  isbn: '978-0345391803',
  author: {
    name: 'Douglas Adams',
  },
}

// Read through the optic
O.get(optic)(input)
// "Douglas Adams"

// Write through the optic
O.set(optic)('Arthur Dent')(input)
// {
//   title: "The Hitchhiker’s Guide to the Galaxy"
//   isbn: "978-0345391803",
//   author: {
//     name: "Arthur Dent"
//   }
// }

// Update the existing value through the optic, while also changing the data type
O.modify(optic)((str) => str.length + 29)(input)
// {
//   title: "The Hitchhiker’s Guide to the Galaxy"
//   isbn: "978-0345391803",
//   author: {
//     name: 42
//   }
// }

Another example that converts all words longer than 5 characters to upper case:

import * as O from 'optics-ts/standalone'

const optic = O.optic<string>().words().when(s => s.length >= 5)

const input = 'This is a string with some shorter and some longer words'
O.modify(optic)((s) => s.toUpperCase()(input)
// "This is a STRING with some SHORTER and some LONGER WORDS"

See the documentation for a tutorial and a detailed reference of all supported optics.

Development

Run yarn to install dependencies.

Running the test suite

Run yarn test.

For compiling and running the tests when files change, run these commands in separate terminals:

yarn build:test --watch
yarn jest dist-test/ --watchAll

Documentation

You need Python 3 to build the docs.

python3 -m venv venv
./venv/bin/pip install mkdocs-material

Run a live reloading server for the documentation:

./venv/bin/mkdocs serve

Open http://localhost:8000/ in the browser.

Releasing

$ yarn version --new-version <major|minor|patch>
$ yarn publish
$ git push origin main --tags

Open https://github.com/akheron/optics-ts/releases, edit the draft release, select the newest version tag, adjust the description as needed.