AI Roadmap LLM Learning Roadmap
✨ Awesome-Anything
Awesome-AI-Tutorials
Awesome-AI-Researchs
Awesome-GitHub-Repos
Awesome-AI-Examples🖼️ Digital Image Processing
DIP I Image Demosaicing and Histogram Manipulation
DIP II Image Denoising
DIP III Edge Detection
DIP IV Digital Half-toning
DIP V Geometric Image Modification🍃 LLM Components
1.1 Tokenization
1.2 Embedding
1.3 Attention
1.4 FFN, Residual Addition, and LN
1.5 Positional Encoding
1.6 Architecture & Decoding Policy🌱 LLM Pre-training
2.1 Pre-training Definition
2.2 Pre-training Data
2.3 Pre-training Workflow
2.4 Continued Pre-training (CPT)
2.5 Pre-training Evaluation☘️ LLM Post-Training
3.1 Supervised Fine-Tuning (SFT)
3.2 Reinforcement Learning
3.3 RLHF: Reinforcement Learning from Human Feedback
3.4 Optimizing PPO-Based Algorithms
3.5 Direct Preference Optimization (DPO)🍀 LLM Popular Models
4.1 BERT & Variants
4.2 PaLM Series
4.3 GPT Series
4.4 LLaMA Series
4.5 GLM Series
4.6 Qwen Series
4.7 DeepSeek Series
4.8 MOE Series
4.9 Other🪴 LLM Applications
5.1 Prompt Engineering
5.2 LLM-based Agents
5.3 Retrieval-Augmented Generation (RAG)
5.4 Enterprise-level RAG Practice (I)
5.5 Enterprise-level RAG Practice (II)🌿 LLM Optimization
6.1 GPU Usage Analysis
6.2 Latency Analysis for Inference
6.3 FlashAttention
6.4 PagedAttention
6.5 Packing for Efficient Training
6.6 PEFT🌾 LLM Compression
7.1 Quantization
7.2 Pruning
7.3 Knowledge Distillation🌵 LLM Hands-on Practice
8.1 nanoGPT: Training a GPT from Scratch
8.2 Instruction Fine-Tuning Qwen3-0.6B: A Minimal Working Example
8.3 OpenRLHF: SFT Qwen3-0.6B and Code Analysis
8.4 OpenRLHF: Reward Model Training and Code Analysis
8.5 OpenRLHF: PPO Tutorial and Code Analysis🌴 LLM Must-read Papers
9.1 Technical Reports Explained
9.2 MedLLM
9.3 o1 Techinical Paper
9.4 Prompting
9.5 LLM-as-Judge🌳 LLM Q&A
10.1 Why GRPO training loss starts at 0
10.2 VLM-R1 Reproduction Results
10.3 KL(P||Q) or KL(Q||P)?
10.4 Left Padding or Right Padding?
10.5 What is QK-Norm?
10.6 Why LLM training rarely adopts Dropout?
10.7 Dropout and DropPath🐝 VLM Image Encoders
11.0 Introduction
11.1 Vision Transformer
11.2 CLIP
11.3 BLIP
11.4 EVA
11.6 BLIP-2
11.7 SigLIP📝 MISC.
OpenAI ChatGPT Progression⏳Claude Sonnet 4 Test with Sandtris
Testing AI Models on Building a Sandtris Web Game: Claude Sonnet 4 vs Gemini 2.5 Pro vs ChatGPT o4-Mini-High
The generative AI race has heated up in 2025, with increasingly capable models from Anthropic, Google, and OpenAI pushing the boundaries of what’s possible in code generation. To see how these models stack up in a creative, technically challenging task, I set out to build a simple browser-based Sandtris game (think: falling sand meets Tetris) — and asked three leading models to help: Claude Sonnet 4, Gemini 1.5 Pro, and ChatGPT-4 Mini-High.
The Challenge
The task was to develop a Sandtris game — a minimalist web game where pixel-based particles/sands fall and interact with each other, within a Tetris-like shape-filling gameplay. Requirements:
- A playable UI in the browser
- Basic physics for falling sand
- Interactive controls (drop pieces, rotate)
I asked each model to implement this game based on a simple, even unpolished instruction with an additional image
Instruction: Can you reproduce the front end and game on the website? You should implement this game in just a single HTML file. This game is called sandtris, which means tetrominoes in the Tetris become sand after they land on the ground. So you should increase the resolutions of tetrominos, so each tetromino can fall apart on the ground. Also, you should simulate the physical reactions between sands.
The uploaded image is from this website as shown below.
Claude Sonnet 4
I started with Claude Sonnet 4, full of high expectations — but ended up disappointed. The initial version it produced didn’t even run properly. While the UI looked decent, the gameplay was broken: the falling speed was painfully slow (the down key is pressed to accelerate already), tetrominoes collided awkwardly against the left wall, and their colors changed unpredictably.
After this, I further instruct it to make some changes with still simple prompt (I do the same for all tested models)
Instruction: everything is not right, especially when the tetrominos fall down on the ground, everything is draged to the left wall and the color is wrong from then
It seemed like Claude understood what was going wrong and began refining the code, eventually leading to the result below.
Well, the tetrominoes no longer crash into the left wall — but the colors are still off, and the falling speed remains sluggish. Maybe this model just cannot do well under simple and sloppy prompts.
Here is its code
v1
v2
ChatGPT 4o-Mini-High
OpenAI’s 4o-mini-high model wasn’t bad at all. It produced a minimal but functional demo right from the start. The falling speed felt much more natural, though the UI was fairly basic, and the tetrominoes didn’t quite resemble actual “sand” particles.
Next, I asked it to improve the game further, aiming for a more realistic sand effect by increasing the resolution of the particles.
Instruction: Well it works fine that at least you simulate the physics reactions. but the tetrominoes should be in a more nuanced resolutions so we can actually call them sands.
However, this time it introduced some bugs, and the game wouldn’t even start, resulting in the state shown below.
The code is attached
v1
v2
Gemini 2.5 Pro
Google’s Gemini 2.5 Pro stood out for its accuracy. From the same simple prompt I used with the other models, it generated solid, runnable code that was largely free of bugs.
- Its physics engine was the most robust of the three, handling particle interactions with realistic cascading effects.
- It accurately reproduced the UI from my uploaded image, even ads...
- The performance was smooth, with a decent falling speed.
- We even have a “start” option
The only downsides were:
- It initialized the game with three sand piles already fallen (like in the image, maybe it cannot tell if it’s intended or not).
- The tetrominoes didn’t cancel each other out upon contact.
Perhaps the model simply didn’t understand how the cancellation mechanic was supposed to work, so I provided more specific instructions.
Instruction: close enough, you should set a rule to make them clear out: when the same color can connect each other from the left wall to the right wall, then this connected area of this color got cleared out
Impressively, it became highly playable after the adjustments!
The code is attached here as well
v1
v2
Conclusion
So yeah — out of the three, Google’s Gemini 2.5 Pro ended up performing the best. It was actually the only one that delivered a solid, playable version of the game by the end.
Of course, this is just one test — and to be honest, I’ve been a bit obsessed with this game lately. With a more detailed prompt or a different angle, the results could totally change. Maybe Gemini just got lucky. Maybe it’s secretly been trained on Sandtris. Maybe Claude 4 works better with Cursor? Maybe Opus 4 is better. I don’t know. Anyway, this was a fun little experiment, and I’m glad to share it with you.
Prev
OpenAI ChatGPT Progression
Next
What DeepSeek-R1's Surge Teaches Us About SEO
Loading...