A narrow waist is a protocol or system that reduces the O(M x N) explosion problem.
Unix pipelines
For instance in bash: ls | wc -l
is a method to get the number of files and directories using the |
(pipe) operator. Here we have composed two programs: ls
for listing files, and wc -l
for counting lines. Without the ability to compose, ls
would need a --count
flag. Similarly, other things that can be counted would also need a count flag, such as counting the amount of processes: ps -e --count
. Instead we can just write ps -e | wc -l
. This prevents us from having to implement --count on in all our programs that list items on a line-by-line basis, which prevents a great deal of effort. This (the pipe) is a narrow waist.
Pipes transfer bytes from one end to the other. They're fast, and it doesn't matter what kind of bytes you pass through them, they pass all bytes regardless of form.
The web
Similarly, HTML/CSS/JS can be considered a narrow waist. I can defer to it a great deal of pain and effort. One can for instance use it to draw of triangles and rectangles. Have you ever written Vulkan or OpenGL directly? It's very verbose. Using an abstraction layer like the modern web greatly simplifies life.
Narrow waists are about simplifying life. Deferring that which is difficult to that which solves it. Life's only so short, it makes sense to not waste time.
I've recently made a little script that turns any HTML page into a slideshow. It's 35
lines long. All it does is replace the the id="slides"
object on page with children of the initial slides object when you press the navigation keys (j, k, Escape). It's so simple it's ridiculous. Try it!
Script
var children = []; var original = null; var index = -1; var slidenode = null; document.addEventListener("DOMContentLoaded", function(event) { slidenode = document.getElementById("slides"); children = [...slidenode.childNodes].filter(item => item.outerHTML !== undefined); original = slidenode.innerHTML; }); document.addEventListener('keydown', function(event) { if (slidenode == null) return; if (event.key == 'k') { if (index == -1) { index == 0; } index -= 1; } else if (event.key == 'j') { if (index == -1) { index == 0; } index += 1; } else if (event.key == 'Escape') { slidenode.innerHTML = original; index = -1; return; } else { return; } if (index >= children.length) { index = children.length - 1; } if (index < 0) { index = 0; } slidenode.innerHTML = children[index].outerHTML; });