CSS Houdini Interactive Introduction | Hacker News Reader

CSS Houdini Interactive Introduction

houdini.glitch.me

73 pointsdimtion28 comments

I really hope this tech doesn't take off - the web has been so successful _because_ it was declarative and not imperative. Now we're going to be baking in all the subtleties of Chrome and/or Firefox's handling of callbacks in a language that was never really designed to run inside of a layout engine.

Yes, a declarative web API is _far_ harder to get right, but the web community has created an amazing long-term compatibility story. It _should_ be difficult to add things to the web-at-large precisely because it has to live, essentially, forever.

I also worry about the increase in security surface area. A ton of additional C-level operations exposed to JS in all browsers. What could go wrong?

How are these C level operations?

It already took off.

Even if Houdini fails adoption, WebAssembly + Canvas/WebGL/WebGPU will do it.

https://www.qt.io/qt-examples-for-webassembly

https://platform.uno/

https://blogs.autodesk.com/autocad/autocad-web-app-google-io...

https://dotnet.microsoft.com/apps/aspnet/web-apps/client

Respectfully, that's a stretch - WebAssembly + (display tech) is a completely different stack in the browser. Houdini is bolting on a bunch of imperative stuff directly inside the browser engine with knock-on effects up and down throughout all of the web umbrella technologies.

With a wasm+web hybrid, there's a clear separation between the imperative wasm bits and the declarative web bits, so you can even combine them in ways that allow both stacks to perform well.

Houdini is not that much different from CSS Shaders.

I don't consider it a stretch, as I see a future where Flash gets its revenge and HTML is only used to import the starting WASM module, like on those Qt WebAssembly demos.

> Houdini is not that much different from CSS Shaders.

CSS shaders, like GL shaders, are declarative programs that look somewhat imperative. The GPU makes the decisions on how to shard/distribute those.

As for your second point, I agree to some degree. I don't necessarily see an issue with it - the two different models make sense in different places.

I tried those too... after three seconds of waiting and watching the "Downloading..." message with no app loaded, I felt the same dreadful feeling I used to get when I'd see a Java applet. I'm sure there are some use cases that will benefit from this, but I'm bummed thinking about how much crap is going to be needlessly delivered in a clunky way if we return to that HTML-as-bootloader app paradigm.

Just like all those SPAs used to display text.

> a language that was never really designed to run inside of a layout engine.

They should make Houdini available to use not just with JS but also with WebAssembly. Then you could use a more fitting language of your own choice.

I wrote a 'scratch off' card[1] using the CSS paintlet API a little while ago to see what it was like to work with. There were a few annoying quirks (basically Chrome only, lots of talk without much forward motion, not much that you can't do with a plain old canvas) but there's a lot of potential.

[1] Working example: https://scratchy.ooer.com/ - click and drag to scratch off the symbols. The code lives at https://github.com/onion2k/scratchy

I feel like this page was designed to be ironically bad to mask the fact that it's actually just bad. Why make it so difficult to understand what's going on? Is this glitch page somehow part of the actual WC3 project?

I was literally just watching this excellent cssconf talk on Houdini https://youtu.be/1W79T2ibd5Y

I am put off by a poorly designed web page. Someone in the Houdini group need to redesign the page.

It looks fine. This is ZippyDB: http://www.zippydb.com/

And Facebook uses on their Redis cluster. Design is important but far from the most important.

Hahahah ZippyDB landing page is hilarious. At least on mobile, interactive text elements sitting on top of interactive text elements...making it both difficult to read AND difficult to interact with.

I don't think thats the same ZippyDB Facebook uses. Theirs is developed for internal use on top of RocksDB, not Redis. (at least any public info I could find out about it), this looks like a (purposeful?) name collision to cause confusion.

You might be right but I am like 90% sure I found the link directly in an article on FB's engineering blog.

I could def be wrong though.

Honestly, it feels like the web is so bloated sometimes. Are the fundamentals really that difficult? We have raw CSS and at most we can have a layer above it that generates manage-able CSS (e.g. SASS). Why introduce all this un-needed complexity?

Can you give examples of what you consider to be the bloated web? From what I can tell, the most popular websites other than Youtube are still all text and images, but have enormous file sizes because of the million ad and tracking scripts working in the background.

I expected someone to emulate houdini in css

Seriously, how long do we have to wait until the browser is just a language VM and a drawable surface and you supply your own programming language and layout engine?

Like, hey, this URL just points to say, a QT app, and then it runs in this "browser" window over the network. Where have I heard of this before...

Everything else just feels like loads of duct tape on top of an over-stressed document browsing paradigm. Just rip it out completely.

Java applet?

You mean like targeting WASM and drawing to a canvas element?

Here are your Qt examples, https://www.qt.io/qt-examples-for-webassembly

That's kind of the goal.

Recent efforts to strip browsers down to their core functionality, and provide a world where the current web is effectively userland code:

* web components

* service workers

* Houdini

Imagine a future where browsers just implement these low level concepts, and HTML is defined as an (open source/community) library that all vendors bundle as part of their browser.

And then, also consider how much overlap there is here with traditional operating systems. Your next device OS could be just another layer on top.

Sounds like another Google plan to make adblocking impossible.

Check out https://css-houdini.rocks instead. Really well put together.

Reply on news.ycombinator.com