Learners Store

ChatGPT feels intelligent because it understands context, meaning, and relationships between words.
The technology that makes this possible is called Transformer Architecture.

In this post, we’ll explain:

• What Transformer Architecture is
• Why it was created
• How it works (step by step)
• Why ChatGPT depends on it

All explained in simple language, without heavy math.

---

What Is Transformer Architecture?

Transformer Architecture is a deep learning model designed to understand and generate language efficiently.

In simple words:

A Transformer reads an entire sentence at once and decides which words are important to understand the meaning.

This is very different from older models that read text one word at a time.

---

Why Was Transformer Architecture Needed?

Before Transformers, models like RNN and LSTM had problems:

• They processed text sequentially (slow)
• They forgot long-range context
• They struggled with long sentences
• Training was inefficient

Example Problem (Old Models)

Sentence:

“The book that you gave me yesterday is very interesting.”

Old models could forget what “book” refers to by the time they reach “interesting”.

👉 Transformers solved this.

---

Why Transformers Are the Heart of ChatGPT

ChatGPT needs to:

• Understand long conversations
• Remember context
• Generate meaningful responses
• Scale to massive data

Transformers provide:

• Context awareness
• Parallel processing
• High accuracy
• Scalability

Without Transformers, ChatGPT would not exist.

---

Core Idea Behind Transformers (Simple Explanation)

The key idea is Attention.

Instead of reading words in order, the model looks at all words at once and decides which ones matter most.

This mechanism is called Self-Attention.

---

What Is Self-Attention? (Very Simple)

Self-attention answers this question:

“Which words should I focus on to understand this word?”

Example:

Sentence:

“I went to the bank to deposit money.”

The word “bank” should focus on:

• “deposit”
• “money”

Not on:

• “went”
• “to”

That’s self-attention.

---

Main Components of Transformer Architecture

Let’s break it down simply.

---

1. Input Embeddings

Words are converted into numbers called embeddings.

Why?

• Computers don’t understand text
• They understand numbers

Each word becomes a vector that represents its meaning.

---

2. Positional Encoding

Transformers process all words at once, so they need to know word order.

Positional encoding:

• Adds position information
• Helps differentiate:
  • “Dog bites man”
  • “Man bites dog”

---

3. Self-Attention Layer (Most Important Part)

Each word:

• Looks at all other words
• Assigns importance scores
• Collects relevant information

This helps understand:

• Context
• Relationships
• Meaning

---

4. Multi-Head Attention

Instead of one attention mechanism:

• Transformers use multiple attention heads

Each head focuses on different things:

• Grammar
• Meaning
• Relationships
• Syntax

👉 This improves understanding.

---

5. Feed Forward Neural Network

After attention:

• Data passes through a neural network
• Helps refine understanding
• Adds non-linearity

---

6. Encoder and Decoder

Encoder:

• Reads and understands input
• Builds context

Decoder:

• Generates output
• Predicts next word

👉 ChatGPT mainly uses a Decoder-only Transformer (GPT).

---

How Transformers Generate Text (ChatGPT Flow)

1. User enters a prompt
2. Text is tokenized
3. Tokens go through Transformer layers
4. Model predicts next word
5. Process repeats until response is complete

Each prediction uses context + attention.

---

Why Transformers Are So Powerful

Key Advantages

• Handle long context
• Train faster using parallel processing
• Scale to billions of parameters
• Deliver human-like responses

That’s why:

• ChatGPT
• Google BERT
• GPT-4/5
• T5

All use Transformers.

---

Transformer vs Traditional Models

Feature	RNN / LSTM	Transformer
Processing	Sequential	Parallel
Long context	Poor	Excellent
Speed	Slow	Fast
Scalability	Limited	Massive

---

Why Freshers Should Learn Transformers

Understanding Transformers helps you:

• Understand ChatGPT internally
• Work with modern AI systems
• Answer AI interview questions
• Build intelligent applications

You don’t need to invent Transformers — just understand the concept.

---

Final Summary

Transformers are powerful because they understand context, not just words.

They are the brain behind ChatGPT, enabling:

• Natural conversation
• Context retention
• Accurate responses

If ChatGPT is the product,
Transformer Architecture is the engine.

GraphQL subscriptions rely on WebSockets to provide real-time updates.
Two important lifecycle hooks in this process are onConnect and onDisconnect.

This article clearly explains:

• What onConnect and onDisconnect are
• Why they are needed
• When and how they are used
• Real-world use cases

---

What Are onConnect and onDisconnect?

In GraphQL subscriptions:

• onConnect runs when a client establishes a WebSocket connection
• onDisconnect runs when a client disconnects from the WebSocket

Think of them as entry and exit points of a real-time connection.

---

What Is onConnect in GraphQL Subscriptions?

Definition

onConnect is a callback function that executes when a client successfully connects to the GraphQL subscription server via WebSocket.

---

What Happens During onConnect?

When a client connects:

1. WebSocket connection is opened
2. Authentication data is sent (e.g., JWT token)
3. onConnect is triggered on the server
4. Server validates the client
5. Context is created for subscriptions

---

Why onConnect Is Important

onConnect is mainly used for:

• Authentication & authorization
• Validating user identity
• Initializing connection-level data
• Logging active connections

👉 Without onConnect, subscriptions would be insecure.

---

Real-World Example of onConnect

Example use cases:

• Validate JWT token
• Identify logged-in user
• Reject unauthorized users
• Track online users

Simple analogy:

onConnect is like checking an ID card before entering a secure building.

---

What Is onDisconnect in GraphQL Subscriptions?

Definition

onDisconnect is a callback function that runs when a client disconnects from the WebSocket server.

---

What Happens During onDisconnect?

When a client disconnects:

