<- Back to list

Sorting algorithms

simonwillison.net

AIprogrammingtoolsAI/LLMprogramming/Pythonprogramming/JavaScript

AI 摘要

作者使用 Claude Artifacts 在手机上创建了常见排序算法的动画演示,包括冒泡排序、选择排序、插入排序、归并排序、快速排序和堆排序。随后通过克隆 Python 的 GitHub 仓库添加了 Timsort 算法,并增加了“全部运行”功能以网格形式同时展示所有算法的动画。

Sorting algorithms

Today in animated explanations built using Claude: I've always been a fan of animated demonstrations of sorting algorithms so I decided to spin some up on my phone using Claude Artifacts, then added Python's timsort algorithm, then a feature to run them all at once. Here's the full sequence of prompts:

Interactive animated demos of the most common sorting algorithms

This gave me bubble sort, selection sort, insertion sort, merge sort, quick sort, and heap sort.

Add timsort, look up details in a clone of python/cpython from GitHub

Let's add Python's Timsort! Regular Claude chat can clone repos from GitHub these days. In the transcript you can see it clone the repo and then consult Objects/listsort.txt and Objects/listobject.c. (I should note that when I asked GPT-5.4 Thinking to review Claude's implementation it picked holes in it and said the code "is a simplified, Timsort-inspired adaptive mergesort".)

I don't like the dark color scheme on the buttons, do better

Also add a "run all" button which shows smaller animated charts for every algorithm at once in a grid and runs them all at the same time

It came up with a color scheme I liked better, "do better" is a fun prompt, and now the "Run all" button produces this effect:

Animated sorting algorithm race visualization titled "All algorithms racing" with controls for SIZE (50) and SPEED (100), Stop and Shuffle buttons, and a "Back to single" button. A legend shows Comparing (pink), Swapping (orange), Pivot (red), and Sorted (purple) indicators. Seven algorithms race simultaneously in card panels: Bubble sort (Sorting… — Comparisons: 312, Swaps: 250), Selection sort (Sorting… — Comparisons: 550, Swaps: 12), Insertion sort (Sorting… — Comparisons: 295, Swaps: 266), Merge sort (#3 — Comparisons: 225, Swaps: 225), Quick sort (#2 — Comparisons: 212, Swaps: 103), Heap sort (Sorting… — Comparisons: 358, Swaps: 203), and Timsort (#1 — Comparisons: 215, Swaps: 332). Finished algorithms (Timsort, Quick sort, Merge sort) display fully sorted purple bar charts and are highlighted with purple borders.

Tags: algorithms, computer-science, javascript, sorting, ai, explorables, generative-ai, llms, claude, vibe-coding

Sorting algorithms