Why is this currently #6 on the HN front page?
Because someone took time to make this, and we tend to approach Show HN projects with an open mind.If it doesn't work on your browser, then try another one. The OP isn't asking you to buy anything or force anything down your throat.
However, for many experiments like this, they're doing something somewhat novel using a tech a single browser has just introduced - in those cases, it's limitations that lead to lack of interop. In this case, it just seemed a bit disappointing. That is subjective of course, but it was my - I think warranted - first reaction.
much more impressive drawings have been created than this.
The added animation doesn't add much.
You say it's subjective, but when you start posting things like the above, you're deeming this project as unworthy of being on HN just because you feel it's "novel". The OP never claims the technology is new or cutting-edge, so why even bring that up? And there's really no need to link other css artworks in an attempt to undermine the work at hand.Given that I was additionally mis-attributing the non-cross-browser functionality to the author (see edit - it works fine in Firefox), my own subjective reaction to it is probably that little bit more unfair again now.
All browsers do this. Firefox implements around 88 properties (30 of these are "logical properties", which aren't exactly new properties) that Chrome doesn't[1] and Chrome implements around 68 properties that Firefox doesn't[2].
The numbers are a bit skewed here. My method of collecting the list of "properties that Firefox implements" included preffed-off properties, but the same is not true for Chrome, so for example the `grid` property shows up as implemented in Firefox but not Chrome even though both have it behind a pref/flag.
However, there are some properties implemented in Firefox without being behind a pref (ruby-align, scroll-snap-foo, image-orientation are examples).
-------------------
I do feel that in general Blink does push a lot of nonstandard (or not on the standards path) features into the web at times. But I don't have anything to back that assertion up.
Blink is being interoperable in this particular case.
[1]: https://manishearth.github.io/css-properties-list/?stylo=sho...
[2]: https://manishearth.github.io/css-properties-list/?stylo=sho...
The problem arises when the experimentation is done with entirely new features that the browser wants to push (features which haven't been discussed and somewhat settled on with other browsers). If they aren't behind a flag, sites start using it, and then you have to support the legacy syntax forever.
clip-path is on the standards track. It's not going to change much. So browser vendors exposing it by default is fine.
(However, if you're building an experiment using these, at least test in other browsers and put up a warning that it won't work in some browsers. A lot of the interior issues today are because folks only bother to test in chrome. Ultimately this means that all browsers have to copy Chrome bugs to make things work.)
Dude, that is highly subjective and you can't deny it's really impressive done. Stop being a fucking douchebag. I for one thinks this beats both your links.
---
It's Webkit/Blink-only - no support for other browsers. It says it uses clip-path and variables, both supported in Firefox, so I see no compelling reason for this.
Also viewing it in Chrome, I don't see anything that would actually require the use of clip-path or variables - arbitrary triangles have been possible in CSS since the beginning, and much more impressive drawings have been created[0][1] than this. The added animation doesn't add much.
Why is this currently #6 on the HN front page?
[0] http://www.subcide.com/experiments/fail-whale/
[1] https://pattle.github.io/simpsons-in-css/