1. User closes browser or app
2. Network connection drops
3. WebSocket closes
4. onDisconnect is triggered
5. Server cleans up resources

---

Why onDisconnect Is Important

onDisconnect is used to:

• Release server resources
• Stop listening to events
• Update user online/offline status
• Clean up memory

👉 Without this, servers may leak resources.

---

Real-World Example of onDisconnect

Common use cases:

• Mark user as offline
• Remove user from active connections list
• Stop background listeners
• Log disconnection events

Simple analogy:

onDisconnect is like signing out when leaving the building.

---

When Are onConnect and onDisconnect Triggered?

Event	Hook Triggered
WebSocket connection established	onConnect
WebSocket connection closed	onDisconnect
Browser tab closed	onDisconnect
Internet lost	onDisconnect

---

Where Do onConnect and onDisconnect Fit in Subscription Lifecycle?

1. Client opens WebSocket connection
2. onConnect runs
3. Client starts subscriptions
4. Server sends real-time updates
5. Client disconnects
6. onDisconnect runs

---

Common Interview Question

Q: Can onConnect reject a client connection?

Answer:
Yes. If authentication fails inside onConnect, the server can reject the WebSocket connection and prevent subscriptions.

---

Best Practices

• Always validate authentication in onConnect
• Keep onConnect lightweight
• Clean up all resources in onDisconnect
• Log connections for debugging
• Handle unexpected disconnects

---

When Should You Use onConnect and onDisconnect?

Use them when:

• Authentication is required for subscriptions
• You need user presence tracking
• You want secure real-time communication
• You need connection-level context

---

Final Summary

Hook	Purpose
onConnect	Authenticate & initialize WebSocket connection
onDisconnect	Cleanup & handle connection termination

onConnect = entry gate
onDisconnect = exit gate

Understanding these two hooks is essential for building secure, scalable real-time GraphQL applications.

Real-time applications are becoming standard in modern web development, and GraphQL WebSocketLink plays a key role in enabling this. Because of this, many companies ask WebSocketLink interview questions to test a candidate’s understanding of real-time data handling in GraphQL.

This post covers the most important WebSocketLink interview questions with easy-to-understand answers.

---

1. What Is WebSocketLink in GraphQL?

Answer:
WebSocketLink is a GraphQL link used to handle real-time communication between the client and server using WebSockets. It is mainly used for GraphQL subscriptions.

In simple terms:

WebSocketLink keeps a persistent connection open so the server can send updates to the client instantly.

---

2. Why Do We Need WebSocketLink in GraphQL?

Answer:
Normal GraphQL queries and mutations use HTTP, which is request–response based. This is not suitable for real-time updates.

WebSocketLink is needed because:

• HTTP connections close after one response
• Real-time data requires a continuous connection
• Subscriptions need server-to-client push

---

3. What Are GraphQL Subscriptions?

Answer:
Subscriptions allow clients to listen for data changes instead of requesting data repeatedly.

Examples:

• New chat message
• Live notifications
• Stock price updates

👉 Subscriptions work best with WebSocketLink.

---

4. How Is WebSocketLink Different from HTTPLink?

Answer:

Feature	HTTPLink	WebSocketLink
Connection	One-time	Persistent
Real-time support	❌ No	✅ Yes
Best used for	Queries & Mutations	Subscriptions
Server push	❌ No	✅ Yes

---

5. Can WebSocketLink Handle Queries and Mutations?

Answer:
Technically yes, but best practice is:

• Queries & Mutations → HTTPLink
• Subscriptions → WebSocketLink

In real projects, both links are used together using link splitting.

---

6. What Is Link Splitting in Apollo Client?

Answer:
Link splitting means routing GraphQL operations to different links based on their type.

Example:

• If operation is a subscription, use WebSocketLink
• Otherwise, use HTTPLink

This allows one client to support both real-time and normal requests efficiently.

---

7. When Should You Use WebSocketLink?

Answer:
Use WebSocketLink when your application needs:

• Real-time updates
• Instant UI refresh
• Continuous data streams

Common use cases:

• Chat applications
• Live dashboards
• Trading platforms
• Notifications systems

---

8. When Should You Avoid WebSocketLink?

Answer:
Avoid WebSocketLink if:

• Your app is mostly CRUD-based
• Data updates are rare
• Real-time behavior is not required

In such cases, HTTP GraphQL is sufficient.

---

9. How Does WebSocketLink Improve Performance?

Answer:
WebSocketLink:

• Eliminates repeated HTTP requests
• Reduces network overhead
• Pushes updates only when data changes

This leads to:

• Faster response time
• Better user experience
• Lower server load

---

10. How Is Authentication Handled in WebSocketLink?

Answer:
Authentication is usually handled:

• During the initial WebSocket connection
• Using headers or connection parameters (like JWT tokens)

Once authenticated, the same connection is reused for all subscriptions.

---

11. What Are the Challenges of Using WebSocketLink?

Answer:
Some common challenges are:

• Managing long-lived connections
• Handling reconnections
• Scaling WebSocket servers
• Security and authentication

However, these are manageable with proper architecture.

---

12. Is WebSocketLink Mandatory for Subscriptions?

Answer:
No, WebSocketLink is not the only option, but it is the most common and recommended approach for GraphQL subscriptions in production applications.

---

13. How Does WebSocketLink Work Internally?

Answer (High-level):

1. Client opens a WebSocket connection
2. Client subscribes to an event
3. Server listens for data changes
4. Server pushes updates to the client
5. Client receives updates in real time

---

14. What Is the Role of WebSockets in GraphQL?

Answer:
WebSockets provide:

• Full-duplex communication
• Persistent connections
• Low-latency data transfer

GraphQL uses WebSockets mainly for subscriptions, and WebSocketLink acts as the bridge.