function bubbleSort(arr, compareFn) {
const a = [...arr];
for (let i = 0; i < a.length; i++) {
for (let j = 0;
j < a.length - i - 1; j++) {
if (compareFn(a[j], a[j+1]) > 0) {
[a[j], a[j+1]] = [a[j+1], a[j]];
}
}
}
return a;
}
function mergeSort(arr, compareFn) {
if (arr.length <= 1) return arr;
const mid = Math.floor(arr.length / 2);
const left = mergeSort(
arr.slice(0, mid), compareFn
);
const right = mergeSort(
arr.slice(mid), compareFn
);
return merge(left, right, compareFn);
}
function merge(left, right, compareFn) {
const result = [];
let i = 0, j = 0;
while (i < left.length
&& j < right.length) {
if (compareFn(
left[i], right[j]) <= 0) {
result.push(left[i++]);
} else {
result.push(right[j++]);
}
}
return [
...result,
...left.slice(i),
...right.slice(j)
];
}
| Algorithm | 10,000 items | Complexity |
|---|---|---|
| Bubble Sort | ~2,800ms | O(n²) |
| Merge Sort | ~35ms | O(n log n) |
| JS .sort() | ~28ms | O(n log n) |
Build a <SortingVisualizer> React component: colorful bars that swap and merge in real-time. Toggle between bubble sort and merge sort. Watch the algorithms work — see WHY one is faster.
Replace bubble sort with multi-field sorting: sort by date descending, then by name ascending for same dates. Use JavaScript's built-in .sort() with a custom comparator.
git switch -c feature/PIXELCRAFT-059-sorting
git add src/
git commit -m "Replace O(n²) sort with efficient sorting + visualizer (PIXELCRAFT-059)"
git push origin feature/PIXELCRAFT-059-sorting
# PR → Review → Merge → Close ticket ✅
Sorting analysis is the canonical CS problem.
Understanding WHY merge sort is O(n log n) — not just memorizing it — teaches you to analyze ANY algorithm.