Skip to content

Latest commit

 

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date
 
 
 
 

Repository files navigation

How xAI works

What actually happens from the moment you press Enter until the text appears on your screen?


image

1. Browser / Client side (your device)

  • You type the message and hit Enter (or click send).
  • The frontend JavaScript collects the full conversation history (previous messages + your new one), any system instructions, and metadata.
  • It packages this into an HTTP request (usually a POST to an API endpoint) as JSON.
  • The request is sent over the internet (TLS encrypted).

2. Network and load balancing

  • The request travels through the internet to xAI’s servers.
  • It hits a load balancer / API gateway that authenticates the request, checks rate limits, and routes it to an available inference server.

3. Pre-processing on the server

  • The raw text is cleaned and normalized if needed.
  • The entire conversation is passed through the tokenizer.
    Every piece of text is converted into a sequence of integer token IDs.
  • Special tokens are added (beginning-of-sequence, role markers such as user/assistant, end-of-turn, etc.).
  • The token sequence is turned into embeddings: each token ID is looked up in a large embedding matrix and becomes a high-dimensional vector.
  • Positional information is added so the model knows the order of the tokens.

4. Model inference (the heavy computation)

This is the core “forward pass”:

  • The sequence of embedding vectors enters the Transformer stack (many layers).
  • In each layer:
    • Self-attention: every token computes Query, Key, and Value vectors. Attention scores are calculated (how much each token should focus on every other token). The values are weighted and summed. This is done in parallel across multiple attention heads.
    • The attention output is combined with the original input (residual connection) and normalized.
    • Feed-forward network: each token’s vector is passed through a multi-layer neural network (usually with a non-linearity such as SwiGLU or GeLU).
    • Another residual connection + normalization.
  • This process repeats for every layer in the model.
  • After the final layer, a linear projection (the “lm_head”) converts the last token’s vector into a large vector of logits — one number for every possible token in the vocabulary (tens or hundreds of thousands of possible next tokens).

5. Sampling the next token

  • The logits are turned into probabilities (usually with a softmax, often modified by temperature, top-p, top-k, or other sampling methods).
  • One token is chosen according to those probabilities.
  • That token is appended to the sequence.

6. Autoregressive generation loop

  • Steps 4 and 5 are repeated over and over: the model now sees the new token, runs another full forward pass, predicts the next token, and so on.
  • This continues until the model produces a special end-of-sequence token or reaches a maximum length limit.
  • In practice, modern serving systems generate tokens one by one (or in small batches) and stream them immediately rather than waiting for the entire answer.

7. Streaming the response back

  • As each new token (or small group of tokens) is generated, it is sent back over the network to your browser, usually via Server-Sent Events or a similar streaming protocol.
  • The backend may also apply light post-processing (safety filters, formatting, etc.) before sending.

8. Browser rendering

  • Your browser receives the stream of tokens.
  • JavaScript converts the token IDs (or the already-decoded text) back into readable characters.
  • The text is incrementally inserted into the chat interface so you see the answer appear word by word (or token by token).
  • Once the stream ends, the full message is finalized on the page.

Summary of the full chain

You press Enter
    → Browser packages conversation as JSON
    → Network request to servers
    → Tokenization + embedding
    → Repeated Transformer forward passes (attention + feed-forward)
    → Next-token sampling
    → Loop until finished
    → Tokens streamed back
    → Browser decodes and displays the text

That is the actual sequence of operations at a technical level. There are many engineering details underneath (KV caching for efficiency, continuous batching, quantization, specialized hardware such as GPUs/TPUs, etc.), but the logical flow above is what happens every time you send a message.

image

Deeper

1. Tokenization (Byte-Pair Encoding or similar)

Most modern models use a subword tokenizer (BPE, WordPiece, or Unigram).

  • The vocabulary size is typically 32k–256k tokens.
  • Rare words are broken into smaller pieces.
  • Special tokens are added:
    <|begin_of_text|>, role markers (user, assistant), <|end_of_turn|>, etc.

Result: a list of integer token IDs, e.g. [128000, 882, 374, ...]

2. Embedding + Positional Encoding

image

3. One Transformer Layer (the core computation)

image image

4. KV Cache (critical for efficient generation)

During autoregressive generation we do not recompute attention over the entire past every time.

  • After processing the prompt, we store the Key and Value vectors for every layer and every past token.
  • When generating the next token, we only compute ( Q, K, V ) for the new token and concatenate the new ( K ) and ( V ) onto the cached ones.
  • Attention then becomes:
image

5. Final projection and sampling

image

6. Serving / Systems level (what makes it fast)

  • Continuous batching: many user requests are packed together dynamically.
  • PagedAttention / KV cache management: KV cache is stored in non-contiguous blocks so memory can be shared and paged efficiently.
  • Quantization: weights often run in FP8, INT8, or INT4 to reduce memory and increase speed.
  • Tensor / Pipeline parallelism: the model is split across many GPUs.
  • Speculative decoding (sometimes): a smaller draft model proposes several tokens, the large model verifies them in parallel.

7. Streaming back to the browser

As soon as a token is sampled, it is detokenized and sent over the network (Server-Sent Events or WebSocket). The browser appends the decoded text to the DOM incrementally.


About

Technical walkthrough of the full pipeline, with the important mathematical and systems-level details.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors