Live data from Hacker News

The future of web software is HTML over WebSockets

alistapart.com

301–310 of 337 posts

Re: The future of web software is HTML over WebSockets

#301

Earlier quoted context omitted.

The way to eliminate latency with server side state is called optimistic updates.

This is a next step for my project as I'm trying to figure out how to generalize client side predictions in a sane way. Basically, I'm happy with my latency (for board games) which I hope to migrate closer to people as more edge compute offerings emerge. However, I'm wondering what the path is to find some of these ideas in more latency sensitive applications. The explanation for how the net-code behind Overwatch is…

You don't have to predict. Requests just fall into two categories:

1) Nothing bad can happen if we show some optimistic result before server returns, but server side will end up in different result.

2) Something bad can happen. Accordingly, for (1) we can do optimistic update, for (2) can't

Re: The future of web software is HTML over WebSockets

#302

I have thoughts, and I agree but also disagree a bit. We are in the dark-ages with respect to streaming sockets, and I am the architect of one of the worlds largest WebSocket and streaming services. First off, unseating the operational benefits provided by request response is a huge challenge. It's possible, and I've done it. One of these days, my co-authors and I will present an OSDI paper with the broad strokes. It…

> It's very easy to fuck up the implicit state tied to the connection, and this requires discipline to get right. It's very easy to ship unreliable software that then has issues based on the connection.

I agree with this and it's why I believe that Phoenix LiveView is the best solution to this problem. The programming model and tooling that you get with the BEAM (along with things Phoenix provides like PubSub) are the best there is to manage this complexity.

Re: The future of web software is HTML over WebSockets

#303

Earlier quoted context omitted.

i'd encourage everyone thinking about using it to go read the code (it's fairly approachable) but in short it just connects each node in the cluster to each other node in the cluster via a tcp connection and sends packets between them. there's almost nothing as far as protocol, queue management, congestion control or traffic management. it's discovery mechanism is just shipping lists of peers around. pretty much any…

thanks for your answer so basically it relies on plain TCP and its reliability features. If you need something more sophisticated you gotta do it yourself within the application code (or using libs).

Elixir tends to have sophisticated libraries around what you really want that are plug and play with distributed erlang. (Phoenix pubsub/tracker/presence). Horde/swarm, etc.

Re: The future of web software is HTML over WebSockets

#304
Suppose I want to expand/contract a row view - toggle to see the details. The data is on the client and the HTML is already printed to the page; it just needs to be shown/hidden. You gunna hit the server to get back an HTML fragment that says ? If yes, you're certifiably insane. If no, then you need client-side JS, and you're therefore going to strike a compromise between all-on-the-server and all-on-the-client, which will probably differ depending on the project.

HTML over the wire is often a useful approach; it doesn't follow that "the future" is there.

Re: The future of web software is HTML over WebSockets

#305
post #284

Earlier quoted context omitted.

You are over complicating things. UI state should live in the client. Having the server maintain it is not only more complex but will also introduce a latency. Let's say I click a button to delete an item in the list. The button state goes to pressed, list loses focus, button takes focus, button unpressed, delete animation starts on deleted item, translation animations on the other items to slide into its place, new…

"UI state should live in the client." this is wrong and I think you have missed the point of the article. In server-rendered app, there's nothing like UI state. There's a request. This request and the database is enough to build response. There is no UI state. Your app can be (and often is) absolutely stateless and restult depends only on request and a state of the storage. While when you have SPA, API & server, you…

> In server-rendered app, there's nothing like UI state.

Of course there is.

For example, any state related to interactivity like forms, client-side validation, widgets, filters, etc.

Re: The future of web software is HTML over WebSockets

#306

I have thoughts, and I agree but also disagree a bit. We are in the dark-ages with respect to streaming sockets, and I am the architect of one of the worlds largest WebSocket and streaming services. First off, unseating the operational benefits provided by request response is a huge challenge. It's possible, and I've done it. One of these days, my co-authors and I will present an OSDI paper with the broad strokes. It…

> In essence, I am building a DIY database such that people connect directly to the database and get that sweet giant JSON object along with a stream of updates.

biff implements this as a framework, backed by the Crux bi-temporal DB. It natively uses EDN rather than JSON, but emitting JSON should be trivial if that's needed.

https://findka.com/biff/#introduction

https://opencrux.com/main/index.html

Re: The future of web software is HTML over WebSockets

#307

I have thoughts, and I agree but also disagree a bit. We are in the dark-ages with respect to streaming sockets, and I am the architect of one of the worlds largest WebSocket and streaming services. First off, unseating the operational benefits provided by request response is a huge challenge. It's possible, and I've done it. One of these days, my co-authors and I will present an OSDI paper with the broad strokes. It…

> There is a great deal of power in having your UI be a stateless function over a giant JSON object.

Something like this: http://jasonette.com

Re: The future of web software is HTML over WebSockets

