Randy Liu's Blog and Documentation

website·Indexed 31 days ago

https://www.blog.randy-liu.com/

A collection of technical guides and personal insights covering frontend development with React and TypeScript, GraphQL (including Apollo Federation and CRUD APIs), SEO strategies (canonical URLs, backlinks, and structured data), data structures like Tries for Autocomplete, and reviews of Mac productivity tools from Setapp.

Tokens
16.3K
Snippets
60
Records
114
Agent score
50%

What's inside Randy Liu's Blog

  1. Overview of Apollo Federation

    Apollo Federation allows a GraphQL architecture to expose a single unified interface to clients, regardless of whether the backend is a monolith or a set of microservices. It enables different subgraphs to define relationships between entities, allowing a field in one subgraph to link to an entity in another. The core philosophy is that graph building should be declarative, code should be separated by concern rather than by types, and the resulting graph should be simple for clients to consume using spec-compliant GraphQL features.
  2. Overview of GraphQL Subscriptions

    GraphQL Subscriptions allow a server to push real-time updates to clients by maintaining a persistent connection. Unlike Queries, which are one-time requests, Subscriptions keep the connection open to stream results. This is ideal for low-latency requirements such as chat rooms, collaborative editing, or updating specific attributes of large objects without refetching the entire entity.
  3. Understand Apollo Federation for GraphQL Microservices

    Apollo Federation allows a GraphQL architecture to expose a single unified interface (gateway) to clients, hiding whether the backend is a monolith or a set of microservices. It manages the relationships between different subgraphs, enabling a field in 'subgraph A' to resolve or link to an entity residing in 'subgraph B'.
  4. Understand Apollo Federation for GraphQL Microservices

    Apollo Federation allows a GraphQL architecture to expose a single unified gateway interface to clients, hiding whether the underlying implementation is a monolith or a set of microservices. It enables the definition of relationships between different subgraphs, allowing a field in 'subgraph a' to resolve or link to an entity residing in 'subgraph b'.
  5. Use Presentify for screen annotations during presentations

    Presentify is a tool designed for drawing and highlighting directly on the screen. It is particularly useful for emphasizing key points or sketching diagrams during live presentations, video calls, or screen-sharing sessions.
  6. Understand Apollo Federation for GraphQL Microservices

    Apollo Federation allows a GraphQL architecture to expose a single unified interface (gateway) to clients, hiding whether the backend is a monolith or a collection of microservices. It enables the definition of relationships between different subgraphs, allowing a field in 'subgraph a' to link directly to an entity residing in 'subgraph b'.
  7. Understand GraphQL CRUD operations

    Unlike RESTful APIs that use different HTTP methods (GET, POST, PUT, DELETE) for CRUD, GraphQL typically uses a single HTTP POST method. The specific action is determined by the operation type in the request body:

    • Query: Used for Read operations.
    • Mutation: Used for Create, Update, and Delete operations.
  8. Design an Autocomplete system architecture

    A standard autocomplete system consists of an Input UI, a Controller, a Cache layer, and a Server. The request flow is as follows:

    1. User enters text in the Input UI.
    2. Input UI sends the query to the Controller.
    3. Controller checks the Cache for existing results.
    4. If a cache hit occurs, results are returned immediately to the Controller and then to the Results UI.
    5. If a cache miss occurs, the Controller requests data from the Server, which returns the results to the Controller, which then updates the Cache and returns the results to the Results UI.
  9. Understand Zero-Click searches in SEO

    A 'zero-click' search occurs when a user finds the answer to their query directly on the Search Engine Results Page (SERP) via a featured snippet or other rich result, without needing to click through to a website. This leads to a loss of potential organic traffic, with research suggesting up to two-thirds of Google searches end without a click.
  10. Use Mosaic for window layout management on macOS

    Mosaic is a window management tool available via Setapp that allows users to quickly organize their desktop layout. It supports customizable layouts to maximize screen real estate, making it suitable for multitasking workflows.
  11. Understand why standard HTTP caching is limited in GraphQL

    Standard HTTP caching (using Cache-Control, max-age, Etag, etc.) relies on unique Request URLs to identify resources. Because GraphQL typically uses a single endpoint (e.g., /graphql) and sends queries via POST payloads, HTTP caching mechanisms are generally ineffective. While using GET requests with query parameters is possible, it is discouraged because GraphQL queries can be deeply nested and complex, leading to URLs that exceed the length limits of browsers, proxies, or web servers.
  12. Understand the difference between API Gateways and GraphQL Gateways in microservices

    In a microservices architecture, a traditional API Gateway (like Nginx) routes requests based on URL paths (e.g., /api/post to a Post Server). However, because GraphQL typically uses a single /graphql endpoint, path-based routing is insufficient for managing shared schemas across services. A GraphQL Gateway solves this by aggregating multiple service-specific graphs (called 'subgraphs') into a single unified graph (called a 'supergraph'), allowing for type references and cross-service relations while maintaining a single entry point for the client.