Data URIs are useful for embedding resources in a page (e.g. a single HTML file containing all of its own CSS, JS, images, etc.)

This is different: it's a single file which can be parsed as either a HTML page or a JPEG. Hence, when a program expects a HTML page (like a browser loading a Web page), it will be parsed and displayed as a HTML page. When a program expects a JPEG file (like a browser loading the "src" of an "img" element) it will be parsed and displayed as a JPEG.

The trick is to use each format's comment syntax to hide the other format. Not sure if the HTTP headers need to be set differently for each request or not.

I think it may only work if you omit a Content-Type header. Checking Firefox's Network tab, it looks like the server isn't serving one for that page.

It's sending the "wrong" one --

    $ curl -I http://lcamtuf.coredump.cx/squirrel/
    HTTP/1.1 200 OK
    Date: Thu, 11 Aug 2016 05:18:00 GMT
    Server: Apache
    Last-Modified: Mon, 19 Sep 2011 23:31:49 GMT
    Accept-Ranges: bytes
    Content-Length: 135938
    Content-Type: text/html

Oh. Huh. My bad.

I guess browsers only forbid ignoring Content-Type for stuff like JS, then. For JPEG it's probably not a security concern.

It's not "embedded" like that, it's just an <img> tag that points to the same URL as the page.