#308

Earlier quoted context omitted.

Note that a websocket round trip is vastly shorter than an http round trip, though. If your payloads are small, 500 consecutive websocket back and forths take orders of magnitude less time than the "traditional" high level url post/fetch becauses there's none of the overhead of an http round trip.

A round trip is a round trip. Software can’t beat physics. If you want to do requests in parallel, http 2 and 3 can do them just fine. If it’s sequential, you won’t see a huge difference between something on websockets and http/1.1. The only thing you can save are a few header bytes. And it’s up to you how many headers you use

Why would software have to beat physics? HTTP communication and websocket communication uses completely different models.

And note that we're not talking about parallel request, those are not relevant to the "constant stream of small updates as the backend state updates" model described in the article, so let's not get side tracked, and talk about the actual stream of small fragment data in HTTP vs websockets.

Every HTTP connection (whether it's v1.1, v2, v3, or some even newer Google-flavoured "we came up with another one!" version) requires secure connection handshaking before any actual data may be sent. And if you're using any kind of session management, which you will be, now you're also spending time on cookie transmission before you get to payload transmission. And yes, there is the "Connection: Keep-Alive" header that can be set to allow more than one request per established connection, but any sane setup has that either on a small timeout (hundreds of ms at most), or on a low number of requests. You're still going to be establishing lots of connections, over and over, during the lifetime of the content at the client.

So, for many payloads a lengthy (compared to small payload transmission) HTTP connection negotiation has to happen. This is not the case for websockets, which by design are as if the "keep-alive" was set to "forever": they get initiated through a one-time HTTP call that contains an "upgrade this connection to a websocket" instruction header, after which we're done. This is now an open, persistent, bidirectional data socket.

Connection-wise, the amount of time required for HTTP vs. websocket is immense.

Secondly, let's not try to lend credence to an argument by hand waving the number of bytes in headers: the model discussed here concerns pushing small fragment updates to the client, in which headers constitute a significant part of the transmission. You can see this is modern sites that communicate small JSON fragments today where payloads like `{"error": false, "result": 12}` get dwarfed by the modern response headers, because yes "you control yoru headers" but you're not running your first server (in fact, you're almost certainly not running your own server at all, you paid a host): a response will contain not just the HTTP version and content type and length, but also the cache control value, the CSP and CORS headers, and almost certainly some extra stuff like the datetime, cookie expiration, x-frame-options, etc.

Using websockets makes an incredible difference in the model discussed in the article.

However, if you want to discuss the merits of the two completely different models, that's fair. Why would you even use the small-payloads push model? Who cares if the client has some state that "hopefully" mirrors the server? These are good questions, and unless you're writing a multi-user application with a web front-end, I genuinely don't see why the approach outlined in this article makes much sense.

Yeah, React kind of shat all over the web (and I say that as someone who quite likes React) because it was never designed with the purpose of generating web content. It was born as an interface library and never stopped being one. Its fault is being so damn easy to pick up which means that every site on the planet now uses React to build normal web pages and even do page routing, instead of having the devs write their code in React and then hitting the "and now generate that as static site with vanilla JS for the interactive bits" button. Because that button doesn't exist, instead it's esbuild (or previously, babel+webpack but thank god esbuild now exists so we don't have to use that anymore).

But that's a completely different discussion and really not related to how websockets are incredibly much better for the stateful server, thin client, many-small-updates push model.

Re: The future of web software is HTML over WebSockets

#309
post #203

Earlier quoted context omitted.

All connections are stateful the moment any kind of volatile data is added. The question is how to manage that state. Say you have a doctor that is associated to a group of patients and is allowed to update their patient's status. And if, while the doctor is filling something out for that patient, the patient changes doctors, then the current operation has to fail and the doctor needs to be notified of this change so…

> So what do you do with the stale list of patients in the browser DOM? Write the front end in something like Vue. When you catch an error from an axios call, update your data model by calling the server for updates. When the data model updates, Vue will automagically update the DOM used by the browser.

Right, but you can see how in some use cases it's important for the data to be relatively fresh, then you have to choose between polling and server push.

Re: The future of web software is HTML over WebSockets

#310

Earlier quoted context omitted.

Future-proofing is a good use case though. As a developer I don't want to maintain both SSE and WebSockets, since they solve similar problems and WebSockets are a superset of SSE. Even though my WebSockets implementation is currently unidirectional (server to client), I still opted for that over SSE because I'll probably need send data the other way at some point in the future. Why learn two tools when I can just lea…

What's wrong with normal HTTP requests for client->server streams? You get the added bonus of being able to dump them to a curl command for debugging.

More overhead, and it doesn't scale. My nodejs websockets server can handle thousands of connections without a problem, but my rails api server allocates a thread per connection so I'm limited to For infrequent requests everything goes through the api, but for stuff like chat and live-document-editing, nodejs is the better solution.
Post reply on HN